animation for alert messages
This commit is contained in:
parent
663f9f6d2d
commit
ac82f3dcd2
|
@ -6337,3 +6337,77 @@ a#shifts td.collides:hover {
|
|||
.messages a:focus {
|
||||
outline: none;
|
||||
}
|
||||
.messages span.text-danger {
|
||||
animation: pulse 1s infinite;
|
||||
-webkit-animation: pulse 1s infinite;
|
||||
-moz-animation: pulse 1s infinite;
|
||||
}
|
||||
@keyframes pulse {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
10% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
20% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
30% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
40% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg) translateY(-2px);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(0deg) translateY(0px);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes pulse {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
10% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
20% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
30% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
40% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg) translateY(-2px);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(0deg) translateY(0px);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes pulse {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
10% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
20% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
30% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
40% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg) translateY(-2px);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(0deg) translateY(0px);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -6360,6 +6360,80 @@ a#shifts td.collides:hover {
|
|||
.messages a:focus {
|
||||
outline: none;
|
||||
}
|
||||
.messages span.text-danger {
|
||||
animation: pulse 1s infinite;
|
||||
-webkit-animation: pulse 1s infinite;
|
||||
-moz-animation: pulse 1s infinite;
|
||||
}
|
||||
@keyframes pulse {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
10% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
20% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
30% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
40% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg) translateY(-2px);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(0deg) translateY(0px);
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes pulse {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
10% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
20% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
30% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
40% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg) translateY(-2px);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(0deg) translateY(0px);
|
||||
}
|
||||
}
|
||||
@-moz-keyframes pulse {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
10% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
20% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
30% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
40% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg) translateY(-2px);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(0deg) translateY(0px);
|
||||
}
|
||||
}
|
||||
.text-primary,
|
||||
.text-primary:hover {
|
||||
color: #428bca;
|
||||
|
|
|
@ -42,3 +42,81 @@ body {
|
|||
outline: none;
|
||||
}
|
||||
}
|
||||
|
||||
.messages span.text-danger {
|
||||
animation: pulse 1s infinite;
|
||||
-webkit-animation: pulse 1s infinite;
|
||||
-moz-animation: pulse 1s infinite;
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
10% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
20% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
30% {
|
||||
transform: rotate(5deg) translateY(-2px);;
|
||||
}
|
||||
40% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg) translateY(-2px);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(0deg) translateY(0px);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes pulse {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
10% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
20% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
30% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
40% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg) translateY(-2px);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(0deg) translateY(0px);
|
||||
}
|
||||
}
|
||||
|
||||
@-moz-keyframes pulse {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
10% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
20% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
30% {
|
||||
transform: rotate(5deg) translateY(-2px);
|
||||
}
|
||||
40% {
|
||||
transform: rotate(-5deg);
|
||||
}
|
||||
50% {
|
||||
transform: rotate(0deg) translateY(-2px);
|
||||
}
|
||||
75% {
|
||||
transform: rotate(0deg) translateY(0px);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue