60 lines
917 B
CSS
60 lines
917 B
CSS
@keyframes vibrate {
|
|
0%,
|
|
100% {
|
|
scale: 1;
|
|
transform: rotate(0deg);
|
|
}
|
|
20%,
|
|
40%,
|
|
60%,
|
|
80% {
|
|
transform: rotate(5deg);
|
|
}
|
|
|
|
20% {
|
|
scale: 0.95;
|
|
}
|
|
|
|
50% {
|
|
scale: 1.05;
|
|
}
|
|
|
|
80% {
|
|
scale: 0.95;
|
|
}
|
|
|
|
10%,
|
|
30%,
|
|
50%,
|
|
70%,
|
|
90% {
|
|
transform: rotate(-5deg);
|
|
}
|
|
}
|
|
|
|
.ticket {
|
|
display: inline-flex;
|
|
}
|
|
|
|
a:not([disabled]):hover > .ticket svg,
|
|
.ticket:not(a[disabled] .ticket):hover svg {
|
|
animation: vibrate 0.5s forwards;
|
|
}
|
|
|
|
.ticket:not(a[disabled] .ticket):hover svg path:not(.dot),
|
|
a:not([disabled]):hover > .ticket svg path:not(.dot) {
|
|
fill: var(--color-season);
|
|
stroke: var(--color-season);
|
|
}
|
|
a.to-blank:hover > .ticket svg path:not(.dot) {
|
|
fill: #fff;
|
|
stroke: #fff;
|
|
}
|
|
|
|
.ticket:not(a[disabled] .ticket):hover svg path.dot,
|
|
a:not([disabled]):hover > .ticket svg path.dot {
|
|
fill: #fff;
|
|
}
|
|
a.to-blank:hover > .ticket svg path.dot {
|
|
fill: var(--color-season);
|
|
}
|