feat: meta viewport

This commit is contained in:
Lewis Wynne 2026-01-23 16:05:52 +00:00
parent 573b0eef89
commit d1803384a6
8 changed files with 45 additions and 67 deletions

View file

@ -0,0 +1,23 @@
---
import '../styles/global.css';
interface Props {
title: string;
showHeader?: boolean;
isHome?: boolean;
}
const { title, showHeader = true, isHome = false } = Astro.props;
---
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>{title}</title></head>
<body>
{showHeader && (
<header>
<pre>{isHome ? 'lewis m.w.' : <a href="/">lewis m.w.</a>} <a href="mailto:lewis@wynne.rs">mail</a> <a href="https://github.com/llywelwyn">gh</a></pre>
</header>
)}
<slot />
</body>
</html>

View file

@ -4,7 +4,7 @@ export const prerender = false;
import { getSession } from 'auth-astro/server'; import { getSession } from 'auth-astro/server';
import { getPendingEntries, type GuestbookEntry } from '../lib/db'; import { getPendingEntries, type GuestbookEntry } from '../lib/db';
import { isAdmin } from '../lib/auth'; import { isAdmin } from '../lib/auth';
import '../styles/global.css'; import Layout from '../layouts/Layout.astro';
let session; let session;
try { try {
@ -35,10 +35,8 @@ function formatDate(date: Date): string {
return `${d}/${m}/${y}`; return `${d}/${m}/${y}`;
} }
--- ---
<!DOCTYPE html> <Layout title="admin - guestbook" showHeader={false}>
<html>
<head><meta charset="UTF-8"><title>admin - guestbook</title></head>
<body>
<h1>guestbook admin</h1> <h1>guestbook admin</h1>
<p>logged in as {session.user?.name} <a href="/api/auth/signout">sign out</a></p> <p>logged in as {session.user?.name} <a href="/api/auth/signout">sign out</a></p>
@ -92,5 +90,4 @@ function formatDate(date: Date): string {
}); });
}); });
</script> </script>
</body> </Layout>
</html>

View file

@ -1,6 +1,6 @@
--- ---
import { getCollection, render } from 'astro:content'; import { getCollection, render } from 'astro:content';
import '../../styles/global.css'; import Layout from '../../layouts/Layout.astro';
export async function getStaticPaths() { export async function getStaticPaths() {
const posts = await getCollection('posts'); const posts = await getCollection('posts');
@ -13,17 +13,10 @@ export async function getStaticPaths() {
const { post } = Astro.props; const { post } = Astro.props;
const { Content } = await render(post); const { Content } = await render(post);
--- ---
<!DOCTYPE html> <Layout title={`${post.data.title} - lewis m.w.`}>
<html>
<head><meta charset="UTF-8"><title>{post.data.title} - lewis m.w.</title></head>
<body>
<header>
<pre><a href="/">lewis m.w.</a> <a href="mailto:lewis@wynne.rs">mail</a> <a href="https://github.com/llywelwyn">gh</a></pre>
</header>
<article> <article>
<h1>{post.data.title}</h1> <h1>{post.data.title}</h1>
<Content /> <Content />
</article> </article>
</body> </Layout>
</html>

View file

@ -1,6 +1,6 @@
--- ---
import { getCollection } from 'astro:content'; import { getCollection } from 'astro:content';
import '../../styles/global.css'; import Layout from '../../layouts/Layout.astro';
const posts = await getCollection('posts'); const posts = await getCollection('posts');
const sorted = posts.sort((a, b) => { const sorted = posts.sort((a, b) => {
@ -16,17 +16,10 @@ function formatDate(date: Date): string {
return `${d}/${m}/${y}`; return `${d}/${m}/${y}`;
} }
--- ---
<!DOCTYPE html> <Layout title="blog - lewis m.w.">
<html>
<head><meta charset="UTF-8"><title>blog - lewis m.w.</title></head>
<body>
<header>
<pre><a href="/">lewis m.w.</a> <a href="mailto:lewis@wynne.rs">mail</a> <a href="https://github.com/llywelwyn">gh</a></pre>
</header>
<details open> <details open>
<summary>blog</summary> <summary>blog</summary>
<pre set:html={sorted.map(post => `<span class="muted">${formatDate(post.data.date)}</span> <a href="/blog/${post.id}">${post.data.title}</a>${post.data.pinned ? ' [pinned]' : ''}`).join('\n')} /> <pre set:html={sorted.map(post => `<span class="muted">${formatDate(post.data.date)}</span> <a href="/blog/${post.id}">${post.data.title}</a>${post.data.pinned ? ' [pinned]' : ''}`).join('\n')} />
</details> </details>
</body> </Layout>
</html>

View file

@ -1,5 +1,5 @@
--- ---
import '../../styles/global.css'; import Layout from '../../layouts/Layout.astro';
import yaml from 'js-yaml'; import yaml from 'js-yaml';
import bookmarksRaw from '../../data/bookmarks.yaml?raw'; import bookmarksRaw from '../../data/bookmarks.yaml?raw';
@ -33,17 +33,10 @@ function extractDomain(url: string): string {
} }
} }
--- ---
<!DOCTYPE html> <Layout title="bookmarks - lewis m.w.">
<html>
<head><meta charset="UTF-8"><title>bookmarks - lewis m.w.</title></head>
<body>
<header>
<pre><a href="/">lewis m.w.</a> <a href="mailto:lewis@wynne.rs">mail</a> <a href="https://github.com/llywelwyn">gh</a></pre>
</header>
<details open> <details open>
<summary>bookmarks</summary> <summary>bookmarks</summary>
<pre set:html={bookmarks.map(b => `<span class="muted">${formatBookmarkDate(b.date)}</span> <a href="${b.url}">${b.title}</a> <span class="muted">(${extractDomain(b.url)})</span>`).join('\n')} /> <pre set:html={bookmarks.map(b => `<span class="muted">${formatBookmarkDate(b.date)}</span> <a href="${b.url}">${b.title}</a> <span class="muted">(${extractDomain(b.url)})</span>`).join('\n')} />
</details> </details>
</body> </Layout>
</html>

View file

@ -1,5 +1,5 @@
--- ---
import '../../styles/global.css'; import Layout from '../../layouts/Layout.astro';
import { getApprovedEntries, type GuestbookEntry } from '../../lib/db'; import { getApprovedEntries, type GuestbookEntry } from '../../lib/db';
let guestbookEntries: GuestbookEntry[] = []; let guestbookEntries: GuestbookEntry[] = [];
@ -16,13 +16,7 @@ function formatDate(date: Date): string {
return `${d}/${m}/${y}`; return `${d}/${m}/${y}`;
} }
--- ---
<!DOCTYPE html> <Layout title="guestbook - lewis m.w.">
<html>
<head><meta charset="UTF-8"><title>guestbook - lewis m.w.</title></head>
<body>
<header>
<pre><a href="/">lewis m.w.</a> <a href="mailto:lewis@wynne.rs">mail</a> <a href="https://github.com/llywelwyn">gh</a></pre>
</header>
<details open> <details open>
<summary>guestbook</summary> <summary>guestbook</summary>
@ -70,5 +64,4 @@ function formatDate(date: Date): string {
} }
}); });
</script> </script>
</body> </Layout>
</html>

View file

@ -1,6 +1,6 @@
--- ---
import { getCollection } from 'astro:content'; import { getCollection } from 'astro:content';
import '../styles/global.css'; import Layout from '../layouts/Layout.astro';
import yaml from 'js-yaml'; import yaml from 'js-yaml';
import bookmarksRaw from '../data/bookmarks.yaml?raw'; import bookmarksRaw from '../data/bookmarks.yaml?raw';
import fs from 'node:fs'; import fs from 'node:fs';
@ -68,13 +68,7 @@ function extractDomain(url: string): string {
} }
} }
--- ---
<!DOCTYPE html> <Layout title="lewis m.w." isHome>
<html>
<head><meta charset="UTF-8"><title>lewis m.w.</title></head>
<body>
<header>
<pre>lewis m.w. <a href="mailto:lewis@wynne.rs">mail</a> <a href="https://github.com/llywelwyn">gh</a></pre>
</header>
<details open> <details open>
<summary>blog</summary> <summary>blog</summary>
@ -146,5 +140,4 @@ function extractDomain(url: string): string {
} }
}); });
</script> </script>
</body> </Layout>
</html>

View file

@ -1,5 +1,5 @@
--- ---
import '../../styles/global.css'; import Layout from '../../layouts/Layout.astro';
import fs from 'node:fs'; import fs from 'node:fs';
import path from 'node:path'; import path from 'node:path';
@ -26,17 +26,10 @@ function formatDate(date: Date): string {
return `${d}/${m}/${y}`; return `${d}/${m}/${y}`;
} }
--- ---
<!DOCTYPE html> <Layout title="txt - lewis m.w.">
<html>
<head><meta charset="UTF-8"><title>txt - lewis m.w.</title></head>
<body>
<header>
<pre><a href="/">lewis m.w.</a> <a href="mailto:lewis@wynne.rs">mail</a> <a href="https://github.com/llywelwyn">gh</a></pre>
</header>
<details open> <details open>
<summary>txt</summary> <summary>txt</summary>
<pre set:html={txtFiles.map(f => `<span class="muted">${formatDate(f.mtime)}</span> <a href="/txt/${f.name}">${f.name}</a>`).join('\n')} /> <pre set:html={txtFiles.map(f => `<span class="muted">${formatDate(f.mtime)}</span> <a href="/txt/${f.name}">${f.name}</a>`).join('\n')} />
</details> </details>
</body> </Layout>
</html>