gbanyan/blog-nextjs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Narrow content width and slightly increase base typography size

Browse Source
This commit is contained in:
gbanyan
2025-11-17 22:08:26 +08:00
parent 593a5ff272
commit 675f5de74f
4 changed files with 5 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/blog/[slug]/page.tsx
View File

@@ -80,7 +80,7 @@ export default function BlogPostPage({ params }: Props) {
</div> </div>
)} )}
</header> </header>
<article className="prose prose-slate max-w-none dark:prose-dark"> <article className="prose prose-lg prose-slate max-w-none dark:prose-dark">
{post.feature_image && ( {post.feature_image && (
// feature_image is stored as "../assets/xyz", serve from "/assets/xyz" // feature_image is stored as "../assets/xyz", serve from "/assets/xyz"
// eslint-disable-next-line @next/next/no-img-element // eslint-disable-next-line @next/next/no-img-element

2
app/pages/[slug]/page.tsx
View File

@@ -80,7 +80,7 @@ export default function StaticPage({ params }: Props) {
</div> </div>
)} )}
</header> </header>
<article className="prose prose-slate max-w-none dark:prose-dark"> <article className="prose prose-lg prose-slate max-w-none dark:prose-dark">
{page.feature_image && ( {page.feature_image && (
// feature_image is stored as "../assets/xyz", serve from "/assets/xyz" // feature_image is stored as "../assets/xyz", serve from "/assets/xyz"
// eslint-disable-next-line @next/next/no-img-element // eslint-disable-next-line @next/next/no-img-element

5
components/layout-shell.tsx
View File

@@ -7,8 +7,8 @@ export function LayoutShell({ children }: { children: React.ReactNode }) {
return ( return (
<div className="flex min-h-screen flex-col"> <div className="flex min-h-screen flex-col">
<SiteHeader /> <SiteHeader />
<main className="container mx-auto flex-1 px-4 py-6"> <main className="flex-1 px-4 py-6">
<div className="grid gap-8 lg:grid-cols-[minmax(0,3fr)_minmax(0,1.4fr)]"> <div className="mx-auto grid max-w-5xl gap-6 lg:grid-cols-[minmax(0,2.6fr)_minmax(0,1.4fr)]">
<div>{children}</div> <div>{children}</div>
<RightSidebar /> <RightSidebar />
</div> </div>
@@ -18,4 +18,3 @@ export function LayoutShell({ children }: { children: React.ReactNode }) {
</div> </div>
); );
} }

3
styles/globals.css
View File

@@ -3,6 +3,5 @@
@tailwind utilities; @tailwind utilities;
body { body {
@apply bg-white text-gray-900 dark:bg-gray-950 dark:text-gray-100; @apply bg-white text-gray-900 dark:bg-gray-950 dark:text-gray-100 text-[15px] sm:text-base;
} }