Compare commits
2 Commits
67af7283c2
...
8ec9ff3c3e
Author | SHA1 | Date |
---|---|---|
leandre.clochard | 8ec9ff3c3e | 3 years ago |
leandre.clochard | e91903589a | 3 years ago |
6 changed files with 110 additions and 1 deletions
After Width: | Height: | Size: 96 KiB |
@ -0,0 +1,8 @@ |
|||||
|
const loader = document.querySelector('.loader'); |
||||
|
|
||||
|
window.addEventListener('load', () => { |
||||
|
|
||||
|
loader.classList.add('fondu-out'); |
||||
|
|
||||
|
}) |
||||
|
|
Binary file not shown.
@ -0,0 +1,99 @@ |
|||||
|
.loader { |
||||
|
|
||||
|
position: absolute; |
||||
|
|
||||
|
width: 100%; |
||||
|
|
||||
|
height: 100%; |
||||
|
|
||||
|
background: white; |
||||
|
|
||||
|
display: flex; |
||||
|
|
||||
|
justify-content: center; |
||||
|
|
||||
|
align-items: center; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.lettre { |
||||
|
|
||||
|
color: #9700ff; |
||||
|
font-family: casino; |
||||
|
|
||||
|
font-size: 80px; |
||||
|
|
||||
|
letter-spacing: 15px; |
||||
|
|
||||
|
margin-bottom: 150px; |
||||
|
|
||||
|
animation: flash 1.2s linear infinite; |
||||
|
|
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
@keyframes flash { |
||||
|
|
||||
|
0% { |
||||
|
|
||||
|
color: #ff2d00; |
||||
|
|
||||
|
text-shadow: 0 0 7px #ff2d00; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
90% { |
||||
|
|
||||
|
color: #9700ff; |
||||
|
|
||||
|
text-shadow: none; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
100% { |
||||
|
|
||||
|
color: #ff2d00; |
||||
|
|
||||
|
text-shadow: 0 0 7px #ff2d00; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
.lettre:nth-child(1){ |
||||
|
|
||||
|
animation-delay: 0.1s; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.lettre:nth-child(2){ |
||||
|
|
||||
|
animation-delay: 0.2s; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
.lettre:nth-child(3){ |
||||
|
|
||||
|
animation-delay: 0.3s; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
.fondu-out { |
||||
|
|
||||
|
opacity: 0; |
||||
|
|
||||
|
transition: opacity 0.4s ease-out; |
||||
|
|
||||
|
} |
||||
|
|
||||
|
@font-face { |
||||
|
font-family: "casino"; |
||||
|
src: url("/police/casino.TTF") format("woff2"), |
||||
|
|
||||
|
} |
Loading…
Reference in new issue