diff options
Diffstat (limited to 'phonegap/www/css/mobile.css')
| -rw-r--r-- | phonegap/www/css/mobile.css | 179 |
1 files changed, 179 insertions, 0 deletions
diff --git a/phonegap/www/css/mobile.css b/phonegap/www/css/mobile.css new file mode 100644 index 000000000..f17f753fd --- /dev/null +++ b/phonegap/www/css/mobile.css @@ -0,0 +1,179 @@ +/* stop scrolling on iphone */ +#container { + width: 100%; + height: 100%; +} + +#container .container { + padding-bottom: 0; +} + +.mobile-nav-banner { + position: fixed; + background: black; +} + +.mobile-sign-in-banner { + display: none; + background: none; +} + +.mobile-sign-in-banner a { + position: absolute; + left: auto; + right: 0.3em; + top: 0.8em; +} + +.mobile-info { + position: fixed; + bottom: 0px; + width: 100%; + height: 20px; + text-align: right; + z-index: 1; +} + +.mobile-info a { + cursor: pointer; + font-size: 0.875em; + font-family: Helmet, Freesans, sans-serif; + font-weight: bold; + line-height: 1.375em; + padding: 0.7em 0.5em 0.5em 0.5em; + margin: 0; + width: auto; + height: auto; + -moz-border-radius: 4px; + -webkit-border-radius: 4px; + -o-border-radius: 4px; + -ms-border-radius: 4px; + -khtml-border-radius: 4px; + border-radius: 4px; + background: #333333; + background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #333333), color-stop(100%, #1a1a1a)); + background: -webkit-linear-gradient(#333333, #1a1a1a); + background: -moz-linear-gradient(#333333, #1a1a1a); + background: -o-linear-gradient(#333333, #1a1a1a); + background: -ms-linear-gradient(#333333, #1a1a1a); + background: linear-gradient(#333333, #1a1a1a); + border: 1px solid #1a1a1a; + color: white; + font-weight: normal; + font-size: 0.875em; + line-height: 1; + padding: 0.5em 0.75em; + position: absolute; + right: 0.3em; + bottom: 0.3em; +} + +.mobile-header { + margin-top: 35px; +} + +.mobile-header #site-logo { + margin-top: 35px; +} + +#front-main #postcodeForm { + padding-top: 0.5em; + padding-bottom: 0.5em; +} + +#front-main #postcodeForm label { + font-size: 0.9em +} + +#front-main a#geolocate_link { + font-size: 1.2em; + -moz-border-radius: 0.25em; + -webkit-border-radius: 0.25em; + -o-border-radius: 0.25em; + -ms-border-radius: 0.25em; + -khtml-border-radius: 0.25em; + border-radius: 0.25em; + margin-top: 0.5em; +} + +#front-howto h2 { + margin-top: 0.8em; +} + +ol.big-numbers > li { + margin-bottom: 0.8em; +} + +#multiple { + margin: auto; + margin-bottom: 1em; +} + +#multiple li { + list-style: none; + margin: auto; +} + +#nav-link { + display: none; +} + +#form_sign_in { + margin-top: 1em; +} + +#sign_out, +#sign_in { + display: none; +} + +input.green-btn, +input.green-btn:hover { + border-radius: 2px; + background: #9fde23; + border-top: #CAEF80; + border-left: #BCEF58; + border-right: #BCEF58; +} + +#loadingSpinner { + display: none; +} + +div.spinner { + position: absolute; + width: 54px; + height: 54px; + display: inline-block; +} + +div.spinner div { + width: 12%; + height: 26%; + background: #000; + position: absolute; + left: 44.5%; + top: 37%; + opacity: 0; + -webkit-animation: fade 1s linear infinite; + -webkit-border-radius: 50px; + -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.2); +} + +div.spinner div.bar1 {-webkit-transform:rotate(0deg) translate(0, -142%); -webkit-animation-delay: 0s;} +div.spinner div.bar2 {-webkit-transform:rotate(30deg) translate(0, -142%); -webkit-animation-delay: -0.9167s;} +div.spinner div.bar3 {-webkit-transform:rotate(60deg) translate(0, -142%); -webkit-animation-delay: -0.833s;} +div.spinner div.bar4 {-webkit-transform:rotate(90deg) translate(0, -142%); -webkit-animation-delay: -0.75s;} +div.spinner div.bar5 {-webkit-transform:rotate(120deg) translate(0, -142%); -webkit-animation-delay: -0.667s;} +div.spinner div.bar6 {-webkit-transform:rotate(150deg) translate(0, -142%); -webkit-animation-delay: -0.5833s;} +div.spinner div.bar7 {-webkit-transform:rotate(180deg) translate(0, -142%); -webkit-animation-delay: -0.5s;} +div.spinner div.bar8 {-webkit-transform:rotate(210deg) translate(0, -142%); -webkit-animation-delay: -0.41667s;} +div.spinner div.bar9 {-webkit-transform:rotate(240deg) translate(0, -142%); -webkit-animation-delay: -0.333s;} +div.spinner div.bar10 {-webkit-transform:rotate(270deg) translate(0, -142%); -webkit-animation-delay: -0.25s;} +div.spinner div.bar11 {-webkit-transform:rotate(300deg) translate(0, -142%); -webkit-animation-delay: -0.1667s;} +div.spinner div.bar12 {-webkit-transform:rotate(330deg) translate(0, -142%); -webkit-animation-delay: -0.0833s;} + +@-webkit-keyframes fade { + from {opacity: 1;} + to {opacity: 0.25;} +} |