mirror of
https://github.com/Patiun/com.gregkilmer.www.git
synced 2026-11-08 04:08:24 +00:00
gaming updates
This commit is contained in:
@@ -9,45 +9,95 @@ import BaseLayout from "@layouts/BaseLayout.astro";
|
||||
import Reveal from "@components/motion/Reveal.astro";
|
||||
import InterestHero from "@components/layout/InterestHero.astro";
|
||||
import InterestCard from "@components/cards/InterestCard.astro";
|
||||
import GameCard from "@components/cards/GameCard.astro";
|
||||
import SectionHeader from "@components/layout/SectionHeader.astro";
|
||||
import RelatedInterests from "@components/layout/RelatedInterests.astro";
|
||||
import Placeholder from "@components/layout/Placeholder.astro";
|
||||
import Icon from "@components/Icon.astro";
|
||||
import { getCollection, getEntry } from "astro:content";
|
||||
import { platformToIcon } from "@lib/platforms";
|
||||
|
||||
const platforms = [
|
||||
{
|
||||
icon: "sony-playstation",
|
||||
title: "PlayStation 5",
|
||||
body: "Main console for AAA titles and exclusives.",
|
||||
body: "Mainly for single player and exclusives.",
|
||||
},
|
||||
{
|
||||
icon: "nintendo-switch",
|
||||
title: "Nintendo Switch / Switch 2",
|
||||
body: "Handheld and docked. Nintendo first-party plus indie gems.",
|
||||
body: "Handheld and docked. Pokemon, Mario, and many other Nintendo and indie gems.",
|
||||
},
|
||||
{
|
||||
icon: "steam",
|
||||
title: "Steam",
|
||||
body: "The primary PC library. Strategy, RPGs, and an ever-growing backlog.",
|
||||
body: "The primary game library. Strategy, RPGs, Adventure, oh my! And an ever-growing backlog.",
|
||||
},
|
||||
];
|
||||
|
||||
/**
|
||||
* Favorite genres. Each is a small card with an mdi icon and a one-line blurb
|
||||
* on what Greg loves about that genre. Page-local; edit freely.
|
||||
*/
|
||||
const genres = [
|
||||
"RPGs (both Western and JRPG)",
|
||||
"Strategy and tactics",
|
||||
"Building and crafting",
|
||||
"Automation",
|
||||
"Open-world exploration",
|
||||
"Indie darlings",
|
||||
{
|
||||
icon: "sword-cross",
|
||||
name: "RPGs (Western & JRPG)",
|
||||
blurb:
|
||||
"Character progression and stories I can live in for 100+ hours and then turn around and do it again.",
|
||||
},
|
||||
{
|
||||
icon: "pokeball",
|
||||
name: "Creature Collecting",
|
||||
blurb: "If I can catch, train, or befriend a roster, I'm sold.",
|
||||
},
|
||||
{
|
||||
icon: "chess-king",
|
||||
name: "Strategy & Tactics",
|
||||
blurb:
|
||||
"Turn-based puzzles and tactical challengeswhere the right plan is oh so rewarding.",
|
||||
},
|
||||
{
|
||||
icon: "hammer",
|
||||
name: "Building & Crafting",
|
||||
blurb:
|
||||
"Give me a grid, resources, and a goal, and watch the evening vanish.",
|
||||
},
|
||||
{
|
||||
icon: "factory",
|
||||
name: "Automation",
|
||||
blurb: "Optimizing a production line until its perfect is my zen.",
|
||||
},
|
||||
{
|
||||
icon: "compass-outline",
|
||||
name: "Open-world Exploration",
|
||||
blurb:
|
||||
"The map IS the point. I will try to climb every mountain and I will check every waterfall for treasure.",
|
||||
},
|
||||
{
|
||||
icon: "star-four-points",
|
||||
name: "Indie Darlings",
|
||||
blurb:
|
||||
"The small, weird, passionate projects that punch far above their size.",
|
||||
},
|
||||
];
|
||||
|
||||
// Gaming Hall of Fame — one file per game in src/content/games/hall-of-fame/.
|
||||
const hallOfFame = (await getCollection("games")).sort(
|
||||
(a, b) => a.data.order - b.data.order,
|
||||
);
|
||||
|
||||
// Currently playing — single list in src/content/games/now-playing.yaml.
|
||||
const nowPlayingEntry = await getEntry("nowPlaying", "now-playing");
|
||||
const nowPlaying = nowPlayingEntry?.data.games ?? [];
|
||||
|
||||
const related = [
|
||||
{
|
||||
/*{
|
||||
href: "/interests/pokemon",
|
||||
title: "Pokémon",
|
||||
icon: "pokeball",
|
||||
blurb: "Nintendo console overlap and a lifelong obsession.",
|
||||
},
|
||||
},*/
|
||||
{
|
||||
href: "/interests/ttrpgs",
|
||||
title: "TTRPGs & Tabletop",
|
||||
@@ -63,9 +113,9 @@ const related = [
|
||||
description="PlayStation 5, Nintendo Switch 2, and a Steam library that has gotten politely out of hand. RPGs, strategy, and deeply layered worlds."
|
||||
>
|
||||
<InterestHero
|
||||
icon="sony-playstation"
|
||||
icon="gamepad-variant"
|
||||
title="Gaming"
|
||||
tagline="If it has a screen or a controller, I have probably played it."
|
||||
tagline="Walking in another's shoes, escaping reality, or obsessively completing collections, one game at a time."
|
||||
image="/images/gaming-setup.jpg"
|
||||
imageAlt="A gaming setup with controller and console"
|
||||
/>
|
||||
@@ -78,11 +128,16 @@ const related = [
|
||||
>
|
||||
<Reveal
|
||||
><p>
|
||||
Gaming is my other constant. I span console generations with a
|
||||
PlayStation 5, Nintendo Switch 2, and a Steam library that has gotten
|
||||
politely out of hand. I'm particularly drawn to RPGs, strategy games,
|
||||
and anything with a deeply layered world. If a game has lore
|
||||
compendiums, I'm reading them.
|
||||
Gaming has always been a passion in my life. I span console
|
||||
generations from the Sega Genesis to the modern era. I play mainly
|
||||
with a PlayStation 5, Nintendo Switch 2, and a Steam library that has
|
||||
gotten politely out of hand. I'm particularly drawn to RPGs, strategy
|
||||
games, and anything with a creature to tame or a deeply layered world
|
||||
to explore. But a good game loop will get me sucked in harder than the
|
||||
sunk cost fallacy of a League of Legends streak. I love to play with
|
||||
friends, but have found myself leaning more towards single-player
|
||||
experiences. Someone should have told younger me that scheduling would
|
||||
be the final boss!
|
||||
</p></Reveal
|
||||
>
|
||||
</section>
|
||||
@@ -119,16 +174,37 @@ const related = [
|
||||
/></Reveal
|
||||
>
|
||||
<Reveal delay={80}>
|
||||
<ul class="flex flex-wrap gap-3">
|
||||
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
||||
{
|
||||
genres.map((g) => (
|
||||
<li class="pill text-sm">
|
||||
<Icon name="star-four-points" class="h-3.5 w-3.5" />
|
||||
{g}
|
||||
</li>
|
||||
genres.map((g, i) => (
|
||||
<Reveal delay={i * 60}>
|
||||
<article class="card card-interactive flex h-full flex-col gap-2 p-4">
|
||||
<div class="flex items-center gap-2.5">
|
||||
<span
|
||||
class="inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-lg"
|
||||
style="background: color-mix(in srgb, var(--color-accent) 16%, transparent); color: var(--color-accent);"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<Icon name={g.icon} class="h-5 w-5" />
|
||||
</span>
|
||||
<h3
|
||||
class="font-sans text-base"
|
||||
style="color: var(--color-text);"
|
||||
>
|
||||
{g.name}
|
||||
</h3>
|
||||
</div>
|
||||
<p
|
||||
class="text-sm leading-relaxed"
|
||||
style="color: var(--color-text-muted);"
|
||||
>
|
||||
{g.blurb}
|
||||
</p>
|
||||
</article>
|
||||
</Reveal>
|
||||
))
|
||||
}
|
||||
</ul>
|
||||
</div>
|
||||
</Reveal>
|
||||
</section>
|
||||
|
||||
@@ -141,24 +217,63 @@ const related = [
|
||||
title="Now playing"
|
||||
/></Reveal
|
||||
>
|
||||
<div class="grid gap-4 sm:grid-cols-[1fr_1fr]">
|
||||
<figure
|
||||
class="relative overflow-hidden rounded-xl border"
|
||||
style="border-color: color-mix(in srgb, var(--color-accent) 35%, transparent);"
|
||||
>
|
||||
<img
|
||||
src="/images/gaming-setup.jpg"
|
||||
alt="Gaming setup"
|
||||
loading="lazy"
|
||||
decoding="async"
|
||||
class="aspect-[4/3] w-full object-cover"
|
||||
{
|
||||
nowPlaying.length > 0 ? (
|
||||
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
||||
{nowPlaying.map((g, i) => (
|
||||
<Reveal delay={i * 60}>
|
||||
<InterestCard
|
||||
icon={platformToIcon(g.platform)}
|
||||
title={g.title}
|
||||
currently
|
||||
>
|
||||
{g.platform}
|
||||
</InterestCard>
|
||||
</Reveal>
|
||||
))}
|
||||
</div>
|
||||
) : (
|
||||
<Placeholder
|
||||
label="Currently playing"
|
||||
hint="Add games to src/content/games/now-playing.yaml."
|
||||
/>
|
||||
</figure>
|
||||
<Placeholder
|
||||
label="Currently playing"
|
||||
hint="Add the games you are actively playing right now."
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</section>
|
||||
|
||||
{/* Gaming Hall of Fame */}
|
||||
<section class="flex flex-col gap-6">
|
||||
<Reveal
|
||||
><SectionHeader
|
||||
kicker="Hall of Fame"
|
||||
icon="trophy"
|
||||
title="All-time favorites"
|
||||
/></Reveal
|
||||
>
|
||||
{
|
||||
hallOfFame.length > 0 ? (
|
||||
<div class="grid gap-5 sm:grid-cols-2 lg:grid-cols-3">
|
||||
{hallOfFame.map((g, i) => (
|
||||
<Reveal delay={i * 80}>
|
||||
<GameCard
|
||||
title={g.data.title}
|
||||
platform={g.data.platform}
|
||||
blurb={g.data.blurb}
|
||||
art={g.data.art}
|
||||
artAlt={g.data.artAlt}
|
||||
year={g.data.year}
|
||||
icon={g.data.icon}
|
||||
/>
|
||||
</Reveal>
|
||||
))}
|
||||
</div>
|
||||
) : (
|
||||
<Placeholder
|
||||
label="Gaming Hall of Fame"
|
||||
hint="Add games to src/content/games/hall-of-fame/."
|
||||
/>
|
||||
)
|
||||
}
|
||||
</section>
|
||||
|
||||
<RelatedInterests items={related} />
|
||||
|
||||
@@ -27,7 +27,7 @@ const interests = [
|
||||
},
|
||||
{
|
||||
href: "/interests/gaming",
|
||||
icon: "sony-playstation",
|
||||
icon: "gamepad-variant",
|
||||
title: "Gaming",
|
||||
tagline: "We do not talk about my backlog.",
|
||||
blurb:
|
||||
|
||||
@@ -5,26 +5,57 @@
|
||||
* Per-interest template with equipment card grid, a gallery placeholder, and the
|
||||
* spec's connection-to-TTRPGs callout. Related links back to TTRPGs and Gaming.
|
||||
*/
|
||||
import BaseLayout from '@layouts/BaseLayout.astro';
|
||||
import Reveal from '@components/motion/Reveal.astro';
|
||||
import InterestHero from '@components/layout/InterestHero.astro';
|
||||
import InterestCard from '@components/cards/InterestCard.astro';
|
||||
import SectionHeader from '@components/layout/SectionHeader.astro';
|
||||
import RelatedInterests from '@components/layout/RelatedInterests.astro';
|
||||
import Placeholder from '@components/layout/Placeholder.astro';
|
||||
import Icon from '@components/Icon.astro';
|
||||
import CelestialImage from '@components/mystic/CelestialImage.astro';
|
||||
import BaseLayout from "@layouts/BaseLayout.astro";
|
||||
import Reveal from "@components/motion/Reveal.astro";
|
||||
import InterestHero from "@components/layout/InterestHero.astro";
|
||||
import InterestCard from "@components/cards/InterestCard.astro";
|
||||
import SectionHeader from "@components/layout/SectionHeader.astro";
|
||||
import RelatedInterests from "@components/layout/RelatedInterests.astro";
|
||||
import Placeholder from "@components/layout/Placeholder.astro";
|
||||
import Icon from "@components/Icon.astro";
|
||||
import CelestialImage from "@components/mystic/CelestialImage.astro";
|
||||
|
||||
const equipment = [
|
||||
{ icon: 'palette', title: 'Resin Dice Making', body: 'Custom molds, pressure pot curing, pigment experimentation. Producing dice sets for personal use and gifts.' },
|
||||
{ icon: 'printer-3d', title: 'Elegoo Mars 4', body: 'Resin 3D printer. Miniatures, terrain, and high-detail props.' },
|
||||
{ icon: 'printer-3d-nozzle', title: 'Bambu Labs P1S', body: 'FDM 3D printer. Functional prints, terrain pieces, and larger prototypes.' },
|
||||
{ icon: 'wrench', title: 'General Making', body: 'Always experimenting. If there is a new technique or material, I want to try it.' },
|
||||
{
|
||||
icon: "dice-multiple",
|
||||
title: "Resin Dice Making",
|
||||
body: "Custom molds, pressure pot curing, pigment experimentation. Producing dice sets for personal use and gifts.",
|
||||
},
|
||||
{
|
||||
icon: "printer-3d",
|
||||
title: "Elegoo Mars 4",
|
||||
body: "Resin 3D printer. Miniatures, terrain, and high-detail props.",
|
||||
},
|
||||
{
|
||||
icon: "printer-3d-nozzle",
|
||||
title: "Bambu Labs P1S",
|
||||
body: "FDM 3D printer. Functional prints, terrain pieces, and larger prototypes.",
|
||||
},
|
||||
{
|
||||
icon: "scissors-cutting",
|
||||
title: "Silhouette Cameo 5a",
|
||||
body: "Multi material cutting machine. Silly stickers, custom vinyl decals, and custom/proxy TCG cards.",
|
||||
},
|
||||
{
|
||||
icon: "wrench",
|
||||
title: "General Making",
|
||||
body: "Always experimenting and hoarding nice cardboard. If there is a new technique or material, I want to try it.",
|
||||
},
|
||||
];
|
||||
|
||||
const related = [
|
||||
{ href: '/interests/ttrpgs', title: 'TTRPGs & Tabletop', icon: 'dice-multiple', blurb: 'Much of what I make ends up on the virtual table.' },
|
||||
{ href: '/interests/reading', title: 'Reading & Media', icon: 'book-open-page-variant', blurb: 'Displays and props for the stories I love.' },
|
||||
{
|
||||
href: "/interests/ttrpgs",
|
||||
title: "TTRPGs & Tabletop",
|
||||
icon: "dice-multiple",
|
||||
blurb: "Much of what I make ends up on the virtual table.",
|
||||
},
|
||||
{
|
||||
href: "/interests/reading",
|
||||
title: "Reading & Media",
|
||||
icon: "book-open-page-variant",
|
||||
blurb: "Displays and props for the stories I love.",
|
||||
},
|
||||
];
|
||||
---
|
||||
|
||||
@@ -36,58 +67,128 @@ const related = [
|
||||
<InterestHero
|
||||
icon="palette"
|
||||
title="Making & Creating"
|
||||
tagline="If it involves layers and precision, I am in."
|
||||
tagline="A magnet for super glue and nice cardboard."
|
||||
image="/images/making-print.jpg"
|
||||
imageAlt="A 3D printer producing a detailed model"
|
||||
/>
|
||||
|
||||
<div class="container-prose flex flex-col gap-20 py-12 sm:py-16">
|
||||
{/* Overview */}
|
||||
<section class="flex flex-col gap-5 text-lg leading-relaxed" style="color: var(--color-text-muted);">
|
||||
<Reveal><p>Making is how I decompress. I cast resin dice using pressure pots and custom molds, print miniatures and props on my Elegoo Mars 4 (resin) and Bambu Labs P1S (FDM), and generally fill my workspace with projects-in-progress. There's something deeply satisfying about taking raw material through a process and holding the finished piece, whether that's a perfect polyhedral set or a printed terrain piece for the next game session.</p></Reveal>
|
||||
<section
|
||||
class="flex flex-col gap-5 text-lg leading-relaxed"
|
||||
style="color: var(--color-text-muted);"
|
||||
>
|
||||
<Reveal
|
||||
><p>
|
||||
Making is part of me. Ever since I can remember, I had been dreaming
|
||||
of making inventions and things from cardboard and clay. I took things
|
||||
apart to see how they worked, and rarely got them back together. But
|
||||
now I have the tools and the skills to take ideas from my imagination
|
||||
and physically produce them. I cast resin dice using pressure pots and
|
||||
custom molds, print miniatures and props on my Elegoo Mars 4 (resin)
|
||||
and Bambu Labs P1S (FDM), and generally fill my workspace with
|
||||
projects-in-progress. I make beatiful cards as gifts and even make
|
||||
proxy mockups of trading cards to enjoy games casually.
|
||||
</p></Reveal
|
||||
>
|
||||
<Reveal>
|
||||
<p>
|
||||
There's something deeply satisfying about taking raw material through
|
||||
a process and holding the finished piece, whether that's a perfect
|
||||
polyhedral set or a hook that fits just right in that weird spot in
|
||||
the bathroom. The ability to blend my technial skills and my creative
|
||||
impulses into tangible objects is a fantasy come true my child self
|
||||
only dreamed of.
|
||||
</p></Reveal
|
||||
>
|
||||
</section>
|
||||
|
||||
{/* Equipment */}
|
||||
<section class="flex flex-col gap-6">
|
||||
<Reveal><SectionHeader kicker="Equipment" icon="toolbox" title="What is on the bench" /></Reveal>
|
||||
<Reveal
|
||||
><SectionHeader
|
||||
kicker="Equipment"
|
||||
icon="toolbox"
|
||||
title="What is on the bench"
|
||||
/></Reveal
|
||||
>
|
||||
<div class="grid gap-5 sm:grid-cols-2 lg:grid-cols-2">
|
||||
{equipment.map((e, i) => (
|
||||
<Reveal delay={i * 70}>
|
||||
<InterestCard icon={e.icon} title={e.title}>{e.body}</InterestCard>
|
||||
</Reveal>
|
||||
))}
|
||||
{
|
||||
equipment.map((e, i) => (
|
||||
<Reveal delay={i * 70}>
|
||||
<InterestCard icon={e.icon} title={e.title}>
|
||||
{e.body}
|
||||
</InterestCard>
|
||||
</Reveal>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Gallery */}
|
||||
<section class="flex flex-col gap-6">
|
||||
<Reveal><SectionHeader kicker="Gallery" icon="image-multiple" title="Finished pieces" /></Reveal>
|
||||
<Reveal
|
||||
><SectionHeader
|
||||
kicker="Gallery"
|
||||
icon="image-multiple"
|
||||
title="Finished pieces"
|
||||
/></Reveal
|
||||
>
|
||||
<Reveal delay={80}>
|
||||
<div class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
|
||||
<CelestialImage src="/images/making-resin.jpg" alt="Resin dice set" aspect="4/3" />
|
||||
<CelestialImage src="/images/making-print.jpg" alt="3D printed miniature" aspect="4/3" />
|
||||
<CelestialImage src="/images/ttrpg-dice.jpg" alt="Terrain piece and dice" aspect="4/3" />
|
||||
<CelestialImage
|
||||
src="/images/making-resin.jpg"
|
||||
alt="Resin dice set"
|
||||
aspect="4/3"
|
||||
/>
|
||||
<CelestialImage
|
||||
src="/images/making-print.jpg"
|
||||
alt="3D printed miniature"
|
||||
aspect="4/3"
|
||||
/>
|
||||
<CelestialImage
|
||||
src="/images/ttrpg-dice.jpg"
|
||||
alt="Terrain piece and dice"
|
||||
aspect="4/3"
|
||||
/>
|
||||
</div>
|
||||
</Reveal>
|
||||
<Reveal delay={120}>
|
||||
<Placeholder label="Your real photos" hint="Swap these stock stand-ins with photos of your own resin casts and prints." />
|
||||
</Reveal>
|
||||
</section>
|
||||
|
||||
{/* Connection to TTRPGs */}
|
||||
<section class="flex flex-col gap-5">
|
||||
<Reveal><SectionHeader kicker="Cross-pollination" icon="link-variant" title="Where it all connects" /></Reveal>
|
||||
<Reveal
|
||||
><SectionHeader
|
||||
kicker="Cross-pollination"
|
||||
icon="link-variant"
|
||||
title="Where it all connects"
|
||||
/></Reveal
|
||||
>
|
||||
<Reveal delay={80}>
|
||||
<a
|
||||
href="/interests/ttrpgs"
|
||||
class="card card-interactive group flex items-center gap-4"
|
||||
>
|
||||
<Icon name="dice-multiple" class="h-8 w-8 shrink-0" style="color: var(--color-accent);" />
|
||||
<Icon
|
||||
name="dice-multiple"
|
||||
class="h-8 w-8 shrink-0"
|
||||
style="color: var(--color-accent);"
|
||||
/>
|
||||
<span class="flex flex-col gap-1">
|
||||
<span class="font-sans font-semibold" style="color: var(--color-text);">Much of what I make ends up on the virtual table.</span>
|
||||
<span class="text-sm" style="color: var(--color-text-muted);">Custom tokens, terrain, and props for Foundry VTT campaigns.</span>
|
||||
<span
|
||||
class="font-sans font-semibold"
|
||||
style="color: var(--color-text);"
|
||||
>Much of what I make ends up on the virtual table.</span
|
||||
>
|
||||
<span class="text-sm" style="color: var(--color-text-muted);"
|
||||
>Custom tokens, terrain, and props for Foundry VTT campaigns.</span
|
||||
>
|
||||
</span>
|
||||
<Icon name="arrow-right" class="ml-auto h-5 w-5 shrink-0 transition-transform group-hover:translate-x-1" style="color: var(--color-accent);" />
|
||||
<Icon
|
||||
name="arrow-right"
|
||||
class="ml-auto h-5 w-5 shrink-0 transition-transform group-hover:translate-x-1"
|
||||
style="color: var(--color-accent);"
|
||||
/>
|
||||
</a>
|
||||
</Reveal>
|
||||
</section>
|
||||
|
||||
@@ -15,7 +15,7 @@ import Placeholder from '@components/layout/Placeholder.astro';
|
||||
import Icon from '@components/Icon.astro';
|
||||
|
||||
const related = [
|
||||
{ href: '/interests/gaming', title: 'Gaming', icon: 'sony-playstation', blurb: 'Nintendo console overlap, from Game Boy to Switch 2.' },
|
||||
{ href: '/interests/gaming', title: 'Gaming', icon: 'gamepad-variant', blurb: 'Nintendo console overlap, from Game Boy to Switch 2.' },
|
||||
{ href: '/interests/making', title: 'Making & Creating', icon: 'palette', blurb: 'Displays and props for collections.' },
|
||||
];
|
||||
---
|
||||
|
||||
@@ -24,7 +24,7 @@ const highlights = [
|
||||
|
||||
const related = [
|
||||
{ href: '/interests/making', title: 'Making & Creating', icon: 'palette', blurb: 'Dice and terrain made for campaigns.' },
|
||||
{ href: '/interests/gaming', title: 'Gaming', icon: 'sony-playstation', blurb: 'Digital RPGs as another expression of the same impulse.' },
|
||||
{ href: '/interests/gaming', title: 'Gaming', icon: 'gamepad-variant', blurb: 'Digital RPGs as another expression of the same impulse.' },
|
||||
];
|
||||
---
|
||||
|
||||
|
||||
Reference in New Issue
Block a user