swaggboi/mywillpower.org
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implement modal loader

Browse Source
This commit is contained in:
swaggboi 2022-02-12 23:54:45 -05:00
parent 2d4a2d2658
commit 36c1194584
2 changed files with 20 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
public/main.css
View File

@ -45,6 +45,20 @@ html, body {
display: none; display: none;
} }
.modal.loader {
border: 16px solid #F0F0F0;
border-top: 16px solid #000000;
border-radius: 50%;
width: 120px;
height: 120px;
animation: spin 2s linear infinite;
margin: -4em auto auto -4em;
display: flex;
top: 50%;
left: 50%;
position: absolute;
}
@-webkit-keyframes from_top { @-webkit-keyframes from_top {
from { from {
margin: -6em auto; margin: -6em auto;
@ -68,3 +82,8 @@ html, body {
opacity: 1; opacity: 1;
} }
} }
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}

1
views/index.erb
View File

@ -3,6 +3,7 @@
<p>Ayy... lmao</p> <p>Ayy... lmao</p>
</div> </div>
</div> </div>
<div class="modal loader"></div>
<div id="video"></div> <div id="video"></div>
<audio id="soundtrack" preload="auto" loop> <audio id="soundtrack" preload="auto" loop>
<source src="/willpower.mp3" type="audio/mpeg"> <source src="/willpower.mp3" type="audio/mpeg">