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

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 AuthLayout from "./AuthLayout.astro";
interface Props {
title?: string;
}
const { title } = Astro.props;
---
<!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>"
/>
<meta name="generator" content={Astro.generator} />
<title>Ixabatasha</title>
<title>{title || "Ixabatasha"}</title>
</head>
<body class="flex items-center justify-center min-h-screen">
<slot />
<AuthLayout title={title}>
<slot />
</AuthLayout>
</body>
</html>