From 4cb3e7627b3246a468288a057502e97623b5d2c3 Mon Sep 17 00:00:00 2001 From: gbanyan Date: Mon, 17 Nov 2025 22:46:55 +0800 Subject: [PATCH] Introduce env-driven accent color system and apply to links, icons, and tags --- .env.local.example | 6 ++++++ app/blog/[slug]/page.tsx | 33 +++++++++++--------------------- app/layout.tsx | 15 +++++++++++++++ app/pages/[slug]/page.tsx | 33 +++++++++++--------------------- components/hero.tsx | 4 ++-- components/post-list-item.tsx | 36 ++++++++++++----------------------- components/right-sidebar.tsx | 6 +++--- components/theme-toggle.tsx | 2 +- lib/config.ts | 8 ++++++++ tailwind.config.js | 20 +++++++++++++------ 10 files changed, 83 insertions(+), 80 deletions(-) diff --git a/.env.local.example b/.env.local.example index 255cef8..edf500f 100644 --- a/.env.local.example +++ b/.env.local.example @@ -12,6 +12,12 @@ NEXT_PUBLIC_POSTS_PER_PAGE="5" NEXT_PUBLIC_DEFAULT_LOCALE="zh-TW" NEXT_PUBLIC_SITE_AVATAR_URL="https://www.gravatar.com/avatar/yourhash?s=160&d=identicon" +# Color scheme / accents +NEXT_PUBLIC_COLOR_ACCENT="#2563eb" +NEXT_PUBLIC_COLOR_ACCENT_SOFT="#dbeafe" +NEXT_PUBLIC_COLOR_ACCENT_TEXT_LIGHT="#1d4ed8" +NEXT_PUBLIC_COLOR_ACCENT_TEXT_DARK="#93c5fd" + # Social and profile NEXT_PUBLIC_TWITTER_HANDLE="@yourhandle" NEXT_PUBLIC_GITHUB_URL="https://github.com/yourname" diff --git a/app/blog/[slug]/page.tsx b/app/blog/[slug]/page.tsx index 1e78a59..644cdf7 100644 --- a/app/blog/[slug]/page.tsx +++ b/app/blog/[slug]/page.tsx @@ -55,28 +55,17 @@ export default function BlogPostPage({ params }: Props) { {post.tags && (
- {post.tags.map((t, i) => { - const tagColorClasses = [ - 'bg-rose-100 text-rose-700 dark:bg-rose-900/60 dark:text-rose-200', - 'bg-emerald-100 text-emerald-700 dark:bg-emerald-900/60 dark:text-emerald-200', - 'bg-sky-100 text-sky-700 dark:bg-sky-900/60 dark:text-sky-200', - 'bg-amber-100 text-amber-700 dark:bg-amber-900/60 dark:text-amber-200', - 'bg-violet-100 text-violet-700 dark:bg-violet-900/60 dark:text-violet-200' - ]; - const color = - tagColorClasses[i % tagColorClasses.length]; - return ( - - #{t} - - ); - })} + {post.tags.map((t) => ( + + #{t} + + ))}
)} diff --git a/app/layout.tsx b/app/layout.tsx index fdcc644..33ce724 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -32,9 +32,24 @@ export default function RootLayout({ }: { children: React.ReactNode; }) { + const theme = siteConfig.theme; + return ( +