mirror/ZiviScanner
Archived
1
0
Fork 0
Code Releases Activity

formatted css

Browse source
This commit is contained in:
Lukas Winkler 2016-10-25 15:09:51 +02:00
parent 36b4245fb5
commit 21aaf01772
1 changed files with 65 additions and 67 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

110
www/css/index.css
View file

@ -1,97 +1,95 @@
* { * {
-webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */ -webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
} }
body { body {
-webkit-touch-callout: none; /* prevent callout to copy image, etc when tap to hold */ -webkit-touch-callout: none; /* prevent callout to copy image, etc when tap to hold */
-webkit-text-size-adjust: none; /* prevent webkit from resizing text to fit */ -webkit-text-size-adjust: none; /* prevent webkit from resizing text to fit */
-webkit-user-select: none; /* prevent copy paste, to allow, change 'none' to 'text' */ -webkit-user-select: none; /* prevent copy paste, to allow, change 'none' to 'text' */
background-color:#E4E4E4; background-color: #E4E4E4;
background-image:linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%); background-image: linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%);
background-image:-webkit-linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%); background-image: -webkit-linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%);
background-image:-ms-linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%); background-image: -ms-linear-gradient(top, #A7A7A7 0%, #E4E4E4 51%);
background-image:-webkit-gradient( background-image: -webkit-gradient(
linear, linear,
left top, left top,
left bottom, left bottom,
color-stop(0, #A7A7A7), color-stop(0, #A7A7A7),
color-stop(0.51, #E4E4E4) color-stop(0.51, #E4E4E4)
); );
background-attachment:fixed; background-attachment: fixed;
font-family:'HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif; font-family: 'HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif;
font-size:12px; font-size: 12px;
height:100%; height: 100%;
margin:0px; margin: 0px;
padding:0px; padding: 0px;
text-transform:uppercase; text-transform: uppercase;
width:100%; width: 100%;
}
/* Portrait layout (default) */
.app {
background:url(../img/logo.png) no-repeat center top; /* 170px x 200px */
position:absolute; /* position in the center of the screen */
left:50%;
top:50%;
height:50px; /* text area height */
width:225px; /* text area width */
text-align:center;
padding:180px 0px 0px 0px; /* image height is 200px (bottom 20px are overlapped with text) */
margin:-115px 0px 0px -112px; /* offset vertical: half of image height and text area height */
/* offset horizontal: half of text area width */
} }
/* Landscape layout (with min-width) */ /* Landscape layout (with min-width) */
@media screen and (min-aspect-ratio: 1/1) and (min-width:400px) { @media screen and (min-aspect-ratio: 1/1) and (min-width: 400px) {
.app { .app {
background-position:left center; background-position: left center;
padding:75px 0px 75px 170px; /* padding-top + padding-bottom + text area = image height */ padding: 75px 0px 75px 170px; /* padding-top + padding-bottom + text area = image height */
margin:-90px 0px 0px -198px; /* offset vertical: half of image height */ margin: -90px 0px 0px -198px; /* offset vertical: half of image height */
/* offset horizontal: half of image width and text area width */ /* offset horizontal: half of image width and text area width */
} }
} }
h1 { h1 {
font-size:24px; font-size: 24px;
font-weight:normal; font-weight: normal;
margin:0px; margin: 0px;
overflow:visible; overflow: visible;
padding:0px; padding: 0px;
text-align:center; text-align: center;
} }
.event { .event {
border-radius:4px; border-radius: 4px;
-webkit-border-radius:4px; -webkit-border-radius: 4px;
color:#FFFFFF; color: #FFFFFF;
font-size:12px; font-size: 12px;
margin:0px 30px; margin: 0px 30px;
padding:2px 0px; padding: 2px 0px;
} }
.event.listening { .event.listening {
background-color:#333333; background-color: #333333;
display:block; display: block;
} }
.event.received { .event.received {
background-color:#4B946A; background-color: #4B946A;
display:none; display: none;
} }
@keyframes fade { @keyframes fade {
from { opacity: 1.0; } from {
50% { opacity: 0.4; } opacity: 1.0;
to { opacity: 1.0; } }
50% {
opacity: 0.4;
}
to {
opacity: 1.0;
}
} }
@-webkit-keyframes fade { @-webkit-keyframes fade {
from { opacity: 1.0; } from {
50% { opacity: 0.4; } opacity: 1.0;
to { opacity: 1.0; } }
50% {
opacity: 0.4;
}
to {
opacity: 1.0;
}
} }
.blink { .blink {
animation:fade 3000ms infinite; animation: fade 3000ms infinite;
-webkit-animation:fade 3000ms infinite; -webkit-animation: fade 3000ms infinite;
} }