c3d2/yammat
c3d2
/
yammat
38
0
Fork 1
Code Issues Pull Requests Releases Activity

shake it baby

This commit is contained in:
nek0 2015-04-05 03:22:12 +02:00
parent 71bb0d6f85
commit 425a815435
1 changed files with 66 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
static/css/main.css
View File

@ -65,6 +65,21 @@ th {
h1 {
text-align: center;
display: block;
position: relative;
transform-origin: 50% 50%;
animation-name: shake;
animation-duration: 0.8s;
animation-iteration-count: infinite;
animation-timing-function: linear;
-webkit-animation-name: shake;
-webkit-animation-duration: 0.8s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
-moz-animation-name: shake;
-moz-animation-duration: 0.8s;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: linear;
}
input[type="submit"] {
@ -84,3 +99,54 @@ input[type="submit"] {
line-height: 7em;
}
}
@keyframes shake {
0% {transform: translate(2px, 1px) rotate(0deg);
color: black;}
10% {transform: translate(-1px, -2px) rotate(-1deg);}
20% {transform: translate(-3px, 0px) rotate(1deg);}
30% {transform: translate(0px, 2px) rotate(0deg);}
40% {transform: translate(1px, -1px) rotate(1deg);}
50% {transform: translate(-1px, 1px) rotate(-1deg);
color: red;}
60% {transform: translate(-3px, -2px) rotate(0deg);}
70% {transform: translate(2px, 1px) rotate(-1deg);}
80% {transform: translate(-1px, -2px) rotate(1deg);}
90% {transform: translate(2px, -1px) rotate(0deg);}
100% {transform: translate(1px, -2px) rotate(-1deg);
color: black;}
}
@-webkit-keyframes shake {
0% {-webkit-transform: translate(2px, 1px) rotate(0deg);
color: black;}
10% {-webkit-transform: translate(-1px, -2px) rotate(-1deg);}
20% {-webkit-transform: translate(-3px, 0px) rotate(1deg);}
30% {-webkit-transform: translate(0px, 2px) rotate(0deg);}
40% {-webkit-transform: translate(1px, -1px) rotate(1deg);}
50% {-webkit-transform: translate(-1px, 1px) rotate(-1deg);
color: red;}
60% {-webkit-transform: translate(-3px, -2px) rotate(0deg);}
70% {-webkit-transform: translate(2px, 1px) rotate(-1deg);}
80% {-webkit-transform: translate(-1px, -2px) rotate(1deg);}
90% {-webkit-transform: translate(2px, -1px) rotate(0deg);}
100% {-webkit-transform: translate(1px, -2px) rotate(-1deg);
color: black;}
}
@-moz-keyframes shake {
0% {-moz-transform: translate(2px, 1px) rotate(0deg);
color: black;}
10% {-moz-transform: translate(-1px, -2px) rotate(-1deg);}
20% {-moz-transform: translate(-3px, 0px) rotate(1deg);}
30% {-moz-transform: translate(0px, 2px) rotate(0deg);}
40% {-moz-transform: translate(1px, -1px) rotate(1deg);}
50% {-moz-transform: translate(-1px, 1px) rotate(-1deg);
color: red;}
60% {-moz-transform: translate(-3px, -2px) rotate(0deg);}
70% {-moz-transform: translate(2px, 1px) rotate(-1deg);}
80% {-moz-transform: translate(-1px, -2px) rotate(1deg);}
90% {-moz-transform: translate(2px, -1px) rotate(0deg);
color: black;}
100% {-moz-transform: translate(1px, -2px) rotate(-1deg);}
}