<@script> const rand = (min, max)=>{ return (Math.random() * (max - min + 1)) + min; } const linkContainer = document.querySelector(".links"); const links = document.querySelectorAll(".links a"); for(let i = 0; i < links.length; i++){ links[i].style.top = `${rand(100, linkContainer.offsetHeight-100)}px`; links[i].style.left = `${rand(100, linkContainer.offsetWidth-100)}px`; links[i].style.transform = `rotate(${rand(-55, 55)}deg)`; } <@/script> <@html>
<@ ./components/rotating_logo.neovan @>

An anti-framework for building the front-end with plain HTML/CSS/JavaScript

<@/html> <@style> .aboveTheFold{ display: flex; flex-direction: column; align-items: center; justify-content: space-around; height: 100vh; width: 100%; position: relative; overflow: hidden; } h2{ text-align: center; margin: 15px; } .menu{ display: flex; align-items: center; height: 55px; width: 100%; box-shadow: 0 4px 8px white; position: absolute; top: 0; left: 0; } .menuLogo{ max-height: 100%; } .menu a{ font-size: 25px; margin: 0 15px; color: white; max-height: 100%; text-decoration: none; } <@/style>