Files
website/src/layouts/Layout.astro
T
2026-07-20 01:38:32 +08:00

49 lines
1.8 KiB
Plaintext

---
import Header from "@/components/Header.astro";
import Footer from "@/components/Footer.astro";
import { siteConfig } from "@/config";
import "@/styles/global.css";
interface Props {
title?: string;
description?: string;
canonical?: string;
}
const { title = siteConfig.name, description = siteConfig.description, canonical = Astro.url.pathname } = Astro.props;
const pageTitle = title === siteConfig.name ? title : `${title} | ${siteConfig.name}`;
const canonicalUrl = Astro.site ? new URL(canonical, Astro.site) : undefined;
---
<!doctype html>
<html
lang="zh-CN"
class="bg-background-light-10 dark:bg-background-dark-90 scroll-smooth [tap-highlight-color:transparent] dark:text-white"
>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<meta name="description" content={description} />
<meta property="og:title" content={pageTitle} />
<meta property="og:type" content="website" />
<meta property="og:description" content={description} />
<meta property="og:site_name" content={siteConfig.name} />
{canonicalUrl && <meta property="og:url" content={canonicalUrl.toString()} />}
{canonicalUrl && <link rel="canonical" href={canonicalUrl.toString()} />}
<link rel="icon" type="image/png" href="/uranium-logo.png" />
<title>{pageTitle}</title>
<script is:inline>
(() => {
const saved = localStorage.getItem("uranium-theme");
const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
document.documentElement.classList.toggle("dark", saved ? saved === "dark" : prefersDark);
})();
</script>
</head>
<body class="flex min-h-screen flex-col">
<Header />
<main class="flex-1"><slot /></main>
<Footer />
</body>
</html>