mirror of
https://github.com/runyanjake/cooking.git
synced 2026-11-10 15:14:50 -08:00
6c92f2d896
The About page is hand-written JSX, so it never picked up the recipe styles, and its prose margins stacked with space-y and pt-6. Share the recipe tab body classes through MARKDOWN_BODY_CLASSES and use them on About, along with the recipe page header and column layout. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> Co-authored-by: multica-agent <github@multica.ai>
52 lines
1.8 KiB
TypeScript
52 lines
1.8 KiB
TypeScript
import type { Metadata } from 'next';
|
|
import { MARKDOWN_BODY_CLASSES } from '@/components/markdown-styles';
|
|
|
|
export const metadata: Metadata = {
|
|
title: 'About - PWS Recipes',
|
|
description: 'Learn more about the PWS recipe collection',
|
|
};
|
|
|
|
export default function AboutPage() {
|
|
return (
|
|
<article className="max-w-4xl mx-auto">
|
|
<header className="mb-8 space-y-4">
|
|
<h1 className="text-4xl md:text-5xl font-bold text-gray-900 dark:text-white">
|
|
About PWS Recipes
|
|
</h1>
|
|
<p className="text-xl text-gray-600 dark:text-gray-400">
|
|
Explore recipes in a user-friendly manner on a website that prioritizes your cooking experience over monetizing your clicks.
|
|
</p>
|
|
</header>
|
|
|
|
<div className={`space-y-8 ${MARKDOWN_BODY_CLASSES}
|
|
[&_h2]:text-2xl [&_h2]:font-bold [&_h2]:text-gray-900 dark:[&_h2]:text-white [&_h2]:mb-3
|
|
`}>
|
|
<section>
|
|
<h2>The PWS Mission</h2>
|
|
<p>
|
|
We believe that cooking should be accessible, enjoyable, and creative. Our goal while collecting and organizing these recipes is to make knowledge readily available and keep your cooking experience a cathartic and fun one.
|
|
</p>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>Content Structure</h2>
|
|
<p>
|
|
Each recipe is organized in its own folder with:
|
|
</p>
|
|
<ul>
|
|
<li>Markdown file with metadata frontmatter, recipe content, and instructions</li>
|
|
<li>Assets folder for images and other media</li>
|
|
</ul>
|
|
</section>
|
|
|
|
<section>
|
|
<h2>Technology</h2>
|
|
<p>
|
|
Built with modern web technologies including Next.js, React, TypeScript, and Tailwind CSS to ensure fast performance.
|
|
</p>
|
|
</section>
|
|
</div>
|
|
</article>
|
|
);
|
|
}
|