diff --git a/astro.config.ts b/astro.config.ts index 95d96cd..cb6a767 100644 --- a/astro.config.ts +++ b/astro.config.ts @@ -64,14 +64,13 @@ export default defineConfig({ const newName = { "github-light": "light", - "github-dark-high-contrast": "dark", "catppuccin-latte": "catppuccin_latte", "catppuccin-mocha": "catppuccin_mocha", "catppuccin-macchiato": "catppuccin_macchiato", "catppuccin-frappe": "catppuccin_frappe", - // closest bundled matches for the site's custom themes "everforest-dark": "evergarden", - poimandres: "cuddlefish", + poimandres: "dark", + "github-dark-high-contrast": "cuddlefish", }[theme.name] || theme.name; theme.name = newName; diff --git a/src/components/BackLink.astro b/src/components/BackLink.astro index a3b643f..31cc4f0 100644 --- a/src/components/BackLink.astro +++ b/src/components/BackLink.astro @@ -9,7 +9,7 @@ const { href, label = "back home" } = Astro.props; ← {label} diff --git a/src/components/NavCard.astro b/src/components/NavCard.astro index 493bf06..d83329d 100644 --- a/src/components/NavCard.astro +++ b/src/components/NavCard.astro @@ -12,11 +12,14 @@ const { href, label, icon } = Astro.props; - {label} + {label} diff --git a/src/components/PageHeader.astro b/src/components/PageHeader.astro index 7cfbe7d..2272bc9 100644 --- a/src/components/PageHeader.astro +++ b/src/components/PageHeader.astro @@ -9,7 +9,15 @@ const { title, description } = Astro.props;
-

{title}

+
+

+ {title} +

+ +
{description &&

{description}

}
diff --git a/src/components/PostCard.astro b/src/components/PostCard.astro index 05c4dee..6d9b768 100644 --- a/src/components/PostCard.astro +++ b/src/components/PostCard.astro @@ -29,7 +29,7 @@ const formattedDate = date.toLocaleDateString("en-GB", { - {title} + {title} {formattedDate} ) : ( <>
- + {title} {formattedDate} diff --git a/src/components/ProjectCard.astro b/src/components/ProjectCard.astro index 1015609..f25dd29 100644 --- a/src/components/ProjectCard.astro +++ b/src/components/ProjectCard.astro @@ -27,7 +27,7 @@ const { target="_blank" rel="noopener noreferrer" class:list={[ - "group flex gap-3 bg-card rounded-lg hover:ring-1 hover:ring-special transition-all", + "group flex gap-3 panel-link", compact ? "flex-row items-center p-3" : "flex-col p-4 h-full", ]} > @@ -39,12 +39,15 @@ const { alt={name} width={compact ? 24 : 32} height={compact ? 24 : 32} - class="rounded" + class:list={[ + "rounded shrink-0 object-contain", + compact ? "w-6 h-6" : "w-8 h-8", + ]} /> ) : (
@@ -58,7 +61,7 @@ const { @@ -80,12 +83,12 @@ const { <> {description &&

{description}

}
- + {stars} {repo && ( <> · - + )}
diff --git a/src/components/SectionHeader.astro b/src/components/SectionHeader.astro index 33cb508..16a341c 100644 --- a/src/components/SectionHeader.astro +++ b/src/components/SectionHeader.astro @@ -8,13 +8,18 @@ interface Props { const { title, href, linkLabel = "view all →" } = Astro.props; --- -
-

{title}

+
+

+ {title} +

+ { href && (
{linkLabel} diff --git a/src/components/SocialLinks.astro b/src/components/SocialLinks.astro index 9ed8715..9d21dae 100644 --- a/src/components/SocialLinks.astro +++ b/src/components/SocialLinks.astro @@ -56,14 +56,14 @@ const defaultLinks: SocialLink[] = [ const { links = defaultLinks } = Astro.props; --- -
+
{ links.map((link) => ( {link.icon ? ( diff --git a/src/components/Spacer.astro b/src/components/Spacer.astro new file mode 100644 index 0000000..1f17219 --- /dev/null +++ b/src/components/Spacer.astro @@ -0,0 +1,18 @@ +--- +interface Props { + glyph?: string; +} + +const { glyph = "✦" } = Astro.props; +--- + + diff --git a/src/components/Tag.astro b/src/components/Tag.astro index b5edc42..9c62592 100644 --- a/src/components/Tag.astro +++ b/src/components/Tag.astro @@ -11,7 +11,7 @@ const { tag, linked = true } = Astro.props; linked ? ( #{tag} diff --git a/src/components/ThemeSwitcher.astro b/src/components/ThemeSwitcher.astro index bcb1af5..df02ef4 100644 --- a/src/components/ThemeSwitcher.astro +++ b/src/components/ThemeSwitcher.astro @@ -1,68 +1,41 @@ --- import { Icon } from "astro-icon/components"; + +const THEMES = [ + { id: "dark", label: "Dark" }, + { id: "light", label: "Light" }, + { id: "catppuccin_mocha", label: "Catppuccin Mocha" }, + { id: "catppuccin_macchiato", label: "Catppuccin Macchiato" }, + { id: "catppuccin_frappe", label: "Catppuccin Frappé" }, + { id: "catppuccin_latte", label: "Catppuccin Latte" }, + { id: "evergarden", label: "Evergarden" }, + { id: "cuddlefish", label: "Cuddlefish" }, +]; --- -
+
diff --git a/src/layouts/Base.astro b/src/layouts/Base.astro index 6c940c2..bcb26d1 100644 --- a/src/layouts/Base.astro +++ b/src/layouts/Base.astro @@ -19,9 +19,29 @@ const props = Astro.props; - +
+ + + + + +
diff --git a/src/layouts/PageLayout.astro b/src/layouts/PageLayout.astro new file mode 100644 index 0000000..69de09b --- /dev/null +++ b/src/layouts/PageLayout.astro @@ -0,0 +1,42 @@ +--- +import Base from "@layouts/Base.astro"; +import PageHeader from "@components/PageHeader.astro"; +import BackLink from "@components/BackLink.astro"; + +interface Props { + title: string; + description?: string; + metaTitle?: string; + metaDescription?: string; + image?: string; + aturi?: string; + back?: boolean; +} + +const { + title, + description, + metaTitle = title, + metaDescription = description ?? "", + image, + aturi, + back = true, +} = Astro.props; +--- + + +
+ + + + + + + {back && } +
+ diff --git a/src/pages/blog/[...slug].astro b/src/pages/blog/[...slug].astro index f09ee76..b89f4bd 100644 --- a/src/pages/blog/[...slug].astro +++ b/src/pages/blog/[...slug].astro @@ -43,12 +43,12 @@ const { Content } = await render(post); image={`/blog/${post.id}.png`} aturi={post.data.atUri} > -
+
-

{post.data.title}

+

+ {post.data.title} +

-
+
-

share this post

+

+ share this post +

← previous - + {prevPost.data.title} @@ -146,10 +148,10 @@ const { Content } = await render(post); nextPost ? ( next → - + {nextPost.data.title} diff --git a/src/pages/blog/index.astro b/src/pages/blog/index.astro index 77a46a4..11a7e18 100644 --- a/src/pages/blog/index.astro +++ b/src/pages/blog/index.astro @@ -1,9 +1,7 @@ --- import { getCollection } from "astro:content"; -import Base from "@layouts/Base.astro"; -import PageHeader from "@components/PageHeader.astro"; -import BackLink from "@components/BackLink.astro"; +import PageLayout from "@layouts/PageLayout.astro"; import Tag from "@components/Tag.astro"; import PostCard from "@components/PostCard.astro"; @@ -18,16 +16,14 @@ const posts = ( import { SITE_TITLES, SITE_DESCRIPTIONS } from "@lib/consts"; --- - -
- -
-

tags

+

tags

{ [...new Set(posts.flatMap((post) => post.data.tags))].map((tag) => ( @@ -38,7 +34,7 @@ import { SITE_TITLES, SITE_DESCRIPTIONS } from "@lib/consts";
-

all posts

+

all posts

    { posts.map((post) => ( @@ -56,7 +52,4 @@ import { SITE_TITLES, SITE_DESCRIPTIONS } from "@lib/consts"; }
- - -
- + diff --git a/src/pages/blog/tag/[...slug].astro b/src/pages/blog/tag/[...slug].astro index ca10b6e..8409ec3 100644 --- a/src/pages/blog/tag/[...slug].astro +++ b/src/pages/blog/tag/[...slug].astro @@ -1,8 +1,7 @@ --- import { getCollection } from "astro:content"; -import Base from "@layouts/Base.astro"; -import PageHeader from "@components/PageHeader.astro"; +import PageLayout from "@layouts/PageLayout.astro"; import BackLink from "@components/BackLink.astro"; import PostCard from "@components/PostCard.astro"; @@ -54,18 +53,14 @@ export async function getStaticPaths() { } --- - -
- - - +
    @@ -84,7 +79,4 @@ export async function getStaticPaths() { }
- - -
- + diff --git a/src/pages/donate.astro b/src/pages/donate.astro index 7855bf7..ab3d4eb 100644 --- a/src/pages/donate.astro +++ b/src/pages/donate.astro @@ -1,9 +1,7 @@ --- import { Icon } from "astro-icon/components"; -import Base from "@layouts/Base.astro"; -import PageHeader from "@components/PageHeader.astro"; -import BackLink from "@components/BackLink.astro"; +import PageLayout from "@layouts/PageLayout.astro"; const DONATION_OPTIONS = [ { @@ -48,20 +46,21 @@ const CRYPTO_OPTIONS = [ ]; --- - -
- - +
-

ways to support

+

+ ways to support +

    { DONATION_OPTIONS.map((option) => ( @@ -70,7 +69,7 @@ const CRYPTO_OPTIONS = [ href={option.href} target="_blank" rel="noopener noreferrer" - class="group flex flex-row items-center gap-4 p-4 bg-card rounded-lg hover:ring-1 hover:ring-special transition-all" + class="group flex flex-row items-center gap-4 p-4 panel-link" >
    - + {option.name} @@ -108,7 +107,7 @@ const CRYPTO_OPTIONS = [
-

crypto

+

crypto

    { CRYPTO_OPTIONS.map((option) => ( @@ -116,7 +115,7 @@ const CRYPTO_OPTIONS = [
- - -
- +