Galleries/PythonGallery
1
0
Fork 0
mirror of https://github.com/Derpy-Leggies/OnlyLegs.git synced 2025-06-29 03:26:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Tidying up CSS

Browse source
This commit is contained in:
Michał Gdula 2022-12-19 15:07:41 +00:00
parent 3f64c56ec8
commit f41312248c
7 changed files with 29 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

8
templates/layout.html
View file

@ -13,7 +13,7 @@
<script src="https://unpkg.com/phosphor-icons" defer></script>
</head>
<body>
<nav>
<nav id="navRoot">
<div>
<a href="{{ url_for('home') }}"><i class="ph-house-line-fill"></i><span>Home</span></a>
<a href=""><i class="ph-package-fill"></i><span>Groups</span></a>
@ -31,13 +31,15 @@
</main>
<script>
let navToggle = true;
document.onscroll = function() {
document.querySelector('header').style.opacity = `${1 - window.scrollY / 169}`;
document.querySelector('header').style.height = `calc(40vh + ${window.scrollY / 5}px)`;
document.querySelector('header img').style.cssText = `object-position: center ${window.scrollY / 2}px`;
if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
document.querySelector('#topButton').style.opacity = 1;
document.querySelector('#topButton').style.right = "1rem";
document.querySelector('#topButton').style.right = "0.75rem";
} else {
document.querySelector('#topButton').style.opacity = 0;
document.querySelector('#topButton').style.right = "-3rem";