xevion/undefined.behavio.rs
1
0
Fork 0
mirror of https://github.com/Xevion/undefined.behavio.rs.git synced 2025-12-12 03:11:50 -06:00
Code Issues Packages Projects Releases Wiki Activity

Separate default body contents into General layout, keep Base

Browse Source
This commit is contained in:
Xevion
2023-11-27 20:17:58 -06:00
parent 4aeffb978c
commit a7c5debb5c
4 changed files with 75 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
src/layouts/Base.astro
View File

@@ -1,60 +1,39 @@
--- ---
import '@styles/global.scss'; import "@styles/global.scss";
import '@styles/fonts.scss'; import "@styles/fonts.scss";
import Header from '@components/Header.astro'; import { ViewTransitions } from "astro:transitions";
import { ViewTransitions } from 'astro:transitions';
const repository_url = `https://github.com/${import.meta.env.PUBLIC_VERCEL_GIT_REPO_OWNER}/${import.meta.env.PUBLIC_VERCEL_GIT_REPO_SLUG}`
const build_revision = import.meta.env.PUBLIC_VERCEL_GIT_COMMIT_SHA;
interface Props { interface Props {
title?: string; title?: string;
build_revision?: string;
} }
const { title } = Astro.props; const { title: titleProp, build_revision } = Astro.props;
const titleTag = title != undefined ? `${title} | undefined.behavio.rs` : 'undefined.behavio.rs'; const title =
titleProp != undefined
? `${titleProp} | undefined.behavio.rs`
: "undefined.behavio.rs";
--- ---
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<meta content="width=device-width" name="viewport"> <meta content="width=device-width" name="viewport" />
<meta name="build-commit-id" content={build_revision} /> <meta name="build-commit-id" content={build_revision} />
<title> <title>{title}</title>
{titleTag} <link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16" />
</title> <link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16"> <link as="font" crossorigin href="/fonts/-cmunrm.woff2" rel="preload" />
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32"> <link as="font" crossorigin href="/fonts/-cmuntt.woff2" rel="preload" />
<link as="font" crossorigin href="/fonts/-cmunrm.woff2" rel="preload"> <link as="font" crossorigin href="/fonts/-cmunti.woff2" rel="preload" />
<link as="font" crossorigin href="/fonts/-cmuntt.woff2" rel="preload"> <link as="sitemap" type="application/xml" href="/sitemap-index.xml" />
<link as="font" crossorigin href="/fonts/-cmunti.woff2" rel="preload"> <link rel="alternate" type="application/xml" href="/feed.xml" />
<link as="sitemap" type="application/xml" href="/sitemap-index.xml"> <ViewTransitions />
<link href="/feed.xml" rel="alternate" type="application/xml"> </head>
<ViewTransitions /> <body class="flex-col align-middle w-full max-w-full">
</head> <slot />
<body class="flex-col align-middle w-full max-w-full"> </body><!-- <script type="text/javascript">
<Header className="mt-5 mb-3" />
<nav class="text-center text-xl text-[#808080] [&>a]:text-white [&>a]:underline decoration-white/85 [&>span]:select-none">
<a href="/">~/</a>
<span>:</span>
<a href="https://xevion.dev">~/about/</a>
<span>:</span>
<a href="https://xevion.dev/projects">~/projects/</a>
<span>:</span>
<a href="https://xevion.dev/resume">~/resume/</a>
</nav>
<div class="max-w-screen-lg">
<slot name="default" />
</div>
<p class="text-center">
<a href="/feed.xml">RSS</a>
|
<a href={`${repository_url}/commit/${build_revision}`}>
<span id="commit-id" style={{color: '#' + build_revision.slice(0, 6)}}>#{build_revision.slice(0, 7)}</span>
</a>
</p>
</body>
<!-- <script type="text/javascript">
Is all of this too much effort to make the animation play in just the right way? Is all of this too much effort to make the animation play in just the right way?
window.onbeforeunload = function() { window.onbeforeunload = function() {
Remember the origin so it can be checked for page reloads Remember the origin so it can be checked for page reloads
@@ -72,5 +51,4 @@ const titleTag = title != undefined ? `${title} | undefined.behavio.rs` : 'undef
} }
</script> </script>
--> -->
</html> </html>

42
src/layouts/General.astro Normal file
View File

@@ -0,0 +1,42 @@
---
import Base from "@layouts/Base.astro";
import Header from "@components/Header.astro";
const repository_url = `https://github.com/${
import.meta.env.PUBLIC_VERCEL_GIT_REPO_OWNER
}/${import.meta.env.PUBLIC_VERCEL_GIT_REPO_SLUG}`;
const build_revision = import.meta.env.PUBLIC_VERCEL_GIT_COMMIT_SHA;
interface Props {
title?: string;
}
const { title } = Astro.props;
---
<Base title={title}>
<Header className="mt-5 mb-3" />
<nav
class="text-center text-xl text-[#808080] [&>a]:text-white [&>a]:underline decoration-white/85 [&>span]:select-none"
>
<a href="/">~/</a>
<span>:</span>
<a href="https://xevion.dev">~/about/</a>
<span>:</span>
<a href="https://xevion.dev/projects">~/projects/</a>
<span>:</span>
<a href="https://xevion.dev/resume">~/resume/</a>
</nav>
<div class="max-w-screen-lg">
<slot name="default" />
</div>
<p class="text-center">
<a href="/feed.xml">RSS</a>
|
<a href={`${repository_url}/commit/${build_revision}`}>
<span id="commit-id" style={{ color: "#" + build_revision.slice(0, 6) }}
>#{build_revision.slice(0, 7)}</span
>
</a>
</p>
</Base>

6
src/layouts/Post.astro
View File

@@ -1,5 +1,5 @@
--- ---
import Base from "@layouts/Base.astro"; import General from "@layouts/General.astro";
import { type CollectionEntry } from 'astro:content'; import { type CollectionEntry } from 'astro:content';
import { format } from "date-fns"; import { format } from "date-fns";
@@ -10,7 +10,7 @@ const { post } = Astro.props;
const { title, pubDate, tags } = post.data; const { title, pubDate, tags } = post.data;
const tagCount = tags.length; const tagCount = tags.length;
--- ---
<Base title={title}> <General title={title}>
<div class="max-w-3xl mx-4"> <div class="max-w-3xl mx-4">
<h1> <h1>
<a href={post.slug}> <a href={post.slug}>
@@ -34,4 +34,4 @@ const tagCount = tags.length;
</p> </p>
</div> </div>
<hr /> <hr />
</Base> </General>

4
src/pages/index.astro
View File

@@ -1,12 +1,12 @@
--- ---
import { getCollection } from "astro:content"; import { getCollection } from "astro:content";
import Base from "@layouts/Base.astro"; import General from "@layouts/General.astro";
import Summary from "@components/Summary.astro"; import Summary from "@components/Summary.astro";
const posts = await getCollection("blog"); const posts = await getCollection("blog");
posts.sort((a, b) => new Date(b.data.pubDate).getTime() - new Date(a.data.pubDate).getTime()); posts.sort((a, b) => new Date(b.data.pubDate).getTime() - new Date(a.data.pubDate).getTime());
--- ---
<Base> <General>
{ {
posts.map((post) => ( posts.map((post) => (
<Summary <Summary