max/website
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add some stuff

Browse Source
This commit is contained in:
max_richter
2024-03-28 18:30:52 +01:00
parent 31b24de86c
commit d4128840b9
196 changed files with 3393 additions and 390 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/layouts/Layout.astro
View File

@ -16,6 +16,7 @@ const { title, width = "compact" } = Astro.props;
<meta charset="UTF-8" />
<meta name="description" content="Astro description" />
<meta name="viewport" content="width=device-width" />
<meta name="props" content={JSON.stringify(Astro.props)} />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<AstroFont
config={[
@ -60,18 +61,18 @@ const { title, width = "compact" } = Astro.props;
var supportDarkMode =
window.matchMedia("(prefers-color-scheme: dark)").matches === true;
if (!mode && supportDarkMode)
document.body.classList.add("theme-dark");
document.documentElement.classList.add("dark");
if (!mode) return;
document.body.classList.add("theme-" + mode);
document.documentElement.classList.add(mode);
} catch (e) {}
})();
</script>
</head>
<body class=`layout-${width}`>
<body class=`layout-${width} bg-dark text-neutral p-2`>
<header>
<Nav />
</header>
<main>
<main class="flex flex-col gap-y-2xl">
<slot />
</main>
<LanguagePicker />
@ -79,7 +80,6 @@ const { title, width = "compact" } = Astro.props;
.layout-compact {
max-width: 600px;
margin: 0 auto;
padding: 0px 20px;
}
</style>
</body>

26
src/layouts/Post.astro
View File

@ -4,16 +4,20 @@ import Layout from "./Layout.astro";
import { useTranslatedPath } from "@i18n/utils";
import { getLocale } from "astro-i18n-aut";
type Props = CollectionEntry<"blog">["data"];
type CustomProps = {
layout?: "normal" | "transparent";
backlink?: string;
};
type Props = CollectionEntry<"blog">["data"] & CustomProps;
const { title, date } = Astro.props;
const path = useTranslatedPath(getLocale(Astro.url));
const { title, date, _layout = "normal", backlink = "/blog" } = Astro.props;
const path = useTranslatedPath(Astro);
---
<Layout title={title}>
<article>
<article class={`layout-${_layout}`}>
<div class="top-info">
<a href={path("/blog")}>← overview</a>
<a href={path(backlink)}>← overview</a>
<div class="date">
{
date.toLocaleString("en-US", {
@ -35,6 +39,9 @@ const path = useTranslatedPath(getLocale(Astro.url));
display: flex;
flex-direction: column;
gap: 10px;
}
article.layout-transparent {
padding: 20px;
background: var(--background);
}
@ -51,13 +58,4 @@ const path = useTranslatedPath(getLocale(Astro.url));
text-decoration: none;
color: var(--outline);
}
article :global(p) {
margin-top: 1em;
margin-bottom: 1em;
}
article :global(img) {
margin-bottom: 2em;
}
</style>