Make the page loading animation look better

This commit is contained in:
wearrrrr 2024-01-10 13:34:48 -06:00
parent d1df3e4cf7
commit 6672d9336e
5 changed files with 8 additions and 5 deletions

2
public/robots.txt Normal file
View file

@ -0,0 +1,2 @@
User-agent: *
Allow: *

View file

@ -89,6 +89,7 @@
.footerlist ul > li { .footerlist ul > li {
padding: 2px; padding: 2px;
padding-bottom: 5px;
} }
.footerlist ul > li > a { .footerlist ul > li > a {

View file

@ -23,8 +23,6 @@
iframe.addEventListener('load', () => { iframe.addEventListener('load', () => {
let topBar = document.getElementById('top-bar'); let topBar = document.getElementById('top-bar');
loadingContent.style.opacity = 0; loadingContent.style.opacity = 0;
iframe.style.opacity = 1;
topBar.style.opacity = 1;
topBar.innerHTML = ""; topBar.innerHTML = "";
topBar.classList.add("top-bar"); topBar.classList.add("top-bar");
let closeButton = document.createElement('button'); let closeButton = document.createElement('button');
@ -39,6 +37,8 @@
let urlText = document.createElement('p'); let urlText = document.createElement('p');
urlText.classList.add("url-text"); urlText.classList.add("url-text");
urlText.innerText = url urlText.innerText = url
iframe.style.opacity = 1;
topBar.style.opacity = 1;
topBar.style.pointerEvents = "auto"; topBar.style.pointerEvents = "auto";
topBar.appendChild(closeButton); topBar.appendChild(closeButton);
topBar.appendChild(urlText); topBar.appendChild(urlText);

View file

@ -104,14 +104,14 @@ body > * {
align-items: center; align-items: center;
padding: 0 1rem; padding: 0 1rem;
height: 5vh; height: 5vh;
background-color: #080808; background-color: #7900e1;
color: white; color: white;
position: fixed; position: fixed;
top: 0; top: 0;
left: 0; left: 0;
width: 100vw; width: 100vw;
z-index: 100; z-index: 100;
transition: opacity 250ms ease-in-out; transition: opacity 350ms ease-in-out;
pointer-events: none; pointer-events: none;
} }
.close-button { .close-button {

View file

@ -10,7 +10,7 @@ import UVRegistrar from '../components/UVRegistrar.astro';
<input class="url-input" type="text" placeholder="Search..."> <input class="url-input" type="text" placeholder="Search...">
<div id="loading-content">Loading...</div> <div id="loading-content">Loading...</div>
<div id="top-bar"></div> <div id="top-bar"></div>
<iframe src="" id="proxy-frame"></iframe> <iframe title="proxy-iframe" id="proxy-frame"></iframe>
</form> </form>
</div> </div>
<UVRegistrar></UVRegistrar> <UVRegistrar></UVRegistrar>