atridad/ixabatasha
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Small UI changes

Browse Source
This commit is contained in:
Atridad Lahiji
2025-02-24 20:56:59 -06:00
parent 03a08a74df
commit df438ec702
9 changed files with 655 additions and 718 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
package.json
View File

@ -9,20 +9,20 @@
"astro": "astro" "astro": "astro"
}, },
"dependencies": { "dependencies": {
"@astrojs/node": "^9.0.2", "@astrojs/node": "^9.1.1",
"@astrojs/react": "^4.2.0", "@astrojs/react": "^4.2.0",
"@aws-sdk/client-s3": "^3.741.0", "@aws-sdk/client-s3": "^3.750.0",
"@tailwindcss/vite": "^4.0.3", "@tailwindcss/vite": "^4.0.8",
"@types/node": "^22.13.1", "@types/node": "^22.13.5",
"@types/react": "^19.0.8", "@types/react": "^19.0.10",
"@types/react-dom": "^19.0.3", "@types/react-dom": "^19.0.4",
"astro": "^5.2.5", "astro": "^5.3.1",
"astro-robots": "^2.3.1", "astro-robots": "^2.3.1",
"react": "^19.0.0", "react": "^19.0.0",
"react-dom": "^19.0.0", "react-dom": "^19.0.0",
"tailwindcss": "^4.0.3", "tailwindcss": "^4.0.8",
"typescript": "^5.7.3", "typescript": "^5.7.3",
"uuid": "^11.0.5" "uuid": "^11.1.0"
}, },
"devDependencies": { "devDependencies": {
"daisyui": "5.0.0-beta.6" "daisyui": "5.0.0-beta.6"

1252
pnpm-lock.yaml generated
View File

File diff suppressed because it is too large Load Diff

26
src/layouts/AdminLayout.astro Normal file
View File

@ -0,0 +1,26 @@
---
import "../styles/global.css";
interface Props {
title?: string;
}
const { title } = Astro.props;
---
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<link
rel="icon"
href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>❤️</text></svg>"
/>
<meta name="generator" content={Astro.generator} />
<title>{title || "Ixabatasha"}</title>
</head>
<body class="flex items-center justify-center min-h-screen">
<slot />
</body>
</html>

32
src/layouts/AuthLayout.astro Normal file
View File

@ -0,0 +1,32 @@
---
import SignIn from "../components/SignIn.tsx";
interface Props {
title?: string;
}
const { title } = Astro.props;
---
<div id="auth-container" class="flex flex-col gap-4">
<SignIn client:load onSuccess={() => {}} requiredRole="guest" />
</div>
<div id="content-container" class="hidden">
<slot />
</div>
<script>
// Check auth state on page load
const isAuthenticated = sessionStorage.getItem("isAuthenticated") === "true";
if (isAuthenticated) {
document.getElementById("auth-container")?.classList.add("hidden");
document.getElementById("content-container")?.classList.remove("hidden");
}
// Add event listener for custom event from SignIn component
document.addEventListener("auth-success", () => {
document.getElementById("auth-container")?.classList.add("hidden");
document.getElementById("content-container")?.classList.remove("hidden");
});
</script>

13
src/layouts/Layout.astro
View File

@ -1,5 +1,12 @@
--- ---
import "../styles/global.css"; import "../styles/global.css";
import AuthLayout from "./AuthLayout.astro";
interface Props {
title?: string;
}
const { title } = Astro.props;
--- ---
<!doctype html> <!doctype html>
@ -12,9 +19,11 @@ import "../styles/global.css";
href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>❤️</text></svg>" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>❤️</text></svg>"
/> />
<meta name="generator" content={Astro.generator} /> <meta name="generator" content={Astro.generator} />
<title>Ixabatasha</title> <title>{title || "Ixabatasha"}</title>
</head> </head>
<body class="flex items-center justify-center min-h-screen"> <body class="flex items-center justify-center min-h-screen">
<slot /> <AuthLayout title={title}>
<slot />
</AuthLayout>
</body> </body>
</html> </html>

2
src/pages/index.astro
View File

@ -3,7 +3,7 @@ import Layout from "../layouts/Layout.astro";
import SignOut from "../components/SignOut.tsx"; import SignOut from "../components/SignOut.tsx";
--- ---
<Layout> <Layout title="Welcome">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<div class="text-center">❤️ Natasha + Ixabat ❤️</div> <div class="text-center">❤️ Natasha + Ixabat ❤️</div>

6
src/pages/registry/admin.astro
View File

@ -1,11 +1,11 @@
--- ---
import Layout from "../../layouts/Layout.astro"; import AdminLayout from "../../layouts/AdminLayout.astro";
import RegistryManager from "../../components/RegistryManager.tsx"; import RegistryManager from "../../components/RegistryManager.tsx";
import SignIn from "../../components/SignIn.tsx"; import SignIn from "../../components/SignIn.tsx";
import SignOut from "../../components/SignOut.tsx"; import SignOut from "../../components/SignOut.tsx";
--- ---
<Layout title="Registry Manager"> <AdminLayout title="Registry Manager">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<div class="text-center text-4xl">Registry Manager</div> <div class="text-center text-4xl">Registry Manager</div>
@ -22,7 +22,7 @@ import SignOut from "../../components/SignOut.tsx";
<SignOut client:load /> <SignOut client:load />
</div> </div>
</div> </div>
</Layout> </AdminLayout>
<script> <script>
const checkAndUpdateVisibility = (role: string | null) => { const checkAndUpdateVisibility = (role: string | null) => {

13
src/pages/registry/index.astro
View File

@ -1,23 +1,16 @@
--- ---
import Layout from "../../layouts/Layout.astro"; import Layout from "../../layouts/Layout.astro";
import RegistryList from "../../components/RegistryList.tsx"; import RegistryList from "../../components/RegistryList.tsx";
import SignIn from "../../components/SignIn.tsx";
import SignOut from "../../components/SignOut.tsx"; import SignOut from "../../components/SignOut.tsx";
--- ---
<Layout title="Baby Registry"> <Layout title="Registry">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<div class="text-center text-4xl"> <div class="text-center text-4xl">
View and Claim Items from the Baby Registry: View and Claim Items from the Registry:
</div> </div>
<div id="auth-container"> <RegistryList client:load />
<SignIn client:load onSuccess={() => {}} requiredRole="guest" />
</div>
<div id="registry-container" class="hidden">
<RegistryList client:load />
</div>
<div class="flex flex-row gap-2 justify-center items-center"> <div class="flex flex-row gap-2 justify-center items-center">
<a class="btn btn-primary" href="/">Home</a> <a class="btn btn-primary" href="/">Home</a>

11
src/pages/rsvp.astro
View File

@ -1,23 +1,16 @@
--- ---
import Layout from "../layouts/Layout.astro"; import Layout from "../layouts/Layout.astro";
import RSVP from "../components/RSVP.tsx"; import RSVP from "../components/RSVP.tsx";
import SignIn from "../components/SignIn.tsx";
import SignOut from "../components/SignOut.tsx"; import SignOut from "../components/SignOut.tsx";
--- ---
<Layout> <Layout title="RSVP">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<div class="text-center text-4xl"> <div class="text-center text-4xl">
Please RSVP using the form below: Please RSVP using the form below:
</div> </div>
<div id="auth-container"> <RSVP client:load />
<SignIn client:load onSuccess={() => {}} requiredRole="guest" />
</div>
<div id="rsvp-container" class="hidden">
<RSVP client:load />
</div>
<div class="flex flex-row gap-2 justify-center items-center"> <div class="flex flex-row gap-2 justify-center items-center">
<a class="btn btn-primary" href="/">Home</a> <a class="btn btn-primary" href="/">Home</a>