aimond/sapiens-web2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Adjust spacing between article title, subtitle, and content sections

Browse Source 
Update margins and padding in `Article.tsx` to visually improve readability by adjusting spacing between the article title, subtitle, headings, and paragraphs.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 0fb68265-c270-4198-9584-3d9be9bddb41
Replit-Commit-Checkpoint-Type: full_checkpoint
This commit is contained in:
kimjaehyeon0101
2025-09-30 04:00:20 +00:00
parent 02dfbd867f
commit 117f2e468d
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
client/src/pages/Article.tsx
View File

@ -182,8 +182,8 @@ export default function Article() {
<main className="max-w-7xl mx-auto px-6 py-12"> <main className="max-w-7xl mx-auto px-6 py-12">
{/* Article Content */} {/* Article Content */}
<article className="mb-16 max-w-4xl mx-auto"> <article className="mb-16 max-w-4xl mx-auto">
<header className="mb-10"> <header className="mb-8">
<h1 className="text-4xl font-bold mb-6 text-gray-900 leading-tight" data-testid="text-article-title">{article.title}</h1> <h1 className="text-4xl font-bold mb-4 text-gray-900 leading-tight" data-testid="text-article-title">{article.title}</h1>
{article.excerpt && ( {article.excerpt && (
<p className="text-lg text-gray-600 mb-0 leading-relaxed" data-testid="text-article-excerpt"> <p className="text-lg text-gray-600 mb-0 leading-relaxed" data-testid="text-article-excerpt">
{article.excerpt} {article.excerpt}
@ -192,7 +192,7 @@ export default function Article() {
</header> </header>
<div <div
className="text-base text-gray-800 -mt-8" className="text-base text-gray-800"
data-testid="text-article-content" data-testid="text-article-content"
> >
{parseArticleContent(article.content).map((part, index) => { {parseArticleContent(article.content).map((part, index) => {
@ -200,14 +200,14 @@ export default function Article() {
return ( return (
<h3 <h3
key={index} key={index}
className="text-lg font-bold mt-8 mb-3 text-gray-900" className="text-lg font-bold mt-10 mb-4 text-gray-900"
> >
{part.content.trim()} {part.content.trim()}
</h3> </h3>
); );
} }
return ( return (
<p key={index} className="mb-3 whitespace-pre-wrap leading-loose"> <p key={index} className="mb-4 whitespace-pre-wrap leading-loose">
{part.content.trim()} {part.content.trim()}
</p> </p>
); );