Update

devplus2024 · Jul 26, 2024 · b4e36c5 · b4e36c5
1 parent fa84acc
commit b4e36c5
Show file tree

Hide file tree

Showing 9 changed files with 272 additions and 154 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -42,6 +42,7 @@
     "@radix-ui/react-toggle": "^1.1.0",
     "@radix-ui/react-toggle-group": "^1.1.0",
     "@radix-ui/react-tooltip": "^1.1.2",
+    "@radix-ui/themes": "^3.1.1",
     "class-variance-authority": "^0.7.0",
     "classnames": "^2.5.1",
     "clsx": "^2.1.1",

diff --git a/src/app/globals.css b/src/app/globals.css
@@ -4,6 +4,8 @@
 
 @layer base {
   :root {
+    --theme-toggle-sun-icon-display: block;
+    --theme-toggle-moon-icon-display: none;
     --menu-border-color: #ffffff;
     --background: 0 0% 100%;
     --foreground: 240 10% 3.9%;
@@ -29,6 +31,8 @@
     --fill-logo-svg: #000000;
   }
   .dark {
+    --theme-toggle-sun-icon-display: none;
+    --theme-toggle-moon-icon-display: block;
     --menu-border-color: #202020;
     ----arrow-bg: #202020;
     --chat: #1a1a1a;

diff --git a/src/app/home/page.tsx b/src/app/home/page.tsx
@@ -112,8 +112,8 @@ export default function Home() {
               Your Ultimate Music Destination
             </p>
           </div>
-          <h1 className="text-center leading-[2.6rem]  text-[2.5rem] font-bold">
-            Unleash Your Music Experience Today
+          <h1 className="text-center leading-[2.6rem] w-[49rem] text-[3rem] font-bold">
+            A place where music connects people from all corners of the world
           </h1>
           <p className="font-medium w-[30rem] text-center text-[1rem]">
             Dive into an endless sea of melodies. Customize your playlists,

diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -26,7 +26,7 @@ export default function RootLayout({
       >
         <head />
         <body className="relative">
-          <ThemeProvider enableSystem attribute="class" defaultTheme="dark">
+          <ThemeProvider enableSystem attribute="class" defaultTheme="system">
             <Navigation />
             {children}
           </ThemeProvider>

diff --git a/src/components/CommandMenu.tsx b/src/components/CommandMenu.tsx
@@ -34,6 +34,7 @@ import {
   EnvelopeClosedIcon,
   FaceIcon,
   GearIcon,
+  MagnifyingGlassIcon,
   PersonIcon,
 } from "@radix-ui/react-icons";
 import { useCommandState } from "cmdk";
@@ -91,7 +92,7 @@ export function CommandMenu() {
         className="cursor-pointer border p-2 flex gap-4 group hover:bg-muted transition-all duration-200 ease-out items-center justify-between h-[36px] w-[300px] rounded-md"
       >
         <div className="gap-4 flex items-center text-[#7c7c7c] dark:group-hover:text-white transition-all duration-200 ease-out ">
-          <Search className="h-5 w-5  " />
+          <MagnifyingGlassIcon width="21" height="21" />
           <p className="text-sm select-none">Search documetion...</p>
         </div>
         <p className="text-sm text-muted-foreground">
@@ -168,7 +169,7 @@ export function CommandMenu() {
               <StickyNote className="mr-2 h-4 w-4" />
               <span>Download</span>
             </CommandItem>
-			 <CommandItem
+            <CommandItem
               onSelect={() => {
                 router.push("/chat");
                 setOpen((open) => !open);