From 01d7cf8fc97c1450894495fb8c4f068290caf2d4 Mon Sep 17 00:00:00 2001
From: bdim404 <i@bdim.moe>
Date: Fri, 6 Mar 2026 13:24:44 +0800
Subject: [PATCH] style: Update Navbar and Home components with background
 color adjustments

---
 qwen3-tts-frontend/src/components/Navbar.tsx | 2 +-
 qwen3-tts-frontend/src/pages/Home.tsx        | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/qwen3-tts-frontend/src/components/Navbar.tsx b/qwen3-tts-frontend/src/components/Navbar.tsx
index 6a6a22e..6c778ab 100644
--- a/qwen3-tts-frontend/src/components/Navbar.tsx
+++ b/qwen3-tts-frontend/src/components/Navbar.tsx
@@ -22,7 +22,7 @@ export function Navbar({ onToggleSidebar }: NavbarProps) {
   const { t, i18n } = useTranslation(['nav', 'constants'])
 
   return (
-    <nav className="h-16 bg-background flex items-center justify-end px-4 gap-2">
+    <nav className="h-16 flex items-center justify-end px-4 gap-2">
       {onToggleSidebar && (
         <Button
           variant="ghost"
diff --git a/qwen3-tts-frontend/src/pages/Home.tsx b/qwen3-tts-frontend/src/pages/Home.tsx
index a5347f0..169cbdf 100644
--- a/qwen3-tts-frontend/src/pages/Home.tsx
+++ b/qwen3-tts-frontend/src/pages/Home.tsx
@@ -44,10 +44,10 @@ function Home() {
         onOpenChange={setSidebarOpen}
       />
 
-      <div className="flex-1 flex flex-col overflow-hidden">
+      <div className="flex-1 flex flex-col overflow-hidden bg-muted/30">
         <Navbar onToggleSidebar={() => setSidebarOpen(!sidebarOpen)} />
 
-        <main className="flex-1 overflow-y-auto flex items-start md:items-center justify-center">
+        <main className="flex-1 overflow-y-auto flex items-start md:items-center justify-center lg:rounded-tl-2xl bg-background">
           <div className="w-full container mx-auto p-3 md:p-6 max-w-[800px] md:max-w-[700px]">
             <Tabs value={currentTab} onValueChange={setCurrentTab}>
               <TabsList className="grid w-full grid-cols-3 h-9 mb-3">