159 lines
4.8 KiB
CSS
159 lines
4.8 KiB
CSS
/**
|
|
*
|
|
* Main container
|
|
*
|
|
*/
|
|
#addToHomeScreen {
|
|
z-index:9999;
|
|
-webkit-user-select:none;
|
|
-webkit-box-sizing:border-box;
|
|
width:240px;
|
|
font-size:15px;
|
|
padding:12px 14px;
|
|
text-align:left;
|
|
font-family:helvetica;
|
|
background-image:-webkit-gradient(linear,0 0,0 100%,color-stop(0,#fff),color-stop(0.02,#eee),color-stop(0.98,#ccc),color-stop(1,#a3a3a3));
|
|
border:1px solid #505050;
|
|
-webkit-border-radius:8px;
|
|
-webkit-background-clip:padding-box;
|
|
color:#333;
|
|
text-shadow:0 1px 0 rgba(255,255,255,0.75);
|
|
line-height:130%;
|
|
-webkit-box-shadow:0 0 4px rgba(0,0,0,0.5);
|
|
}
|
|
|
|
#addToHomeScreen.addToHomeIpad {
|
|
width:268px;
|
|
font-size:18px;
|
|
padding:14px;
|
|
}
|
|
|
|
/**
|
|
*
|
|
* The 'wide' class is added when the popup contains the touch icon
|
|
*
|
|
*/
|
|
#addToHomeScreen.addToHomeWide {
|
|
width:296px;
|
|
}
|
|
|
|
#addToHomeScreen.addToHomeIpad.addToHomeWide {
|
|
width:320px;
|
|
font-size:18px;
|
|
padding:14px;
|
|
}
|
|
|
|
/**
|
|
*
|
|
* The balloon arrow
|
|
*
|
|
*/
|
|
#addToHomeScreen .addToHomeArrow {
|
|
position:absolute;
|
|
background-image:-webkit-gradient(linear,0 0,100% 100%,color-stop(0,rgba(204,204,204,0)),color-stop(0.4,rgba(204,204,204,0)),color-stop(0.4,#ccc));
|
|
border-width:0 1px 1px 0;
|
|
border-style:solid;
|
|
border-color:#505050;
|
|
width:16px; height:16px;
|
|
-webkit-transform:rotateZ(45deg);
|
|
bottom:-9px; left:50%;
|
|
margin-left:-8px;
|
|
-webkit-box-shadow:inset -1px -1px 0 #a9a9a9;
|
|
-webkit-border-bottom-right-radius:2px;
|
|
}
|
|
|
|
|
|
/**
|
|
*
|
|
* The balloon arrow for iPad
|
|
*
|
|
*/
|
|
#addToHomeScreen.addToHomeIpad .addToHomeArrow {
|
|
-webkit-transform:rotateZ(-135deg);
|
|
background-image:-webkit-gradient(linear,0 0,100% 100%,color-stop(0,rgba(238,238,238,0)),color-stop(0.4,rgba(238,238,238,0)),color-stop(0.4,#eee));
|
|
-webkit-box-shadow:inset -1px -1px 0 #fff;
|
|
top:-9px; bottom:auto; left:50%;
|
|
}
|
|
|
|
|
|
/**
|
|
*
|
|
* Close button
|
|
*
|
|
*/
|
|
#addToHomeScreen .addToHomeClose {
|
|
-webkit-box-sizing:border-box;
|
|
position:absolute;
|
|
right:4px;
|
|
top:4px;
|
|
width:18px;
|
|
height:18px; line-height:14px;
|
|
text-align:center;
|
|
text-indent:1px;
|
|
-webkit-border-radius:9px;
|
|
background:rgba(0,0,0,0.12);
|
|
color:#707070;
|
|
-webkit-box-shadow:0 1px 0 #fff;
|
|
font-size:16px;
|
|
}
|
|
|
|
|
|
/**
|
|
*
|
|
* The '+' icon, displayed only on iOS < 4.2
|
|
*
|
|
*/
|
|
#addToHomeScreen .addToHomePlus {
|
|
font-weight:bold;
|
|
font-size:1.3em;
|
|
}
|
|
|
|
|
|
/**
|
|
*
|
|
* The 'share' icon, displayed only on iOS >= 4.2
|
|
*
|
|
*/
|
|
#addToHomeScreen .addToHomeShare {
|
|
display:inline-block;
|
|
width:18px;
|
|
height:15px;
|
|
background-repeat:no-repeat;
|
|
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAQAAABDj1eZAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAUdJREFUKFNtkLtLw1AYxS/qJLhXVKr2ZRulUNtiqgSb3CziICI6ucTFVYcOnaQOFRwUnNTRwUWXgpP/QdHNUEQUHGxofYBTlRs83iZNjKTncOGe7/vx3QchXUWn6FL3jhfKUdCCr5zuifV5oDiHQM+c+CIhiiCSWNu08iq9oHXKLAiqrgR4UXqlOEYZt++ExEL0wW7+OW0G10muLv9gmqfe5FAWKmTMYQYiFL7PYwyLOD8lSjNh2gdnPzMII4QUBxc4OothbAF7GCBKQ0YbSWyPQsIhqvetS+y0ygGMo/KFZfviDvR4AhwgZU9dGYnA0J/6ndc15i3ouYIMcVVUcEXIoOxCeRCfwP8sXBSdjtpUv/1QW+K16kCCIUC4id9Fa0JtkluwVkSfqPL6RwfSDA0aNlx7k/bWgViB7bMS2/1vk5sdsZLN/ALSuL3tylO4RAAAAABJRU5ErkJggg==);
|
|
background-size:18px 15px;
|
|
text-indent:-9999em;
|
|
overflow:hidden;
|
|
}
|
|
|
|
|
|
/**
|
|
*
|
|
* The touch icon (if available)
|
|
*
|
|
*/
|
|
#addToHomeScreen .addToHomeTouchIcon {
|
|
display:block;
|
|
float:left;
|
|
-webkit-border-radius:6px;
|
|
-webkit-box-shadow:0 1px 3px rgba(0,0,0,0.5),
|
|
inset 0 0 2px rgba(255,255,255,0.9);
|
|
background-repeat:no-repeat;
|
|
width:57px; height:57px;
|
|
-webkit-background-size:57px 57px;
|
|
margin:0 12px 0 0;
|
|
border:1px solid #333;
|
|
-webkit-background-clip:padding-box;
|
|
}
|
|
|
|
|
|
/**
|
|
*
|
|
* The 'share' icon for retina display
|
|
*
|
|
*/
|
|
@media all and (-webkit-min-device-pixel-ratio: 2) {
|
|
#addToHomeScreen .addToHomeShare {
|
|
background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAQAAADu6HTYAAADPElEQVR4Xq3TX2gcRRzA8e/M7mVv2+TSNpc/TZtrY6jUGqgaSAmEChKLrYK0YH0RFC2CSCkEfCghiKU04J8qNigq6os+iQV98MHWFwVBrQQRWs21lBw5cw3NNb1/udu72RGG5Y77IzXW77D7sAwf5scyYoL6BGXSDKFZwaGpLvIUaeoCkvX1MmsM0Ny6oRSQYOLuIS+YZOpfQdqslpUxcZrzTVAz4qPwW2O3CeIwC/RSzeY6Ow1QhUrkr+YOWfEKDkEP8Rij7CHKJmrFSDHBdwGEE5wiGChPN+PnT8VdRtEIl1d4gRj/1EVe5ZSBKGh8iqQpo/Fo5+3C/gz0MYg4zgwbqday1/Q4B8BGQ45d/Hi54lakCrU5obOcidJpu1+Lg9whjabyaOYLnrIBFFaRD+xe2ybMDWY66GmP/WA9cGfGp0CWhy0wkMN8inepFiH2rV1j0NQSNQbFLRQnS8/8YSDBBpadfv4CYDub2fmeHDNAsL1MBWUel0iA+Xik6eHcyvD3vAMSU1TGuA/YRS+dD7ovCQN43GKRFCU20Kd3V/avDVVyAZ5niTEuLA5/zBGWg9EEEhfJKN200Tat8CmRAQb9+wv7soPlHt2tQorsz1uPbr0HTY4sJwrH47zJZwABBAKLMBoQXepwgTwdHCo+fXMkQ4lrxEmQ5AaXipPqDY9V2vn09tgvTPI71EEGYxM+/uMJLJ4svpgaWGKOi/xKgmqLSUGSUd5f2vIVJ/CgBaTIUsZ7ZBsn0+NzfMOXLFCXQyTcybN6ep5ZZgUOHn7jpfUpsZshdugPGf+E5zjbyHTSRyQ8xfRPPM/s63RHeuknSoT22mjmmnAOIMkUZ6D1xSfPPAfd1WFKM3sO2CMaHx8M1NjnXKHaAGGkOW0C02WeYHUz4qMtx+w5gUDS8NckYe5lHsMYwCZEPyEEmjLDZFmAS7CDviMdxyTkMNVBKEmYLvbiQQBIBBbCQG04bGQvFWz6CfsCQLWCigILFwcfkGYBiOpbYuOizTAyYyDdCtrGaRG1LCkIgMYEFhI0WqQZoSlbGRyHKe4qOx7iv2bVQW9dp4dlM/x6kmwnWQcd/Q3FCqwTEiT5s+6D5v/pb0SSHyg7uhMWAAAAAElFTkSuQmCC);
|
|
}
|
|
}
|