47 lines
1.2 KiB
CSS
47 lines
1.2 KiB
CSS
|
|
@keyframes shiny-btn1 {
|
|
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
|
|
80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
|
|
81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
|
|
100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
|
|
}
|
|
|
|
@keyframes shake {
|
|
0% { -webkit-transform: translateX(0); }
|
|
10% { -webkit-transform: translateX(-10px); }
|
|
20% { -webkit-transform: translateX(10px); }
|
|
30% { -webkit-transform: translateX(-10px); }
|
|
40% { -webkit-transform: translateX(10px); }
|
|
50% { -webkit-transform: translateX(-10px); }
|
|
60% { -webkit-transform: translateX(10px); }
|
|
70% { -webkit-transform: translateX(-10px); }
|
|
80% { -webkit-transform: translateX(10px); }
|
|
90% { -webkit-transform: translateX(-10px); }
|
|
100% { -webkit-transform: translateX(0); }
|
|
}
|
|
|
|
|
|
.shinyButton {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.shinyButton:before {
|
|
position: absolute;
|
|
content: '';
|
|
display: inline-block;
|
|
top: -180px;
|
|
left: 0;
|
|
width: 30px;
|
|
height: 100%;
|
|
background-color: #fff;
|
|
animation: shiny-btn1 3s ease-in-out infinite;
|
|
}
|
|
|
|
.shake {
|
|
animation: shake 1s;
|
|
animation-iteration-count: 1;
|
|
}
|
|
|
|
.code {
|
|
background-color: rgba(0.2,0.2,0.2,0.2);
|
|
} |