mirror of
https://github.com/uiverse-io/galaxy.git
synced 2025-11-27 20:50:21 +08:00
81 lines
1.2 KiB
HTML
81 lines
1.2 KiB
HTML
<div class="loader">
|
|
<p class="text">
|
|
<span class="letter letter1">L</span>
|
|
<span class="letter letter2">o</span>
|
|
<span class="letter letter3">a</span>
|
|
<span class="letter letter4">d</span>
|
|
<span class="letter letter5">i</span>
|
|
<span class="letter letter6">n</span>
|
|
<span class="letter letter7">g</span>
|
|
<span class="letter letter8">.</span>
|
|
<span class="letter letter9">.</span>
|
|
<span class="letter letter10">.</span>
|
|
</p>
|
|
</div>
|
|
<style>
|
|
/* From Uiverse.io by csozidev - Tags: loading, loader, smooth, text animation, animated, wave, text, infinite */
|
|
/* Wave text loader made by: csozi | Website: english.csozi.hu*/
|
|
|
|
.text {
|
|
color: black;
|
|
font-weight: bolder;
|
|
}
|
|
|
|
@keyframes letter {
|
|
0% {
|
|
font-size: 30px;
|
|
}
|
|
|
|
50% {
|
|
font-size: 40px;
|
|
}
|
|
|
|
100% {
|
|
font-size: 30px;
|
|
}
|
|
}
|
|
|
|
.letter {
|
|
animation: letter 1s infinite;
|
|
}
|
|
|
|
.letter1 {
|
|
animation-delay: 0s;
|
|
}
|
|
|
|
.letter2 {
|
|
animation-delay: -0.9s;
|
|
}
|
|
|
|
.letter3 {
|
|
animation-delay: -0.8s;
|
|
}
|
|
|
|
.letter4 {
|
|
animation-delay: -0.7s;
|
|
}
|
|
|
|
.letter5 {
|
|
animation-delay: -0.6s;
|
|
}
|
|
|
|
.letter6 {
|
|
animation-delay: -0.5s;
|
|
}
|
|
|
|
.letter7 {
|
|
animation-delay: -0.4s;
|
|
}
|
|
|
|
.letter8 {
|
|
animation-delay: -0.3s;
|
|
}
|
|
|
|
.letter9 {
|
|
animation-delay: -0.2s;
|
|
}
|
|
|
|
.letter10 {
|
|
animation-delay: -0.1s;
|
|
}
|
|
</style>
|