Violet/Violets-Purgatory
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Stars

Browse source
This commit is contained in:
Violet 2024-02-08 22:03:40 +00:00 • committed by GitHub
parent 8c05dff3fd
commit 07edad0ea7
4 changed files with 151 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

85
resources/stars.html Normal file
View file

@ -0,0 +1,85 @@
<!-- div.star#starn${⬤}*8 -->
<div class="star"></div>
<div class="star"></div>
<div class="star"></div>
<div class="star"></div>
<div class="star"></div>
<div class="star"></div>
<div class="star"></div>
<div class="star"></div>
<style>
.star {
position: fixed;
z-index: -2;
visibility: hidden;
font-size: 0.35rem;
width: 40px;
height: 40px;
background: radial-gradient(white, rgb(255, 255, 255, 0.5) 10%, transparent 50%);
}
.star:nth-of-type(1) {
animation: starAnim1 20s linear;
animation-iteration-count: infinite;
animation-delay: 1s;
}
.star:nth-of-type(2) {
animation: starAnim2 27s linear;
animation-iteration-count: infinite;
animation-delay: 1s;
}
.star:nth-of-type(3) {
animation: starAnim3 23s linear;
animation-iteration-count: infinite;
animation-delay: 1s;
}
.star:nth-of-type(4) {
animation: starAnim4 39s linear;
animation-iteration-count: infinite;
animation-delay: 1s;
}
.star:nth-of-type(5) {
animation: starAnim5 30s linear;
animation-iteration-count: infinite;
animation-delay: 1s;
}
.star:nth-of-type(6) {
animation: starAnim6 15s linear;
animation-iteration-count: infinite;
animation-delay: 1s;
}
.star:nth-of-type(7) {
animation: starAnim7 23s linear;
animation-iteration-count: infinite;
animation-delay: 1s;
}
.star:nth-of-type(8) {
animation: starAnim8 18s linear;
animation-iteration-count: infinite;
animation-delay: 1s;
}
@keyframes starAnim1 {
0% {
top: -10vh;
right: 10vw;
visibility: visible;
}
100% {
top: 110vh;
right: 20vw;
}
}
</style>