Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit b1178b6

Browse files
feat: update style
1 parent efa79e3 commit b1178b6

File tree

3 files changed

+46
-46
lines changed

3 files changed

+46
-46
lines changed

‎apps/docs/src/app/(home)/blog/page.tsx

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -14,29 +14,29 @@ export default function Page(): React.ReactElement {
1414
return (
1515
<main className="min-h-screen bg-fd-background">
1616
{/* Hero Section */}
17-
<section className="w-full py-20 relative overflow-hidden">
17+
<section className="w-full py-12 relative overflow-hidden">
1818
{/* Background decoration */}
1919
<div className="absolute inset-0 bg-fd-muted opacity-50" />
2020
<div className="absolute top-0 left-1/4 w-96 h-96 bg-purple-100 dark:bg-purple-900/20 rounded-full blur-3xl opacity-30" />
2121
<div className="absolute bottom-0 right-1/4 w-96 h-96 bg-blue-100 dark:bg-blue-900/20 rounded-full blur-3xl opacity-30" />
2222

23-
<div className="container max-w-6xl mx-auto px-6 relative z-10">
23+
<div className="container max-w-5xl mx-auto px-6 relative z-10">
2424
<div className="text-center">
25-
<h1 className="text-5xl md:text-7xl font-extrabold text-fd-foreground mb-6 leading-tight">
25+
<h1 className="text-4xl md:text-6xl font-extrabold text-fd-foreground mb-4 leading-tight">
2626
{tBase('blog')}
2727
</h1>
2828
</div>
2929
</div>
3030
</section>
3131

3232
{/* Blog Posts Grid */}
33-
<section className="container max-w-6xl mx-auto px-6 py-16">
34-
<div className="space-y-16">
33+
<section className="container max-w-5xl mx-auto px-6 py-12">
34+
<div className="space-y-12">
3535
{/* Featured Post */}
3636
{posts.length > 0 && (
3737
<div>
38-
<div className="flex items-center gap-3 mb-8">
39-
<h2 className="text-3xl font-bold text-fd-foreground">
38+
<div className="flex items-center gap-3 mb-6">
39+
<h2 className="text-2xl font-bold text-fd-foreground">
4040
{t('latestPost')}
4141
</h2>
4242
</div>
@@ -45,8 +45,8 @@ export default function Page(): React.ReactElement {
4545
className="group block bg-fd-card border border-fd-border rounded-2xl overflow-hidden shadow-lg hover:shadow-2xl transition-all duration-300 hover:scale-[1.02] relative"
4646
>
4747
<div className="absolute inset-0 bg-purple-50 dark:bg-purple-900/10 opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
48-
<div className="relative p-8 md:p-12">
49-
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-6">
48+
<div className="relative p-6 md:p-8">
49+
<div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-4">
5050
<time className="text-fd-muted-foreground">
5151
{new Date(
5252
posts[0].data.date ?? posts[0].file.name,
@@ -74,10 +74,10 @@ export default function Page(): React.ReactElement {
7474
</svg>
7575
</div>
7676
</div>
77-
<h3 className="text-3xl md:text-4xl font-bold text-fd-foreground mb-4 group-hover:text-purple-600 dark:group-hover:text-purple-400 transition-colors duration-300">
77+
<h3 className="text-2xl md:text-3xl font-bold text-fd-foreground mb-3 group-hover:text-purple-600 dark:group-hover:text-purple-400 transition-colors duration-300">
7878
{posts[0].data.title}
7979
</h3>
80-
<p className="text-lg text-fd-muted-foreground leading-relaxed">
80+
<p className="text-base text-fd-muted-foreground leading-relaxed">
8181
{posts[0].data.description}
8282
</p>
8383
</div>
@@ -88,19 +88,19 @@ export default function Page(): React.ReactElement {
8888
{/* Other Posts Grid */}
8989
{posts.length > 1 && (
9090
<div>
91-
<h2 className="text-3xl font-bold text-fd-foreground mb-8">
91+
<h2 className="text-2xl font-bold text-fd-foreground mb-6">
9292
{t('allPosts')}
9393
</h2>
94-
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
94+
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-5">
9595
{posts.slice(1).map((post) => (
9696
<Link
9797
key={post.url}
9898
href={post.url}
9999
className="group block bg-fd-card border border-fd-border rounded-xl overflow-hidden shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-105 relative"
100100
>
101101
<div className="absolute inset-0 bg-purple-50 dark:bg-purple-900/10 opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
102-
<div className="relative p-6">
103-
<div className="mb-4">
102+
<div className="relative p-5">
103+
<div className="mb-3">
104104
<time className="text-sm text-fd-muted-foreground">
105105
{new Date(
106106
post.data.date ?? post.file.name,
@@ -112,11 +112,11 @@ export default function Page(): React.ReactElement {
112112
</time>
113113
</div>
114114

115-
<h3 className="text-xl font-bold text-fd-foreground mb-3 line-clamp-2 group-hover:text-purple-600 dark:group-hover:text-purple-400 transition-colors duration-300">
115+
<h3 className="text-lg font-bold text-fd-foreground mb-2 line-clamp-2 group-hover:text-purple-600 dark:group-hover:text-purple-400 transition-colors duration-300">
116116
{post.data.title}
117117
</h3>
118118

119-
<p className="text-fd-muted-foreground text-sm leading-relaxed mb-4 line-clamp-3">
119+
<p className="text-fd-muted-foreground text-sm leading-relaxed mb-3 line-clamp-3">
120120
{post.data.description}
121121
</p>
122122

‎apps/docs/src/app/(home)/learn/page.tsx

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -12,27 +12,27 @@ export default function LearnIndexPage() {
1212
return (
1313
<main className="min-h-screen bg-fd-background">
1414
{/* Hero Section */}
15-
<section className="w-full py-20 relative overflow-hidden">
15+
<section className="w-full py-12 relative overflow-hidden">
1616
{/* Background decoration */}
1717
<div className="absolute inset-0 bg-fd-muted opacity-50" />
1818
<div className="absolute top-0 right-1/4 w-96 h-96 bg-purple-100 dark:bg-purple-900/20 rounded-full blur-3xl opacity-30" />
1919
<div className="absolute bottom-0 left-1/4 w-96 h-96 bg-blue-100 dark:bg-blue-900/20 rounded-full blur-3xl opacity-30" />
2020

21-
<div className="container max-w-6xl mx-auto px-6 relative z-10">
21+
<div className="container max-w-5xl mx-auto px-6 relative z-10">
2222
<div className="text-center">
23-
<h1 className="text-5xl md:text-7xl font-extrabold text-fd-foreground mb-6 leading-tight">
23+
<h1 className="text-4xl md:text-6xl font-extrabold text-fd-foreground mb-4 leading-tight">
2424
{t('title')}
2525
</h1>
26-
<p className="text-xl md:text-2xl text-fd-muted-foreground max-w-3xl mx-auto leading-relaxed">
26+
<p className="text-lg md:text-xl text-fd-muted-foreground max-w-2xl mx-auto leading-relaxed">
2727
{t('subtitle')}
2828
</p>
2929
</div>
3030
</div>
3131
</section>
3232

3333
{/* Learning Paths Section */}
34-
<section className="container max-w-6xl mx-auto px-6 py-16">
35-
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-4xl mx-auto">
34+
<section className="container max-w-5xl mx-auto px-6 py-12">
35+
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 max-w-3xl mx-auto">
3636
{learnTabs.map((tab, index) => (
3737
<Link
3838
key={tab.url}
@@ -42,21 +42,21 @@ export default function LearnIndexPage() {
4242
{/* Hover effect background */}
4343
<div className="absolute inset-0 bg-purple-50 dark:bg-purple-900/10 opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
4444

45-
<div className="relative p-8">
45+
<div className="relative p-6">
4646
{/* Icon and number */}
47-
<div className="flex items-center justify-between mb-6">
48-
<div className="text-4xl">{tab.icon}</div>
49-
<div className="w-8 h-8 bg-fd-accent text-fd-accent-foreground rounded-full flex items-center justify-center text-sm font-bold">
47+
<div className="flex items-center justify-between mb-4">
48+
<div className="text-3xl">{tab.icon}</div>
49+
<div className="w-7 h-7 bg-fd-accent text-fd-accent-foreground rounded-full flex items-center justify-center text-xs font-bold">
5050
{String(index + 1).padStart(2, '0')}
5151
</div>
5252
</div>
5353

5454
{/* Content */}
55-
<h3 className="text-2xl font-bold text-fd-foreground mb-4 group-hover:text-purple-600 dark:group-hover:text-purple-400 transition-colors duration-300">
55+
<h3 className="text-xl font-bold text-fd-foreground mb-3 group-hover:text-purple-600 dark:group-hover:text-purple-400 transition-colors duration-300">
5656
{tab.title}
5757
</h3>
5858

59-
<p className="text-fd-muted-foreground leading-relaxed mb-6">
59+
<p className="text-fd-muted-foreground leading-relaxed mb-4 text-sm">
6060
{tab.description}
6161
</p>
6262

‎apps/docs/src/app/(home)/page.tsx

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -12,15 +12,15 @@ export default function HomePage() {
1212
return (
1313
<main className="flex flex-col items-center justify-center min-h-screen bg-fd-background text-fd-foreground">
1414
{/* Hero Section */}
15-
<section className="w-full flex flex-col items-center pt-20 pb-16 text-center relative overflow-hidden bg-gradient-to-b from-fd-background to-fd-muted">
15+
<section className="w-full flex flex-col items-center pt-12 pb-10 text-center relative overflow-hidden bg-gradient-to-b from-fd-background to-fd-muted">
1616
{/* Decorative background pattern */}
1717
<div className="absolute inset-0 bg-[radial-gradient(ellipse_at_center,_var(--color-fd-accent)_0%,_transparent_70%)] opacity-50" />
1818

19-
<div className="relative z-10 max-w-6xl px-4">
20-
<h1 className="text-5xl md:text-7xl font-extrabold mb-6 text-fd-foreground leading-tight">
19+
<div className="relative z-10 max-w-5xl px-4">
20+
<h1 className="text-4xl md:text-6xl font-extrabold mb-4 text-fd-foreground leading-tight">
2121
{t('title')}
2222
</h1>
23-
<div className="text-xl md:text-2xl text-fd-muted-foreground max-w-4xl mb-10 leading-relaxed">
23+
<div className="text-lg md:text-xl text-fd-muted-foreground max-w-3xl mb-8 leading-relaxed">
2424
{t.rich('subtitle', {
2525
strong: (chunks) => (
2626
<strong className="font-semibold text-fd-foreground">
@@ -30,24 +30,24 @@ export default function HomePage() {
3030
})}
3131
</div>
3232

33-
<div className="flex flex-col sm:flex-row gap-6 justify-center mb-8">
33+
<div className="flex flex-col sm:flex-row gap-4 justify-center mb-6">
3434
<Link
3535
href="/docs"
36-
className="px-8 py-4 rounded-xl bg-fd-primary text-fd-primary-foreground font-semibold text-lg shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-105"
36+
className="px-6 py-3 rounded-xl bg-fd-primary text-fd-primary-foreground font-semibold text-base shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-105"
3737
>
3838
{t('getStarted')}
3939
</Link>
4040
<Link
4141
href="/learn"
42-
className="px-8 py-4 rounded-xl bg-fd-card border-2 border-fd-border text-fd-foreground font-semibold text-lg shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-105 hover:border-purple-400"
42+
className="px-6 py-3 rounded-xl bg-fd-card border-2 border-fd-border text-fd-foreground font-semibold text-base shadow-lg hover:shadow-xl transition-all duration-300 hover:scale-105 hover:border-purple-400"
4343
>
4444
{t('learn')}
4545
</Link>
4646
</div>
4747

4848
<button
4949
aria-label="Copy npx command for creating a new Next.js app"
50-
className="group mt-4 px-6 py-3 bg-fd-secondary rounded-lg text-sm font-mono text-fd-muted-foreground border border-fd-border hover:border-purple-400 hover:bg-fd-accent transition-all duration-300 hover:scale-105 relative overflow-hidden"
50+
className="group mt-3 px-5 py-2 bg-fd-secondary rounded-lg text-xs font-mono text-fd-muted-foreground border border-fd-border hover:border-purple-400 hover:bg-fd-accent transition-all duration-300 hover:scale-105 relative overflow-hidden"
5151
type="button"
5252
// onClick={() => navigator.clipboard.writeText('npx create-next-app@latest')}
5353
>
@@ -58,16 +58,16 @@ export default function HomePage() {
5858
</section>
5959

6060
{/* Features Section */}
61-
<section className="w-full max-w-6xl px-6 py-16">
62-
<div className="flex flex-col md:flex-row md:items-end md:justify-between mb-12 gap-4">
63-
<h2 className="text-4xl md:text-5xl font-bold text-fd-foreground">
61+
<section className="w-full max-w-5xl px-6 py-12">
62+
<div className="flex flex-col md:flex-row md:items-end md:justify-between mb-8 gap-4">
63+
<h2 className="text-3xl md:text-4xl font-bold text-fd-foreground">
6464
{t('featuresTitle')}
6565
</h2>
66-
<p className="text-xl text-fd-muted-foreground max-w-md">
66+
<p className="text-lg text-fd-muted-foreground max-w-md">
6767
{t('featuresSubtitle')}
6868
</p>
6969
</div>
70-
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
70+
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
7171
{features.map(
7272
(
7373
feature: { title: string; desc: string; href: string },
@@ -77,21 +77,21 @@ export default function HomePage() {
7777
key={feature.title}
7878
href={feature.href}
7979
target={feature.href.startsWith('/') ? '_self' : '_blank'}
80-
className="group block p-8 rounded-2xl border border-fd-border bg-fd-card shadow-lg hover:shadow-2xl transition-all duration-300 hover:scale-105 hover:border-purple-400 relative overflow-hidden"
80+
className="group block p-6 rounded-2xl border border-fd-border bg-fd-card shadow-lg hover:shadow-2xl transition-all duration-300 hover:scale-105 hover:border-purple-400 relative overflow-hidden"
8181
>
8282
{/* Hover effect background */}
8383
<div className="absolute inset-0 bg-purple-50 dark:bg-purple-900/10 opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
8484

8585
<div className="relative z-10">
86-
<div className="text-2xl font-bold mb-4 text-fd-foreground group-hover:text-purple-600 transition-colors duration-300">
86+
<div className="text-xl font-bold mb-3 text-fd-foreground group-hover:text-purple-600 transition-colors duration-300">
8787
{feature.title}
8888
</div>
89-
<div className="text-fd-muted-foreground text-lg leading-relaxed group-hover:text-fd-foreground transition-colors duration-300">
89+
<div className="text-fd-muted-foreground text-base leading-relaxed group-hover:text-fd-foreground transition-colors duration-300">
9090
{feature.desc}
9191
</div>
9292

9393
{/* Link arrow indicator */}
94-
<div className="mt-6 flex items-center text-purple-600 opacity-0 group-hover:opacity-100 transition-all duration-300 transform translate-x-0 group-hover:translate-x-2">
94+
<div className="mt-4 flex items-center text-purple-600 opacity-0 group-hover:opacity-100 transition-all duration-300 transform translate-x-0 group-hover:translate-x-2">
9595
<span className="text-sm font-semibold mr-2">
9696
{feature.href.startsWith('/') ? 'Explore' : 'Visit'}
9797
</span>

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /