202404170450

This commit is contained in:
nelle 2024-04-17 04:50:55 -06:00
parent 0085166b18
commit bed9e5a9e3
3 changed files with 16 additions and 39 deletions

View file

@ -16,6 +16,15 @@
</style> </style>
<style is:global> <style is:global>
.navbar-menu {
flex-grow: initial!important;
flex-shrink: initial!important;
}
.navbar {
display: flex
align-content: center;
justify-content: center;
}
:root { :root {
--accent: 136, 58, 234; --accent: 136, 58, 234;
--accent-light: 224, 204, 250; --accent-light: 224, 204, 250;

View file

@ -1,7 +1,8 @@
--- ---
--- ---
<nav class="navbar md-0" role="navigation" aria-label="main navigation" > <center>
<nav class="navbar" role="navigation" aria-label="main navigation"
<div class="navbar-brand"> <div class="navbar-brand">
<a class="navbar-item" href="/"> <a class="navbar-item" href="/">
<!-- <!--
@ -12,17 +13,6 @@
--> -->
<span class="text-gradient">LimePot</span> <span class="text-gradient">LimePot</span>
</a> </a>
<a
role="button"
class="navbar-burger"
data-target="navMenu"
aria-label="menu"
aria-expanded="false"
>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div> </div>
<div class="navbar-menu" id="navMenu"> <div class="navbar-menu" id="navMenu">
<div class="navbar-start"> <div class="navbar-start">
@ -52,28 +42,4 @@
</a> </a>
--> -->
</div> </div>
</center>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->
<script>
document.addEventListener("DOMContentLoaded", () => {
// Get all "navbar-burger" elements
const $navbarBurgers = Array.prototype.slice.call(
document.querySelectorAll(".navbar-burger"),
0
);
// Add a click event on each of them
$navbarBurgers.forEach((el) => {
el.addEventListener("click", () => {
// Get the target from the "data-target" attribute
const target = el.dataset.target;
const $target = document.getElementById(target);
// Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
el.classList.toggle("is-active");
$target.classList.toggle("is-active");
});
});
});
</script>
<!-- This JS is required for mobile users to navigate the site, working on a mobile alternative -->

View file

@ -19,13 +19,15 @@ const { title } = Astro.props;
<Header /> <Header />
<section class="section"> <section class="section">
<div class="container"> <div class="container">
<div class="px-1">
<slot /> <slot />
</div> </div>
</div>
</section> </section>
<Footer /> <Footer />
</body><style is:global> </body><style is:global>
.navbar .navbar-menu {
flex-grow: initial;
flex-shrink: initial;
}
:root { :root {
--accent: 136, 58, 234; --accent: 136, 58, 234;
--accent-light: 224, 204, 250; --accent-light: 224, 204, 250;