ieeeucsd-org/src/pages/online-store.astro
2025-01-24 04:00:29 -08:00

51 lines
1.8 KiB
Text

---
import Layout from "../layouts/Layout.astro";
import UserProfile from "../components/auth/UserProfile.astro";
import StoreItem from "../components/store/StoreItem.astro";
const title = "IEEE Store";
---
<Layout {title}>
<main class="w-[95%] mx-auto pb-12 md:pt-[14vh] pt-[12vw] min-h-screen">
<h1 class="text-4xl font-bold mb-12">IEEE UCSD Store</h1>
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
<!-- Left Column - User Info -->
<div class="md:col-span-1 h-fit">
<UserProfile />
</div>
<!-- Right Column - Store Items -->
<div id="storeContent" class="md:col-span-3">
<div
class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6"
>
<StoreItem
name="Item Name"
description="Description of the item goes here. This is a placeholder."
price={20.0}
/>
<StoreItem
name="Item Name"
description="Description of the item goes here. This is a placeholder."
price={25.0}
/>
<StoreItem
name="Item Name"
description="Description of the item goes here. This is a placeholder."
price={15.0}
/>
<StoreItem
name="Item Name"
description="Description of the item goes here. This is a placeholder."
price={15.0}
/>
</div>
</div>
</div>
</main>
</Layout>
<script>
import { StoreAuth } from "../components/auth/StoreAuth";
new StoreAuth();
</script>