Closed benr77 closed 3 years ago
https://dev.materialdesignicons.com/getting-started/vuejs
Documented above. You want to use the component documented above. It's made by one of our core members, so it might move into @mdi/*
when I get a second.
Thank you for your response. For future reference, I actually went a different direction - the package you referred me to does not seem to support spin and sizing any more than Vuetify's <v-icon>
does, and seems to duplicate the Vuetify functionality. I admit I spent only a very short time assessing this so could easily be wrong.
Instead, I just went for some raw CSS based on https://stackoverflow.com/a/42745673/3877234
.icon-spinner {
animation: spin-animation 1.5s infinite;
display: inline-block;
}
@keyframes spin-animation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(359deg);
}
}
Followed by the component
<v-icon class="icon-spinner" x-large>{{ iconLoading }}</v-icon>
This solution is pretty lightweight, configurable, and should work with any icon pack.
Previously I used Vuetify and inserted an icon like
<v-icon>loading mdi-spin mdi-36px</v-icon
Now I'm using this library and doing
import { mdiLoading } from '@mdi/js';
The icon itself is working just fine.
Is it possible to attach the spin and size modifications when using the icons in this way?
Thank you