8211c78287
Signed-off-by: Tobias Erbshäußer <tobias@tesoft.dev>
52 lines
1.9 KiB
Plaintext
52 lines
1.9 KiB
Plaintext
<template id="tesoft-loader-template">
|
|
<style>
|
|
@import "/src/styles/default.css";
|
|
|
|
:host {
|
|
display: block;
|
|
width: 4.8rem;
|
|
height: 4.8rem;
|
|
}
|
|
|
|
@keyframes rotate {
|
|
from {
|
|
transform: rotate(360deg);
|
|
}
|
|
to {
|
|
transform: rotate(0deg);
|
|
}
|
|
}
|
|
|
|
.loading {
|
|
animation: rotate 2s linear infinite;
|
|
transform-origin: center;
|
|
}
|
|
|
|
.dark {
|
|
fill: var(--dark-gray);
|
|
}
|
|
|
|
.bright {
|
|
fill: var(--light-gray);
|
|
}
|
|
</style>
|
|
|
|
<svg viewBox="0 0 64 64" xmlns="http://www.w3.org/2000/svg">
|
|
<circle class="dark" cx="32" cy="32" r="32" stroke-width="1.5783"/>
|
|
<path class="bright"
|
|
d="m32 2a30 30 0 0 0-30 30 30 30 0 0 0 30 30 30 30 0 0 0 30-30 30 30 0 0 0-30-30zm0 4a26 26 0 0 1 26 26 26 26 0 0 1-26 26 26 26 0 0 1-26-26 26 26 0 0 1 26-26zm0 19a7 7 0 0 0-7 7 7 7 0 0 0 7 7 7 7 0 0 0 7-7 7 7 0 0 0-7-7z"
|
|
stroke-width="1.0568"/>
|
|
<path class="bright loading"
|
|
d="m32 9a23 23 0 0 0-23 23h5a18 18 0 0 1 18-18v-5zm0 7a16 16 0 0 0-16 16h5a11 11 0 0 1 11-11v-5zm11 16a11 11 0 0 1-11 11v5a16 16 0 0 0 16-16h-5zm7 0a18 18 0 0 1-18 18v5a23 23 0 0 0 23-23h-5z"
|
|
stroke-width="2.4251"/>
|
|
<path class="dark"
|
|
d="m45.645 32.951-12.727 12.729 2.1211 2.1211-16.199 16.199h11.312l10.543-10.543 2.1211 2.1211 12.729-12.727-9.9004-9.9004z"
|
|
stroke-width="2"/>
|
|
<path class="bright"
|
|
d="m45.645 35.779-9.8984 9.9004 2.1211 2.1211-16.199 16.199h5.6562l13.371-13.371 2.1211 2.1211 9.9004-9.8984-7.0723-7.0723zm0 4.2441 2.8281 2.8281-5.6562 5.6562-2.8281-2.8281 5.6562-5.6562z"
|
|
stroke-width="1.184"/>
|
|
</svg>
|
|
</template>
|
|
|
|
<script src="/src/components/loader.ts" type="module"></script>
|