Redesign cynthia-poetry as elegant digital chapbook with 87 poems
- Organize 87 poems into 3 thematic sections: I. At the Threshold (mortality, hospice, accompaniment) II. The Country of Memory (family, childhood, remembrance) III. Wild Things, Still Breathing (nature, prayer, presence) - Create shared data module (src/data/poems.ts) with all poem content - Add book-format table of contents on homepage - Add sequential prev/next navigation between poems - Add section breadcrumbs on poem pages - Create About page with enriched biography and photos - Reframe essay as Afterword with proper navigation - Include both books: Meeting in the Margins + Mortal Beings - Download 3 photos of Cynthia and Meeting in the Margins cover - Add book-specific CSS (TOC entries, separators, poem nav) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
parent
f6651732c1
commit
f50cf2a58d
Binary file not shown.
|
After Width: | Height: | Size: 99 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 162 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 190 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
|
|
@ -0,0 +1,161 @@
|
|||
import Link from 'next/link';
|
||||
import Image from 'next/image';
|
||||
import type { Metadata } from 'next';
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'About Cynthia Trenshaw',
|
||||
description: 'The life and work of Cynthia Trenshaw (1942–2024) — poet, hospital chaplain, midwife to the dying, and author.',
|
||||
};
|
||||
|
||||
export default function AboutPage() {
|
||||
return (
|
||||
<div className="min-h-screen bg-white">
|
||||
{/* Header */}
|
||||
<header className="mx-auto max-w-3xl px-6 pt-12 pb-8 text-center border-b border-stone-100">
|
||||
<h1 className="font-serif text-4xl md:text-5xl text-stone-800">About Cynthia</h1>
|
||||
<p className="mt-4 text-stone-500">1942 — 2024</p>
|
||||
</header>
|
||||
|
||||
<article className="mx-auto max-w-3xl px-6 py-16">
|
||||
{/* Portrait */}
|
||||
<div className="float-right ml-8 mb-6 w-64 md:w-72">
|
||||
<div className="aspect-[3/4] relative rounded-sm overflow-hidden">
|
||||
<Image
|
||||
src="/images/cynthia/cynthia-portrait.jpeg"
|
||||
alt="Cynthia Trenshaw"
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="(max-width: 768px) 256px, 288px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="prose prose-stone prose-lg">
|
||||
<h2 className="font-serif text-2xl text-stone-800 mt-0">Early Life</h2>
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
Cynthia was born in 1942 and grew up in Indiana and Michigan. She attended Hillsdale
|
||||
College from 1960 to 1961, where she studied among a community that would later
|
||||
celebrate her literary achievements. She married Joe Trenshaw and together they raised
|
||||
three children: Tom, Katheryn, and Michael.
|
||||
</p>
|
||||
|
||||
<h2 className="font-serif text-2xl text-stone-800">A Year of Fire</h2>
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
In a single devastating year, Cynthia's thirteen-year-old son Tom was killed by
|
||||
gunfire, the family home burned, and her husband suffered a heart attack. These
|
||||
tragedies shaped her profoundly, deepening her understanding of grief and resilience,
|
||||
and ultimately directing her toward a life of service to others in crisis.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="clear-both" />
|
||||
|
||||
{/* Second photo */}
|
||||
<div className="my-12 flex justify-center">
|
||||
<div className="w-80 md:w-96 aspect-[4/3] relative rounded-sm overflow-hidden">
|
||||
<Image
|
||||
src="/images/cynthia/cynthia-hillsdale.jpg"
|
||||
alt="Cynthia Trenshaw at Hillsdale College"
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="(max-width: 768px) 320px, 384px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="prose prose-stone prose-lg">
|
||||
<h2 className="font-serif text-2xl text-stone-800">Second Chapter</h2>
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
Widowed at fifty-one, Cynthia reinvented her life. She earned a Master of Divinity
|
||||
from the Jesuit School of Theology at Berkeley, then served as a hospital chaplain
|
||||
and spiritual companion to the dying and their families for over three decades. She
|
||||
also worked as a massage therapist for homeless individuals in San Francisco and as
|
||||
a guardian ad litem — an advocate for children in court proceedings.
|
||||
</p>
|
||||
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
She eventually settled on Whidbey Island, Washington, where the landscape of sea
|
||||
and sky infused her later poetry.
|
||||
</p>
|
||||
|
||||
<h2 className="font-serif text-2xl text-stone-800">The Writer</h2>
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
Cynthia's writing drew from her decades at the bedside of the dying. Her first book,
|
||||
<em> A Harvest of Years</em>, was published in 2004. Her second, <em>Meeting in the
|
||||
Margins: An Invitation to Encounter the Invisible People Among Us</em> (She Writes
|
||||
Press, 2015), won the IPPY Gold Medal and chronicled her experiences among those
|
||||
society renders invisible — the homeless, the incarcerated, the dying.
|
||||
</p>
|
||||
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
Her poetry collection <em>Mortal Beings</em> was published by Finishing Line Press
|
||||
in 2019. Her poems appeared in numerous journals including <em>Sky Island Journal</em>,
|
||||
<em> Peacock Journal</em>, <em>Hospital Drive</em> (UVA School of Medicine),
|
||||
<em> The Main Street Rag</em>, <em>Soundings Review</em>, <em>Haunted Waters Press</em>,
|
||||
and <em>Snapdragon Journal</em>.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Third photo */}
|
||||
<div className="my-12 flex justify-center">
|
||||
<div className="w-64 md:w-72 aspect-square relative rounded-sm overflow-hidden">
|
||||
<Image
|
||||
src="/images/cynthia/cynthia-headshot.jpeg"
|
||||
alt="Cynthia Trenshaw — author photo"
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="(max-width: 768px) 256px, 288px"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="prose prose-stone prose-lg">
|
||||
<h2 className="font-serif text-2xl text-stone-800">What Others Said</h2>
|
||||
|
||||
<blockquote className="border-l-2 border-stone-300 pl-6 italic text-stone-600 my-8">
|
||||
<p>
|
||||
“Trenshaw writes with the hard-won wisdom of one who has sat at the bedsides
|
||||
of the dying and found there, not despair, but a fierce and luminous grace.”
|
||||
</p>
|
||||
<footer className="text-stone-500 not-italic text-sm mt-2">
|
||||
— Tod Marshall, Washington State Poet Laureate
|
||||
</footer>
|
||||
</blockquote>
|
||||
|
||||
<blockquote className="border-l-2 border-stone-300 pl-6 italic text-stone-600 my-8">
|
||||
<p>
|
||||
“In Cynthia's hands, even the smallest gesture — a tulip on a windowsill,
|
||||
a raven's offering — becomes a threshold between worlds.”
|
||||
</p>
|
||||
<footer className="text-stone-500 not-italic text-sm mt-2">
|
||||
— Kristin Brace
|
||||
</footer>
|
||||
</blockquote>
|
||||
|
||||
<h2 className="font-serif text-2xl text-stone-800">Final Years</h2>
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
Cynthia passed away on February 19, 2024, at the age of eighty-one. She is survived
|
||||
by her daughter Katheryn Trenshaw of Totnes, England; her son Michael and
|
||||
daughter-in-law Kay of Grand Rapids, Michigan; and her grandchildren Anna, Joseph,
|
||||
Jessica, and Orion.
|
||||
</p>
|
||||
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
Her poetry continues to offer solace and wisdom to those navigating life's most
|
||||
tender passages.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* Back link */}
|
||||
<div className="mt-16 pt-8 border-t border-stone-100 text-center">
|
||||
<Link
|
||||
href="/#contents"
|
||||
className="text-sm text-stone-600 hover:text-stone-800 transition-colors underline underline-offset-4 hover:no-underline"
|
||||
>
|
||||
Return to Contents
|
||||
</Link>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
|
@ -2,29 +2,16 @@ import Link from 'next/link';
|
|||
import type { Metadata } from 'next';
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: 'When A Friend Dies',
|
||||
title: 'Afterword: When A Friend Dies',
|
||||
description: 'An essay by Cynthia Trenshaw about grief and the loss of a friend, written for Leo E. Baldwin.',
|
||||
};
|
||||
|
||||
export default function WhenAFriendDiesPage() {
|
||||
return (
|
||||
<div className="min-h-screen bg-white">
|
||||
{/* Back link */}
|
||||
<div className="mx-auto max-w-3xl px-6 pt-8">
|
||||
<Link
|
||||
href="/"
|
||||
className="inline-flex items-center gap-2 text-sm text-stone-500 hover:text-stone-800 transition-colors"
|
||||
>
|
||||
<svg className="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
Back to Home
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
{/* Essay header */}
|
||||
{/* Header */}
|
||||
<header className="mx-auto max-w-3xl px-6 pt-12 pb-8 text-center border-b border-stone-100">
|
||||
<p className="text-xs uppercase tracking-[0.3em] text-stone-400 mb-4">Essay</p>
|
||||
<p className="text-xs uppercase tracking-[0.3em] text-stone-400 mb-4">Afterword</p>
|
||||
<h1 className="font-serif text-4xl md:text-5xl text-stone-800">When A Friend Dies</h1>
|
||||
<p className="mt-4 text-stone-500 italic">For Leo E. Baldwin</p>
|
||||
<p className="mt-4 text-stone-600">by Cynthia Trenshaw</p>
|
||||
|
|
@ -114,14 +101,16 @@ export default function WhenAFriendDiesPage() {
|
|||
</div>
|
||||
</article>
|
||||
|
||||
{/* Footer */}
|
||||
{/* Navigation */}
|
||||
<footer className="mx-auto max-w-3xl px-6 pb-16">
|
||||
<div className="pt-8 border-t border-stone-100 text-center">
|
||||
<Link
|
||||
href="/#poems"
|
||||
className="text-sm text-stone-600 hover:text-stone-800 underline underline-offset-4 hover:no-underline"
|
||||
>
|
||||
Read more of Cynthia's poetry
|
||||
<div className="poem-nav">
|
||||
<Link href="/poems/yellow-tulip">
|
||||
<span className="nav-label">Previous poem</span>
|
||||
<span className="nav-title">Yellow Tulip</span>
|
||||
</Link>
|
||||
<Link href="/#contents" className="nav-next">
|
||||
<span className="nav-label">Return to</span>
|
||||
<span className="nav-title">Contents</span>
|
||||
</Link>
|
||||
</div>
|
||||
</footer>
|
||||
|
|
|
|||
|
|
@ -59,52 +59,112 @@ img {
|
|||
background: #999;
|
||||
}
|
||||
|
||||
/* Link styles */
|
||||
a {
|
||||
/* Link styles for navigation only */
|
||||
nav a {
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
nav a:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
/* Button base */
|
||||
.btn {
|
||||
display: inline-flex;
|
||||
/* Book-page constraint for poem and TOC content */
|
||||
.book-page {
|
||||
max-width: 36rem; /* ~576px for book-page feel */
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
/* Section numbers in small-caps */
|
||||
.section-number {
|
||||
font-variant: small-caps;
|
||||
letter-spacing: 0.1em;
|
||||
}
|
||||
|
||||
/* Decorative separator — thin rule with fleuron */
|
||||
.separator {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0.75rem 1.5rem;
|
||||
font-size: 0.875rem;
|
||||
font-weight: 500;
|
||||
letter-spacing: 0.05em;
|
||||
gap: 1rem;
|
||||
color: #a8a29e; /* stone-400 */
|
||||
}
|
||||
|
||||
.separator::before,
|
||||
.separator::after {
|
||||
content: '';
|
||||
flex: 1;
|
||||
height: 1px;
|
||||
background: #d6d3d1; /* stone-300 */
|
||||
}
|
||||
|
||||
.separator-simple {
|
||||
border: none;
|
||||
height: 1px;
|
||||
background: #e7e5e4; /* stone-200 */
|
||||
margin: 2rem 0;
|
||||
}
|
||||
|
||||
/* Poem content formatting */
|
||||
.poem-content {
|
||||
white-space: pre-line;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
/* TOC styles */
|
||||
.toc-entry {
|
||||
display: block;
|
||||
padding: 0.375rem 0;
|
||||
color: #57534e; /* stone-600 */
|
||||
text-decoration: none;
|
||||
transition: color 0.15s ease;
|
||||
font-family: var(--font-serif);
|
||||
}
|
||||
|
||||
.toc-entry:hover {
|
||||
color: #1c1917; /* stone-900 */
|
||||
}
|
||||
|
||||
/* Sequential poem navigation */
|
||||
.poem-nav {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: flex-start;
|
||||
gap: 1rem;
|
||||
padding-top: 2rem;
|
||||
border-top: 1px solid #e7e5e4;
|
||||
}
|
||||
|
||||
.poem-nav a {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.25rem;
|
||||
text-decoration: none;
|
||||
color: #78716c; /* stone-500 */
|
||||
transition: color 0.15s ease;
|
||||
max-width: 45%;
|
||||
}
|
||||
|
||||
.poem-nav a:hover {
|
||||
color: #1c1917;
|
||||
}
|
||||
|
||||
.poem-nav .nav-label {
|
||||
font-size: 0.75rem;
|
||||
text-transform: uppercase;
|
||||
transition: all 0.2s ease;
|
||||
border: 1px solid transparent;
|
||||
letter-spacing: 0.1em;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: var(--foreground);
|
||||
color: var(--background);
|
||||
border-color: var(--foreground);
|
||||
.poem-nav .nav-title {
|
||||
font-family: var(--font-serif);
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background: transparent;
|
||||
color: var(--foreground);
|
||||
.poem-nav .nav-next {
|
||||
text-align: right;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: transparent;
|
||||
color: var(--foreground);
|
||||
border-color: var(--foreground);
|
||||
}
|
||||
|
||||
.btn-secondary:hover {
|
||||
background: var(--foreground);
|
||||
color: var(--background);
|
||||
}
|
||||
|
||||
/* Prose styles for CMS content */
|
||||
/* Prose styles for essay/bio content */
|
||||
.prose {
|
||||
max-width: 65ch;
|
||||
}
|
||||
|
|
@ -140,19 +200,6 @@ a:hover {
|
|||
text-underline-offset: 2px;
|
||||
}
|
||||
|
||||
/* Image hover zoom effect */
|
||||
.img-zoom {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.img-zoom img {
|
||||
transition: transform 0.5s ease;
|
||||
}
|
||||
|
||||
.img-zoom:hover img {
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
/* Fade in animation */
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
|
|
@ -168,16 +215,3 @@ a:hover {
|
|||
.animate-fade-in {
|
||||
animation: fadeIn 0.5s ease forwards;
|
||||
}
|
||||
|
||||
/* Sold badge */
|
||||
.badge-sold {
|
||||
position: absolute;
|
||||
top: 1rem;
|
||||
right: 1rem;
|
||||
background: rgba(0, 0, 0, 0.8);
|
||||
color: white;
|
||||
padding: 0.25rem 0.75rem;
|
||||
font-size: 0.75rem;
|
||||
letter-spacing: 0.1em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -18,16 +18,16 @@ const inter = Inter({
|
|||
|
||||
export const metadata: Metadata = {
|
||||
title: {
|
||||
default: "Cynthia Trenshaw | Poet (1942-2024)",
|
||||
default: "Cynthia Trenshaw | Poet (1942–2024)",
|
||||
template: "%s | Cynthia Trenshaw",
|
||||
},
|
||||
description: "Memorial poetry site for Cynthia Trenshaw (1942-2024), poet, hospital chaplain, and author of Mortal Beings.",
|
||||
keywords: ["poetry", "Cynthia Trenshaw", "Mortal Beings", "memorial", "chaplain", "poet"],
|
||||
description: "The collected poems of Cynthia Trenshaw (1942–2024), poet, hospital chaplain, and author of Meeting in the Margins and Mortal Beings.",
|
||||
keywords: ["poetry", "Cynthia Trenshaw", "Mortal Beings", "Meeting in the Margins", "memorial", "chaplain", "poet"],
|
||||
authors: [{ name: "Cynthia Trenshaw" }],
|
||||
openGraph: {
|
||||
type: "website",
|
||||
locale: "en_US",
|
||||
siteName: "Cynthia Trenshaw Poetry",
|
||||
siteName: "Cynthia Trenshaw — Collected Poems",
|
||||
},
|
||||
};
|
||||
|
||||
|
|
@ -39,7 +39,7 @@ export default function RootLayout({
|
|||
return (
|
||||
<html lang="en" className={`${cormorant.variable} ${inter.variable}`}>
|
||||
<body className="flex min-h-screen flex-col bg-white antialiased font-sans">
|
||||
{/* Simple Navigation */}
|
||||
{/* Navigation */}
|
||||
<header className="fixed top-0 left-0 right-0 z-50 bg-white/95 backdrop-blur-sm border-b border-stone-100">
|
||||
<nav className="mx-auto max-w-5xl px-6 py-4">
|
||||
<div className="flex items-center justify-between">
|
||||
|
|
@ -47,20 +47,15 @@ export default function RootLayout({
|
|||
Cynthia Trenshaw
|
||||
</Link>
|
||||
<div className="flex items-center gap-6 text-sm">
|
||||
<Link href="/#poems" className="text-stone-600 hover:text-stone-800 transition-colors">
|
||||
Poems
|
||||
<Link href="/#contents" className="text-stone-600 hover:text-stone-800 transition-colors">
|
||||
Contents
|
||||
</Link>
|
||||
<Link href="/#publications" className="text-stone-600 hover:text-stone-800 transition-colors">
|
||||
Publications
|
||||
<Link href="/about" className="text-stone-600 hover:text-stone-800 transition-colors">
|
||||
About
|
||||
</Link>
|
||||
<Link href="/#books" className="text-stone-600 hover:text-stone-800 transition-colors">
|
||||
Books
|
||||
</Link>
|
||||
<a
|
||||
href="https://www.amazon.com/Mortal-Beings-Cynthia-Trenshaw/dp/1635349184/ref=sr_1_3"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-stone-600 hover:text-stone-800 transition-colors"
|
||||
>
|
||||
Book
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -1,245 +1,134 @@
|
|||
import Link from 'next/link';
|
||||
import Image from 'next/image';
|
||||
import { sections, books, getPoemsForSection } from '@/data/poems';
|
||||
|
||||
export default function HomePage() {
|
||||
const poems = [
|
||||
{
|
||||
title: 'The Skier and the Jay',
|
||||
slug: 'the-skier-and-the-jay',
|
||||
publication: 'Sky Island Journal, Issue 25, Summer 2023',
|
||||
excerpt: 'This is the day of blue distances...',
|
||||
},
|
||||
{
|
||||
title: 'A Psalm of Deathing',
|
||||
slug: 'a-psalm-of-deathing',
|
||||
publication: 'Allman Prize Entry',
|
||||
excerpt: 'A caregiver\'s exegesis on Psalm 139...',
|
||||
},
|
||||
{
|
||||
title: 'Beggar at Rush Hour',
|
||||
slug: 'beggar-at-rush-hour',
|
||||
publication: 'Allman Prize Entry',
|
||||
excerpt: 'You may have heard of such things...',
|
||||
},
|
||||
{
|
||||
title: 'Yellow Tulip',
|
||||
slug: 'yellow-tulip',
|
||||
publication: 'Allman Prize Entry',
|
||||
excerpt: 'Just one yellow tulip stands in the small vase...',
|
||||
},
|
||||
{
|
||||
title: 'Escape',
|
||||
slug: 'escape',
|
||||
publication: 'Three Grandparent Poems',
|
||||
excerpt: 'While the grownups napped and dreamed...',
|
||||
},
|
||||
{
|
||||
title: 'Grandma Delilah and Her Lord Go for a Sunday Drive',
|
||||
slug: 'grandma-delilah',
|
||||
publication: 'Three Grandparent Poems',
|
||||
excerpt: 'But I must not stay in my own story too long...',
|
||||
},
|
||||
{
|
||||
title: 'Grandfather Disappears',
|
||||
slug: 'grandfather-disappears',
|
||||
publication: 'Three Grandparent Poems',
|
||||
excerpt: 'Grandfather has been lost to memory...',
|
||||
},
|
||||
{
|
||||
title: 'Morning Prayer',
|
||||
slug: 'morning-prayer',
|
||||
publication: 'Unpublished',
|
||||
excerpt: 'I wake into a new day...',
|
||||
},
|
||||
];
|
||||
|
||||
const publications = [
|
||||
{
|
||||
title: 'Mortal Beings',
|
||||
description: 'Poetry collection published by Finishing Line Press, 2019',
|
||||
link: 'https://www.amazon.com/Mortal-Beings-Cynthia-Trenshaw/dp/1635349184/ref=sr_1_3',
|
||||
},
|
||||
{
|
||||
title: 'The Skier and the Jay',
|
||||
description: 'Sky Island Journal, Issue 25, Summer 2023',
|
||||
link: 'https://www.skyislandjournal.com/',
|
||||
},
|
||||
{
|
||||
title: 'New Poetry: Cynthia Trenshaw',
|
||||
description: 'Peacock Journal',
|
||||
link: 'https://www.peacockjournal.com/cynthia-trenshaw.html',
|
||||
},
|
||||
{
|
||||
title: 'Haunted Waters Press',
|
||||
description: 'Various publications',
|
||||
link: 'https://www.hauntedwaterspress.com/',
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-white">
|
||||
{/* Hero Section */}
|
||||
{/* Title Page Hero */}
|
||||
<section className="relative py-24 md:py-32 bg-gradient-to-b from-stone-50 to-white">
|
||||
<div className="mx-auto max-w-4xl px-6 text-center">
|
||||
<h1 className="font-serif text-5xl md:text-6xl lg:text-7xl text-stone-800 tracking-tight">
|
||||
Cynthia Trenshaw
|
||||
</h1>
|
||||
<p className="mt-4 text-xl md:text-2xl text-stone-500 font-light">
|
||||
1942 — 2024
|
||||
1942 — 2024
|
||||
</p>
|
||||
<p className="mt-8 text-lg md:text-xl text-stone-600 font-serif italic max-w-2xl mx-auto leading-relaxed">
|
||||
"Guardian and midwife to the dying, a poet who bore witness to life's thresholds"
|
||||
“Guardian and midwife to the dying, a poet who bore witness
|
||||
to life's thresholds”
|
||||
</p>
|
||||
<p className="mt-6 text-sm text-stone-400">
|
||||
<Link href="/about" className="underline underline-offset-4 hover:text-stone-600 transition-colors">
|
||||
About Cynthia
|
||||
</Link>
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Bio Section */}
|
||||
<section className="py-20 bg-white">
|
||||
<div className="mx-auto max-w-3xl px-6">
|
||||
<div className="prose prose-stone prose-lg mx-auto">
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
Cynthia Trenshaw (1942–2024) was an American poet, hospital chaplain, and author.
|
||||
A graduate of Whitworth College (BA) and San Francisco Theological Seminary (MDiv),
|
||||
she served as a spiritual companion to the dying and their families for over three decades.
|
||||
</p>
|
||||
<p className="text-stone-600 leading-relaxed mt-6">
|
||||
Her poetry collection <em>Mortal Beings</em> was published by Finishing Line Press in 2019.
|
||||
Her work appeared in numerous journals including Sky Island Journal, Peacock Journal,
|
||||
and Haunted Waters Press. She was the mother of artist Katheryn Trenshaw.
|
||||
</p>
|
||||
<p className="text-stone-600 leading-relaxed mt-6">
|
||||
Cynthia passed away on February 19, 2024. Her poetry continues to offer solace and
|
||||
wisdom to those navigating life's most tender passages.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Featured Book Section */}
|
||||
<section className="py-20 bg-stone-50">
|
||||
<div className="mx-auto max-w-5xl px-6">
|
||||
<div className="grid md:grid-cols-2 gap-12 items-center">
|
||||
<div className="aspect-[3/4] bg-stone-200 rounded-sm overflow-hidden relative">
|
||||
<Image
|
||||
src="/images/mortal-beings-cover.jpg"
|
||||
alt="Mortal Beings by Cynthia Trenshaw - book cover"
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="(max-width: 768px) 100vw, 50vw"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-xs uppercase tracking-[0.3em] text-stone-400 mb-4">Poetry Collection</p>
|
||||
<h2 className="font-serif text-4xl text-stone-800">Mortal Beings</h2>
|
||||
<p className="mt-6 text-stone-600 leading-relaxed">
|
||||
A meditation on mortality, memory, and the sacred art of accompaniment.
|
||||
Drawing from her decades as a hospital chaplain, Cynthia's debut collection
|
||||
explores the threshold moments that define our humanity.
|
||||
</p>
|
||||
<a
|
||||
href="https://www.amazon.com/Mortal-Beings-Cynthia-Trenshaw/dp/1635349184/ref=sr_1_3"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="mt-8 inline-block px-8 py-4 bg-stone-800 text-white text-sm uppercase tracking-wider hover:bg-stone-700 transition-colors"
|
||||
>
|
||||
View on Amazon
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Poems Section */}
|
||||
<section className="py-20 bg-white" id="poems">
|
||||
<div className="mx-auto max-w-4xl px-6">
|
||||
{/* Table of Contents */}
|
||||
<section className="py-20 bg-white" id="contents">
|
||||
<div className="book-page px-6">
|
||||
<div className="text-center mb-16">
|
||||
<p className="text-xs uppercase tracking-[0.3em] text-stone-400 mb-4">Selected Works</p>
|
||||
<h2 className="font-serif text-4xl text-stone-800">Poetry</h2>
|
||||
<p className="mt-4 text-stone-500">
|
||||
A collection of poems preserved for family and those who loved her words
|
||||
<p className="text-xs uppercase tracking-[0.3em] text-stone-400 mb-4">Collected Poems</p>
|
||||
<h2 className="font-serif text-3xl text-stone-800">Contents</h2>
|
||||
</div>
|
||||
|
||||
{sections.map((section) => {
|
||||
const sectionPoems = getPoemsForSection(section.id);
|
||||
return (
|
||||
<div key={section.id} className="mb-12">
|
||||
{/* Section heading */}
|
||||
<div className="text-center mb-6">
|
||||
<p className="section-number text-sm text-stone-400 mb-1">
|
||||
Section {section.number}
|
||||
</p>
|
||||
<h3 className="font-serif text-xl text-stone-700">
|
||||
{section.title}
|
||||
</h3>
|
||||
<p className="text-sm text-stone-400 italic mt-1">
|
||||
{section.subtitle}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="space-y-1">
|
||||
{poems.map((poem, index) => (
|
||||
{/* Poem links */}
|
||||
<div className="space-y-0">
|
||||
{sectionPoems.map((poem) => (
|
||||
<Link
|
||||
key={poem.slug}
|
||||
href={`/poems/${poem.slug}`}
|
||||
className="block group py-6 border-b border-stone-100 hover:bg-stone-50 transition-colors px-4 -mx-4"
|
||||
className="toc-entry"
|
||||
>
|
||||
<div className="flex justify-between items-start gap-4">
|
||||
<div>
|
||||
<h3 className="font-serif text-xl text-stone-800 group-hover:text-stone-600 transition-colors">
|
||||
{poem.title}
|
||||
</h3>
|
||||
<p className="mt-1 text-sm text-stone-400">{poem.publication}</p>
|
||||
</div>
|
||||
<svg
|
||||
className="w-5 h-5 text-stone-300 group-hover:text-stone-500 transition-colors flex-shrink-0 mt-1"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M9 5l7 7-7 7" />
|
||||
</svg>
|
||||
</div>
|
||||
</Link>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Publications Section */}
|
||||
<section className="py-20 bg-stone-50" id="publications">
|
||||
<div className="mx-auto max-w-4xl px-6">
|
||||
<div className="text-center mb-16">
|
||||
<p className="text-xs uppercase tracking-[0.3em] text-stone-400 mb-4">External</p>
|
||||
<h2 className="font-serif text-4xl text-stone-800">Publications</h2>
|
||||
{section.id < sections.length && (
|
||||
<div className="separator my-10">
|
||||
<span className="text-stone-300">•</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-6">
|
||||
{publications.map((pub) => (
|
||||
<a
|
||||
key={pub.title}
|
||||
href={pub.link}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="block p-6 bg-white border border-stone-200 hover:border-stone-400 transition-colors group"
|
||||
>
|
||||
<h3 className="font-serif text-lg text-stone-800 group-hover:text-stone-600 transition-colors">
|
||||
{pub.title}
|
||||
</h3>
|
||||
<p className="mt-2 text-sm text-stone-500">{pub.description}</p>
|
||||
<p className="mt-4 text-xs text-stone-400 uppercase tracking-wider group-hover:text-stone-600 transition-colors">
|
||||
Visit →
|
||||
</p>
|
||||
</a>
|
||||
))}
|
||||
{/* Afterword */}
|
||||
<div className="text-center mt-10 mb-6">
|
||||
<div className="separator mb-6">
|
||||
<span className="text-stone-300">•</span>
|
||||
</div>
|
||||
<p className="section-number text-sm text-stone-400 mb-1">Afterword</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Essay Section */}
|
||||
<section className="py-20 bg-white">
|
||||
<div className="mx-auto max-w-3xl px-6">
|
||||
<div className="text-center mb-12">
|
||||
<p className="text-xs uppercase tracking-[0.3em] text-stone-400 mb-4">Essay</p>
|
||||
<h2 className="font-serif text-4xl text-stone-800">When A Friend Dies</h2>
|
||||
<p className="mt-4 text-stone-500 italic">For Leo E. Baldwin</p>
|
||||
</div>
|
||||
<div className="prose prose-stone prose-lg mx-auto">
|
||||
<p className="text-stone-600 leading-relaxed">
|
||||
"When a friend dies, we're startled by our own feelings. Despite all the preparation,
|
||||
the long illness, the frequent visits, and the exhaustion of watching death take its
|
||||
time, we're unprepared for the loss..."
|
||||
</p>
|
||||
<Link
|
||||
href="/essays/when-a-friend-dies"
|
||||
className="mt-8 inline-block text-stone-800 underline underline-offset-4 hover:no-underline"
|
||||
className="toc-entry"
|
||||
>
|
||||
Read the full essay
|
||||
When A Friend Dies
|
||||
</Link>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Books Section */}
|
||||
<section className="py-20 bg-stone-50" id="books">
|
||||
<div className="mx-auto max-w-5xl px-6">
|
||||
<div className="text-center mb-16">
|
||||
<p className="text-xs uppercase tracking-[0.3em] text-stone-400 mb-4">Published Works</p>
|
||||
<h2 className="font-serif text-3xl text-stone-800">Books</h2>
|
||||
</div>
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-12">
|
||||
{books.map((book) => (
|
||||
<div key={book.title} className="flex flex-col items-center text-center">
|
||||
<div className="w-48 md:w-56 aspect-[3/4] bg-stone-200 rounded-sm overflow-hidden relative mb-6">
|
||||
<Image
|
||||
src={book.coverImage}
|
||||
alt={`${book.title} by ${book.author} — book cover`}
|
||||
fill
|
||||
className="object-cover"
|
||||
sizes="(max-width: 768px) 192px, 224px"
|
||||
/>
|
||||
</div>
|
||||
<h3 className="font-serif text-xl text-stone-800">{book.title}</h3>
|
||||
<p className="text-sm text-stone-400 mt-1">
|
||||
{book.publisher}, {book.year}
|
||||
</p>
|
||||
<p className="mt-3 text-stone-600 text-sm max-w-xs">
|
||||
{book.description}
|
||||
</p>
|
||||
{book.amazonUrl && (
|
||||
<a
|
||||
href={book.amazonUrl}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="mt-4 text-xs text-stone-500 uppercase tracking-wider hover:text-stone-800 transition-colors underline underline-offset-4"
|
||||
>
|
||||
View on Amazon
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
|
@ -250,7 +139,7 @@ export default function HomePage() {
|
|||
<p className="mt-4 text-stone-400">
|
||||
Cynthia Trenshaw
|
||||
<br />
|
||||
1942 — 2024
|
||||
1942 — 2024
|
||||
</p>
|
||||
<p className="mt-8 text-stone-500 text-sm">
|
||||
This memorial site was created by her family to preserve her poetry
|
||||
|
|
|
|||
|
|
@ -1,331 +1,23 @@
|
|||
import Link from 'next/link';
|
||||
import { notFound } from 'next/navigation';
|
||||
|
||||
// Poem content database
|
||||
const poems: Record<string, {
|
||||
title: string;
|
||||
publication?: string;
|
||||
dedication?: string;
|
||||
content: string;
|
||||
}> = {
|
||||
'the-skier-and-the-jay': {
|
||||
title: 'The Skier and the Jay',
|
||||
publication: 'Sky Island Journal, Issue 25, Summer 2023',
|
||||
content: `This is the day of blue distances,
|
||||
of sunlight glancing off the distant trees
|
||||
and dazzling the eyes with snow-shine.
|
||||
|
||||
This is the day a gray jay,
|
||||
bold and hopeful, lands on my shoulder
|
||||
while I rest on the trail.
|
||||
|
||||
I hold out a crumb of granola bar,
|
||||
and she takes it from my fingers,
|
||||
a small gray thief, a winter companion.
|
||||
|
||||
For a moment we are both wild things,
|
||||
the jay and I, alive in this white world,
|
||||
sharing what little we have.
|
||||
|
||||
Then she lifts into the pines,
|
||||
and I push off again, gliding
|
||||
through the blue distances of the day.`
|
||||
},
|
||||
'a-psalm-of-deathing': {
|
||||
title: 'A Psalm of Deathing',
|
||||
publication: 'Allman Prize Entry',
|
||||
dedication: 'A caregiver\'s exegesis on Psalm 139',
|
||||
content: `O Lord, you have searched me and known me.
|
||||
You know when I sit down and when I rise up;
|
||||
you discern my thoughts from far away.
|
||||
|
||||
In this room of monitors and morphine,
|
||||
I search for you in the measured breath,
|
||||
the shallow rise, the reluctant fall.
|
||||
|
||||
Where can I go from your spirit?
|
||||
Where can I flee from your presence?
|
||||
If I make my bed in Sheol, you are there.
|
||||
|
||||
The darkness is not dark to you;
|
||||
the night is as bright as the day,
|
||||
for darkness is as light to you.
|
||||
|
||||
I praise you, for we are fearfully
|
||||
and wonderfully made.
|
||||
Wonderful are your works—
|
||||
|
||||
this body that held a life,
|
||||
these hands that blessed and bathed,
|
||||
this heart that is learning to let go.
|
||||
|
||||
My frame was not hidden from you,
|
||||
when I was being made in secret,
|
||||
intricately woven in the depths of the earth.
|
||||
|
||||
Now the weaving comes undone,
|
||||
thread by thread, breath by breath,
|
||||
returning to the mystery.
|
||||
|
||||
Your eyes beheld my unformed substance.
|
||||
In your book were written
|
||||
all the days that were formed for me.
|
||||
|
||||
And here at the end of days,
|
||||
I hold her hand and whisper:
|
||||
You are known. You are held.
|
||||
|
||||
How weighty to me are your thoughts, O God!
|
||||
How vast is the sum of them!
|
||||
I try to count them—they are more than the sand.
|
||||
|
||||
More than the grains of morphine
|
||||
dissolving under tongue,
|
||||
more than the tears I cannot count.
|
||||
|
||||
Search me, O God, and know my heart;
|
||||
test me and know my thoughts.
|
||||
See if there is any wicked way in me.
|
||||
|
||||
See if there is any fear,
|
||||
any clinging, any refusal
|
||||
to let this beloved one go.
|
||||
|
||||
And lead me in the way everlasting.
|
||||
Lead her in the way everlasting.
|
||||
Lead us both home.`
|
||||
},
|
||||
'beggar-at-rush-hour': {
|
||||
title: 'Beggar at Rush Hour',
|
||||
publication: 'Allman Prize Entry',
|
||||
content: `You may have heard of such things—
|
||||
the doctor's words falling like stones
|
||||
into the still pool of an ordinary day.
|
||||
|
||||
I was driving home at rush hour
|
||||
when the call came,
|
||||
the diagnosis a beggar at my window.
|
||||
|
||||
I gave it nothing. I had nothing to give.
|
||||
I drove on through the green lights,
|
||||
the red lights, the turning lane.
|
||||
|
||||
At home I sat in the driveway
|
||||
long after the engine stopped,
|
||||
listening to the tick of cooling metal.
|
||||
|
||||
The beggar stood at my window still,
|
||||
patient as any streetcorner saint,
|
||||
asking for what I could not give:
|
||||
|
||||
attention to this new world,
|
||||
acknowledgment of this stranger life,
|
||||
coins for the ferryman's palm.
|
||||
|
||||
Eventually I got out of the car.
|
||||
Eventually I walked to the door.
|
||||
Eventually I learned to look the beggar in the eye
|
||||
|
||||
and say: Yes, I see you.
|
||||
Yes, I know you will not leave.
|
||||
Yes, you may ride with me now.`
|
||||
},
|
||||
'yellow-tulip': {
|
||||
title: 'Yellow Tulip',
|
||||
publication: 'Allman Prize Entry',
|
||||
content: `Just one yellow tulip stands in the small vase
|
||||
on the windowsill of this hospice room.
|
||||
Someone brought it—I don't remember who.
|
||||
|
||||
It has been here for days now,
|
||||
longer than the doctors said,
|
||||
outlasting their predictions.
|
||||
|
||||
Each morning I check: still here.
|
||||
Still yellow. Still reaching
|
||||
toward the gray February light.
|
||||
|
||||
The petals have begun to thin,
|
||||
translucent as the skin
|
||||
of the hand I hold each afternoon.
|
||||
|
||||
We are both watching the tulip now,
|
||||
my mother and I, neither speaking,
|
||||
both knowing what it means.
|
||||
|
||||
When it finally drops its petals—
|
||||
six small yellow prayers
|
||||
released onto the windowsill—
|
||||
|
||||
she closes her eyes and smiles.
|
||||
"There," she says. "Now I can go."
|
||||
As if she had been waiting for permission.
|
||||
|
||||
As if the flower had been holding her here,
|
||||
its yellow persistence saying: not yet,
|
||||
not yet, not yet, and finally: yes.`
|
||||
},
|
||||
'escape': {
|
||||
title: 'Escape',
|
||||
publication: 'Three Grandparent Poems',
|
||||
content: `While the grownups napped and dreamed
|
||||
their Sunday dreams of rest and silence,
|
||||
I slipped out the back door
|
||||
|
||||
into the Indiana afternoon,
|
||||
past the garden and the chicken coop,
|
||||
toward the back forty and beyond.
|
||||
|
||||
In the cornfield I was invisible,
|
||||
the stalks twice my height,
|
||||
leaves like green swords brushing my arms.
|
||||
|
||||
I walked the rows as if they were streets
|
||||
in some great city I would someday find,
|
||||
some place where I would belong.
|
||||
|
||||
At the field's edge, woods began—
|
||||
a tangle of vines and fallen logs,
|
||||
of mushrooms and mysteries.
|
||||
|
||||
I had no destination. That was the point.
|
||||
I had only the afternoon and my own two feet
|
||||
and the knowledge that no one knew where I was.
|
||||
|
||||
That was freedom: not the absence of rules
|
||||
but the presence of space,
|
||||
room enough to become someone.
|
||||
|
||||
By suppertime I would return,
|
||||
my shoes muddy, my heart full,
|
||||
my secret intact.
|
||||
|
||||
The grownups never asked where I had been.
|
||||
Perhaps they knew. Perhaps they too
|
||||
had once escaped into a summer afternoon
|
||||
|
||||
and remembered that particular sweetness:
|
||||
how good it felt to be lost,
|
||||
how necessary to find your own way home.`
|
||||
},
|
||||
'grandma-delilah': {
|
||||
title: 'Grandma Delilah and Her Lord Go for a Sunday Drive',
|
||||
publication: 'Three Grandparent Poems',
|
||||
content: `But I must not stay in my own story too long.
|
||||
This is about Grandma Delilah,
|
||||
who died the way she lived: in conversation.
|
||||
|
||||
Every Sunday after church
|
||||
she would take a drive in her blue Pontiac,
|
||||
talking to the Lord as she went.
|
||||
|
||||
Out past the edge of town,
|
||||
past the last gas station and the feed store,
|
||||
into the rolling hills of corn and soy.
|
||||
|
||||
"Lord," she would say, "look at that sky.
|
||||
You outdid yourself today."
|
||||
And she would drive a little farther.
|
||||
|
||||
"Lord, I'm worried about Marvin's back.
|
||||
You know how he works too hard.
|
||||
Maybe you could ease up on him a little."
|
||||
|
||||
The corn responded to her passing,
|
||||
rustling like a congregation
|
||||
settling in for the sermon.
|
||||
|
||||
On the day she died, they found her
|
||||
pulled over on a country road,
|
||||
her hands still on the wheel, her eyes open.
|
||||
|
||||
Looking, I imagine, at something beautiful.
|
||||
Perhaps the Lord had finally said:
|
||||
"Delilah, look at THIS sky.
|
||||
|
||||
I outdid myself today.
|
||||
Why don't you come see it closer?"
|
||||
And she had said yes, as she always did.
|
||||
|
||||
The engine was still running.
|
||||
The radio was playing hymns.
|
||||
The corn in the fields stood at attention.`
|
||||
},
|
||||
'grandfather-disappears': {
|
||||
title: 'Grandfather Disappears',
|
||||
publication: 'Three Grandparent Poems',
|
||||
content: `Grandfather has been lost to memory
|
||||
for three years now, a boat
|
||||
slipped from its mooring.
|
||||
|
||||
He drifts in the nursing home,
|
||||
asking the same questions,
|
||||
telling the same stories.
|
||||
|
||||
Each visit I watch him search
|
||||
for my name, my face, the word
|
||||
that means what I am to him.
|
||||
|
||||
Sometimes it surfaces—"Granddaughter!"—
|
||||
and his whole face lights up
|
||||
with the joy of recognition.
|
||||
|
||||
But more often now the word won't come.
|
||||
He holds my hand and pats it,
|
||||
saying, "Good, good. So good."
|
||||
|
||||
I have learned to be content with this.
|
||||
I have learned that love doesn't need a name,
|
||||
that presence needs no explanation.
|
||||
|
||||
Today I bring him photographs:
|
||||
his wedding day, my mother as a child,
|
||||
the house he built with his own hands.
|
||||
|
||||
He looks at them politely,
|
||||
as if they were pictures of strangers,
|
||||
someone else's beautiful life.
|
||||
|
||||
Then he turns to me and smiles.
|
||||
"I don't know who these people are," he says,
|
||||
"but I'm glad you came to visit."
|
||||
|
||||
And I think: this is what remains
|
||||
when memory goes—not facts, not names,
|
||||
but the simple pleasure of company.
|
||||
|
||||
The comfort of a hand to hold.
|
||||
The knowledge, deeper than words,
|
||||
that someone loves you.
|
||||
|
||||
He has forgotten everything
|
||||
except how to be kind.
|
||||
Maybe that is enough. Maybe that is everything.`
|
||||
},
|
||||
'morning-prayer': {
|
||||
title: 'Morning Prayer',
|
||||
publication: 'Unpublished',
|
||||
content: `I wake into a new day,
|
||||
surprised again to find myself here,
|
||||
still breathing, still curious.
|
||||
|
||||
Lord, I have no idea what you're doing,
|
||||
but I trust it's something interesting.
|
||||
Count me in.`
|
||||
},
|
||||
};
|
||||
import {
|
||||
getAllPoems,
|
||||
getPoemBySlug,
|
||||
getSectionById,
|
||||
getAdjacentPoems,
|
||||
} from '@/data/poems';
|
||||
|
||||
interface PageProps {
|
||||
params: Promise<{ slug: string }>;
|
||||
}
|
||||
|
||||
export async function generateStaticParams() {
|
||||
return Object.keys(poems).map((slug) => ({ slug }));
|
||||
return getAllPoems().map((poem) => ({ slug: poem.slug }));
|
||||
}
|
||||
|
||||
export async function generateMetadata({ params }: PageProps) {
|
||||
const { slug } = await params;
|
||||
const poem = poems[slug];
|
||||
const poem = getPoemBySlug(slug);
|
||||
|
||||
if (!poem) {
|
||||
return { title: 'Poem Not Found' };
|
||||
|
|
@ -333,36 +25,42 @@ export async function generateMetadata({ params }: PageProps) {
|
|||
|
||||
return {
|
||||
title: poem.title,
|
||||
description: `"${poem.title}" by Cynthia Trenshaw${poem.publication ? ` - ${poem.publication}` : ''}`,
|
||||
description: `"${poem.title}" by Cynthia Trenshaw${poem.publication ? ` — ${poem.publication}` : ''}`,
|
||||
};
|
||||
}
|
||||
|
||||
export default async function PoemPage({ params }: PageProps) {
|
||||
const { slug } = await params;
|
||||
const poem = poems[slug];
|
||||
const poem = getPoemBySlug(slug);
|
||||
|
||||
if (!poem) {
|
||||
notFound();
|
||||
}
|
||||
|
||||
const section = getSectionById(poem.sectionId);
|
||||
const { prev, next } = getAdjacentPoems(slug);
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-white">
|
||||
{/* Back link */}
|
||||
{/* Section breadcrumb */}
|
||||
<div className="mx-auto max-w-3xl px-6 pt-8">
|
||||
<Link
|
||||
href="/#poems"
|
||||
className="inline-flex items-center gap-2 text-sm text-stone-500 hover:text-stone-800 transition-colors"
|
||||
href="/#contents"
|
||||
className="inline-flex items-center gap-2 text-xs uppercase tracking-[0.15em] text-stone-400 hover:text-stone-600 transition-colors"
|
||||
>
|
||||
<svg className="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
Back to Poems
|
||||
{section && (
|
||||
<>
|
||||
Section {section.number} · {section.title}
|
||||
</>
|
||||
)}
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
{/* Poem header */}
|
||||
<header className="mx-auto max-w-3xl px-6 pt-12 pb-8 text-center border-b border-stone-100">
|
||||
<h1 className="font-serif text-4xl md:text-5xl text-stone-800">{poem.title}</h1>
|
||||
<header className="mx-auto max-w-3xl px-6 pt-8 pb-8 text-center border-b border-stone-100">
|
||||
<h1 className="font-serif text-4xl md:text-5xl text-stone-800">
|
||||
{poem.title}
|
||||
</h1>
|
||||
{poem.dedication && (
|
||||
<p className="mt-4 text-stone-500 italic">{poem.dedication}</p>
|
||||
)}
|
||||
|
|
@ -379,24 +77,36 @@ export default async function PoemPage({ params }: PageProps) {
|
|||
</div>
|
||||
</article>
|
||||
|
||||
{/* Navigation to other poems */}
|
||||
{/* Sequential navigation */}
|
||||
<footer className="mx-auto max-w-3xl px-6 pb-16">
|
||||
<div className="pt-8 border-t border-stone-100">
|
||||
<p className="text-sm text-stone-400 text-center mb-6">More poems by Cynthia Trenshaw</p>
|
||||
<div className="flex flex-wrap justify-center gap-3">
|
||||
{Object.entries(poems)
|
||||
.filter(([s]) => s !== slug)
|
||||
.slice(0, 4)
|
||||
.map(([s, p]) => (
|
||||
<Link
|
||||
key={s}
|
||||
href={`/poems/${s}`}
|
||||
className="text-sm text-stone-600 hover:text-stone-800 underline underline-offset-4 hover:no-underline"
|
||||
>
|
||||
{p.title}
|
||||
<div className="poem-nav">
|
||||
{prev ? (
|
||||
<Link href={`/poems/${prev.slug}`}>
|
||||
<span className="nav-label">Previous poem</span>
|
||||
<span className="nav-title">{prev.title}</span>
|
||||
</Link>
|
||||
))}
|
||||
) : (
|
||||
<div />
|
||||
)}
|
||||
{next ? (
|
||||
<Link href={`/poems/${next.slug}`} className="nav-next">
|
||||
<span className="nav-label">Next poem</span>
|
||||
<span className="nav-title">{next.title}</span>
|
||||
</Link>
|
||||
) : (
|
||||
<Link href="/essays/when-a-friend-dies" className="nav-next">
|
||||
<span className="nav-label">Afterword</span>
|
||||
<span className="nav-title">When A Friend Dies</span>
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
<div className="mt-8 text-center">
|
||||
<Link
|
||||
href="/#contents"
|
||||
className="text-sm text-stone-500 hover:text-stone-800 transition-colors underline underline-offset-4 hover:no-underline"
|
||||
>
|
||||
Return to Contents
|
||||
</Link>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue