Files
2026-01-05 12:47:14 +08:00

97 lines
2.1 KiB
SCSS

.nut-icon {
position: relative;
display: inline-block;
width: $icon-width;
height: $icon-height;
line-height: $icon-line-height;
text-align: right;
--animate-duration: 1s;
--animate-delay: 0s;
&::before {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
&__img {
width: $icon-width;
height: $icon-height;
object-fit: contain;
}
&-loading,
&-loading1 {
display: inline-block;
animation: rotation 1s infinite linear;
}
&-am-infinite {
animation-iteration-count: infinite;
animation-direction: alternate;
}
&-am-jump {
animation-name: nutJumpOne;
animation-duration: var(--animate-duration);
animation-timing-function: ease;
animation-delay: var(--animate-delay);
&.nut-icon-am-infinite {
animation-name: nutJump;
}
}
&-am-rotate {
animation-name: rotation;
animation-duration: var(--animate-duration);
animation-timing-function: linear;
animation-delay: var(--animate-delay);
&.nut-icon-am-infinite {
animation-direction: normal;
}
}
&-am-blink {
animation-name: nutBlink;
animation-duration: var(--animate-duration);
animation-timing-function: linear;
animation-delay: var(--animate-delay);
}
&-am-breathe {
animation-name: nutBreathe;
animation-duration: var(--animate-duration);
animation-timing-function: ease-in-out;
animation-delay: var(--animate-delay);
}
&-am-flash {
animation-name: nutFlash;
animation-duration: var(--animate-duration);
animation-timing-function: ease-in-out;
animation-delay: var(--animate-delay);
}
&-am-bounce {
animation-name: nutBounce;
animation-duration: var(--animate-duration);
animation-timing-function: ease-in-out;
animation-delay: var(--animate-delay);
&.nut-icon-am-infinite {
animation-direction: normal;
}
}
&-am-shake {
animation-name: nutShake;
animation-duration: var(--animate-duration);
animation-timing-function: ease-in-out;
animation-delay: var(--animate-delay);
}
}