pinafore/src/routes/_components/LoadingSpinner.html
Nolan Lawson 880bc7a38a
perf: use a separate icons.svg file (#1067)
* perf: use a separate icons.svg file

This splits icons into inline and non-inline. The inline ones are high
priority; the rest go in an icons.svg file.

* create SvgIcon.html

* determine inlined svgs at build time
2019-03-02 19:02:06 -08:00

28 lines
543 B
HTML

<SvgIcon className="loading-spinner-icon spin {maskStyle ? 'mask-style' : ''}"
style="width: {size}px; height: {size}px;"
href="#fa-spinner"
ariaLabel="Loading"
/>
<style>
:global(.loading-spinner-icon) {
fill: var(--svg-fill);
}
:global(.loading-spinner-icon.mask-style) {
fill: var(--mask-svg-fill);
}
</style>
<script>
import SvgIcon from './SvgIcon.html'
export default {
data: () => ({
maskStyle: false,
size: 64
}),
components: {
SvgIcon
}
}
</script>