fix import errors and animation

This commit is contained in:
chark1es 2024-12-21 15:35:40 -08:00
parent 8d034ed451
commit 3c5e1bcc04

View file

@ -1,6 +1,6 @@
---
import { Image } from "astro:assets";
import whiteLogoHorizontal from "./public/logos/white_logo_horizontal.svg";
import whiteLogoHorizontal from "../../../public/logos/white_logo_horizontal.svg";
import pages from "../../data/pages.json";
---
@ -76,18 +76,18 @@ import pages from "../../data/pages.json";
<!-- Mobile Menu -->
<div
id="mobile-menu"
class="fixed inset-0 bg-nav_bg bg-opacity-95 z-[51] hidden xl:hidden transition-transform duration-300 transform translate-x-full"
class="fixed inset-0 bg-nav_bg bg-opacity-95 z-[51] hidden xl:hidden motion-safe:transition-transform motion-safe:duration-300 translate-x-full"
>
<div class="flex flex-col items-center justify-center h-full space-y-6">
{
pages.map((page) => (
<a
href={page.path}
class={`block py-2 px-8 text-center rounded-[3rem] transition-colors duration-200 uppercase font-bold text-xl
class={`block py-2 px-8 text-center rounded-[3rem] motion-safe:transition-colors motion-safe:duration-200 uppercase font-bold text-xl
${
page.name === "Online Store"
? "bg-[#f3c135] text-black border-[#f3c135] hover:bg-[#dba923] hover:border-[#dba923]"
: "text-white hover:text-gray-300 border-white"
: "text-white hover:text-gray-300 border-white"
}`}
>
{page.name}
@ -100,7 +100,7 @@ import pages from "../../data/pages.json";
<style>
#mobile-menu.show {
transform: translateX(0);
@apply translate-x-0;
}
</style>
@ -128,7 +128,7 @@ import pages from "../../data/pages.json";
setTimeout(() => {
mobileMenu?.classList.add("hidden");
}, 300);
}, 100);
}
}