Change card with rain event

This commit is contained in:
Violet 2024-03-04 17:12:08 +00:00 committed by GitHub
parent c23e8fef0a
commit 9790b71264
2 changed files with 8 additions and 5 deletions

View file

@ -11,8 +11,7 @@
}
#card {
background-color: rgba(25, 5, 80, 0.5);
backdrop-filter: blur(10px);
background-color: rgba(20, 5, 90);
padding: 15px;
border: 2px white solid;
margin: 20px auto;

View file

@ -8,6 +8,10 @@ module.exports = {
html +=
`
<style>
#card {
background-color: rgba(45, 5, 120, 0.2);
backdrop-filter: blur(5px);
}
.rainStuff {
position: sticky;
top: 0;
@ -28,7 +32,7 @@ module.exports = {
position: absolute;
width: 5px;
backdrop-filter: blur(5px);
background-color: rgba(0, 0, 255, 0.1);
background-color: rgba(0, 0, 255, 0.2);
height: 10vh;
visibility: hidden;
}
@ -57,12 +61,12 @@ module.exports = {
.rainDrop:nth-of-type(${index + 1}) {
animation: rainAnim${index} ${(Math.random() * 0.3) + (5 - iterationReducer)}s linear;
animation-iteration-count: infinite;
animation-delay: ${Math.random()}s;
animation-delay: ${Math.round(Math.random() * 100) / 100}s;
}
`
var randos = []
for (let index = 0; index < 11; index++) {
randos.push(Math.random() * 100)
randos.push(Math.round(Math.random() * 100))
}
html += `@keyframes rainAnim${index} { `