Fix
continuous-integration/drone/push Build is passing Details

This commit is contained in:
Joakim Svensson 2025-05-09 20:06:45 +00:00
parent 1136df09e6
commit 7d54463e2e
2 changed files with 49 additions and 17 deletions

View File

@ -11,27 +11,53 @@ title: Start
window.scrollTo({ top: y, behavior: 'smooth' }); window.scrollTo({ top: y, behavior: 'smooth' });
} }
// Göm knappen vid scroll window.addEventListener('scroll', () => {
window.addEventListener('scroll', () => {
const button = document.getElementById('scrollButton'); const button = document.getElementById('scrollButton');
if (window.scrollY > 10) { if (window.scrollY > 10) {
button.style.display = 'none'; button.style.opacity = '0';
button.style.pointerEvents = 'none';
} else {
button.style.opacity = '1';
button.style.pointerEvents = 'auto';
} }
}); });
</script> </script>
<script> <script>
window.addEventListener('scroll', () => { window.addEventListener("scroll", () => {
const header = document.querySelector('.md-header'); const content = document.getElementById("main-content");
const tabs = document.querySelector('.md-tabs'); const header = document.querySelector(".md-header");
if (window.scrollY > window.innerHeight * 0.8) { const sidebar = document.querySelector(".md-sidebar");
header.style.transform = "translateY(0)";
if (tabs) tabs.style.transform = "translateY(0)"; const contentY = content.getBoundingClientRect().top;
const windowHeight = window.innerHeight;
// Hur många pixlar innan "main-content" som menyn ska börja synas
const fadeStart = windowHeight * 0.2;
const fadeEnd = windowHeight * 0.8;
// Beräkna scrollbaserad opacitet (0 till 1)
let opacity = 1 - (contentY - fadeStart) / (fadeEnd - fadeStart);
opacity = Math.max(0, Math.min(1, opacity)); // begränsa mellan 0 och 1
// Tillämpa opacitet
header.style.opacity = opacity;
sidebar.style.opacity = opacity;
// Hantera klickbarhet så man inte klickar på osynlig meny
if (opacity < 0.05) {
header.style.pointerEvents = "none";
sidebar.style.pointerEvents = "none";
} else { } else {
header.style.transform = "translateY(-100%)"; header.style.pointerEvents = "auto";
if (tabs) tabs.style.transform = "translateY(-100%)"; sidebar.style.pointerEvents = "auto";
} }
}); });
window.addEventListener("load", () => {
// Initiera rätt opacitet direkt vid sidladdning
window.dispatchEvent(new Event("scroll"));
});
</script> </script>
<video autoplay loop muted playsinline <video autoplay loop muted playsinline

View File

@ -33,3 +33,9 @@
.md-tabs { .md-tabs {
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
#scrollButton {
transition: opacity 0.3s ease;
}