remove flowbite, implement custom js, remove unused if/else statement in navbar

This commit is contained in:
brooke 2024-06-10 19:31:59 -04:00
parent e86bfc4d49
commit 6a3a6f7dc7
4 changed files with 31 additions and 13 deletions

View file

@ -5,6 +5,5 @@
<body class="bg-black text-white min-h-screen flex flex-col">
{{ partial "nav.html" . }} {{ block "main" . }}{{ end }} {{ partial
"footer.html" . }}
<script src="https://cdnjs.cloudflare.com/ajax/libs/flowbite/2.3.0/flowbite.min.js"></script>
</body>
</html>

View file

@ -1,20 +1,13 @@
<div class="p-4 min-h-[40.27px] flex flex-row w-full justify-between bg-black">
<a href="/"><img class="w-44 h-auto" src="{{ .Site.Params.logo }}" /></a>
<a href="/"><img class="w-44 h-[40.2667px]" src="{{ .Site.Params.logo }}" /></a>
<nav class="place-self-center h-8 flex justify-end gap-2 text-white pr-6">
{{ range .Site.Menus.main }} {{ if $.IsMenuCurrent .Menu . }}
<a
class="ml-2 underline underline-offset-0 decoration-2 decoration-transparent decoration-white underline-offset-2 place-self-center"
href="{{ .URL }}"
>
{{ $text := print .Name | safeHTML }} {{ $text }}
</a>
{{ else }}
{{ range .Site.Menus.main }}
<a
class="ml-2 underline underline-offset-0 decoration-2 decoration-transparent hover:decoration-white hover:underline-offset-2 ease-in-out duration-300 place-self-center"
href="{{ .URL }}"
>
{{ $text := print .Name | safeHTML }} {{ $text }}
</a>
{{ end }} {{ end }}
{{ end }}
</nav>
</div>

View file

@ -149,7 +149,7 @@
>
<img
src="{{ .image }}"
class="absolute block max-w-full h-auto -translate-x-1/2 -translate-y-1/2 top-1/2 left-1/2"
class="absolute block rounded-lg w-full h-auto -translate-x-1/2 -translate-y-1/2 top-1/2 left-1/2"
alt=""
/>
</div>
@ -341,4 +341,30 @@
}
}
});
const gallery = document.getElementById("gallery");
const carouselItems = gallery.querySelectorAll("[data-carousel-item]");
const prevButton = gallery.querySelector("[data-carousel-prev]");
const nextButton = gallery.querySelector("[data-carousel-next]");
let currentItemIndex = 0;
function showItem() {
carouselItems.forEach((item, index) => {
item.classList.add("hidden");
if (index === currentItemIndex) {
item.classList.remove("hidden");
}
});
}
function prevItem() {
currentItemIndex =
(currentItemIndex - 1 + carouselItems.length) % carouselItems.length;
showItem();
}
function nextItem() {
currentItemIndex = (currentItemIndex + 1) % carouselItems.length;
showItem();
}
prevButton.addEventListener("click", prevItem);
nextButton.addEventListener("click", nextItem);
showItem();
</script>

File diff suppressed because one or more lines are too long