updated layouts

Signed-off-by: Ash Entwisle <ash.entwisle@protonmail.com>
pull/1/head
Ash Entwisle 2024-02-20 14:35:40 +00:00
parent f9e074ea18
commit e4e8e53a07
No known key found for this signature in database
GPG Key ID: 0E3CBB6B4BE9FE33
3 changed files with 76 additions and 49 deletions

View File

@ -1,4 +1,5 @@
--- ---
import Markdown from "./Markdown.astro";
const { frontmatter } = Astro.props; const { frontmatter } = Astro.props;
@ -9,3 +10,7 @@ if (frontmatter.draft) {
} }
--- ---
<Markdown frontmatter={frontmatter}>
<slot />
</Markdown>

View File

@ -1,50 +1,65 @@
--- ---
import Header from '../components/Header.astro'; import Header from "../components/compound/Header.astro";
import Footer from '../components/Footer.astro'; import Footer from "../components/compound/Footer.astro";
import "../styles/main.scss";
//import "../styles.scss";
export interface Props { export interface Props {
title: string; title: string;
description: string; description: string;
keywords: string[]; keywords: string[];
header: boolean;
footer: boolean;
} }
const { title, description, keywords } = Astro.props; const props = Astro.props;
const keywordsString = keywords.join(' '); const keywordsString = props.keywords.join(" ");
import "../styles.scss"
--- ---
<!DOCTYPE html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="author" content="Ash Entwisle"> <meta name="author" content="Ash Entwisle" />
<meta name="description" content={ description }> <meta name="description" content={props.description} />
<meta name="keywords" content={ keywordsString }> <meta name="keywords" content={keywordsString} />
<meta name="robots" content="index, follow"> <meta name="robots" content="index, follow" />
<meta name="theme-color" content="#282c34"/> <meta name="theme-color" content="#282c34" />
<meta name="generator" content={Astro.generator} /> <meta name="generator" content={Astro.generator} />
<link rel="manifest" href="manifest.json"> <link rel="manifest" href="manifest.json" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" /> <link rel="icon" type="image/x-icon" href="/favicon.ico" />
<link rel="apple-touch-icon" href="/favicon.ico"> <link rel="apple-touch-icon" href="/favicon.ico" />
<link rel="sitemap" href="/sitemap-index.xml"> <link rel="sitemap" href="/sitemap-index.xml" />
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="/" crossorigin />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://proot.zip/styles/urbanist.css" rel="stylesheet" />
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap" rel="stylesheet"> <link href="https://proot.zip/styles/fa-icons.css" rel="stylesheet" />
<title>{title}</title> <title>{props.title}</title>
</head> </head>
<body> <body>
<Header /> {
props.header ?
<Header
// icon="https://proot.zip/assets/hallshero/logo.svg"
icon="/logo.svg"
title=""
/>
: ""
}
<main> <main>
<slot /> <slot />
</main> </main>
{
props.footer ?
<Footer /> <Footer />
: ""
}
<script> <script>
if ('serviceWorker' in navigator) { if ("serviceWorker" in navigator) {
window.addEventListener('load', () => { window.addEventListener("load", () => {
navigator.serviceWorker.register('/sw.js'); navigator.serviceWorker.register("/sw.js");
}); });
} }
</script> </script>

View File

@ -1,4 +1,5 @@
--- ---
import Center from "../components/base/Center.astro";
import Boilerplate from "./Boilerplate.astro"; import Boilerplate from "./Boilerplate.astro";
const { frontmatter } = Astro.props const { frontmatter } = Astro.props
@ -10,10 +11,16 @@ const tags: string[] = frontmatter.description.split(" ").filter((word: any, ind
--- ---
<Boilerplate title={frontmatter.title} description={frontmatter.description} keywords={tags}> <Boilerplate
<markdown class="flex items-center justify-center flex-col"> title={frontmatter.title}
<div class="w-3/4"> description={frontmatter.description}
keywords={tags}
header={true}
footer={true}
>
<Center id="main_md">
<markdown>
<slot /> <slot />
</div>
</markdown> </markdown>
</Center>
</Boilerplate> </Boilerplate>