vuestic-ui
Version:
Vue 3 UI Framework
40 lines • 931 B
CSS
:root,
:host {
--va-icon-vertical-align: middle;
--va-icon-user-select: none;
}
.va-icon {
vertical-align: var(--va-icon-vertical-align);
-webkit-user-select: var(--va-icon-user-select);
-moz-user-select: var(--va-icon-user-select);
user-select: var(--va-icon-user-select);
}
.va-icon[role^=button][tabindex]:not([tabindex^="-"]) {
cursor: pointer;
}
.va-icon[role^=button][tabindex]:not([tabindex^="-"]):focus-visible {
outline: 2px solid var(--va-focus) ;
border-radius: 2px;
}
.va-icon.va-icon {
font-style: normal;
}
.va-icon--spin {
animation: va-icon--spin-animation 1500ms linear infinite;
}
.va-icon--spin-reverse {
animation: va-icon--spin-animation 1500ms linear infinite;
animation-direction: reverse;
}
@keyframes va-icon--spin-animation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.va-icon svg {
fill: currentColor;
height: 100%;
}