From 08c9073d28cbed830076a54f197e40ed549a800c Mon Sep 17 00:00:00 2001 From: mehedi-hasan Date: Fri, 12 Apr 2024 23:33:15 +0600 Subject: [PATCH] feat: added some themes --- .gitignore | 2 + src/app/globals.css | 34 ++++++++++ src/app/layout.tsx | 5 +- src/components/dashboard.tsx | 9 +-- src/components/hamburger-menu.tsx | 64 ++++++++++--------- src/components/theme-toggle.tsx | 7 ++ src/components/top-nav.tsx | 2 +- .../users-table/data-table-pagination.tsx | 2 +- .../users/users-table/data-table-toolbar.tsx | 10 +-- .../users/users-table/tools-table.tsx | 5 +- 10 files changed, 94 insertions(+), 46 deletions(-) diff --git a/.gitignore b/.gitignore index fd3dbb5..8460eea 100644 --- a/.gitignore +++ b/.gitignore @@ -34,3 +34,5 @@ yarn-error.log* # typescript *.tsbuildinfo next-env.d.ts + +.vercel diff --git a/src/app/globals.css b/src/app/globals.css index 2fd6bac..b8a356a 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -237,6 +237,40 @@ --ring: 244 52% 79%; } + + .bright-turquoise { + /* CSS: .bg-gradient { background: var(--gradient) } */ + --gradient: #00dbde; + + --background: 192 65% 3.52%; + --foreground: 192 10% 97.2%; + + --muted: 192 50% 13.2%; + --muted-foreground: 192 10% 54.4%; + + --popover: 192 45% 5.72%; + --popover-foreground: 192 10% 97.2%; + + --card: 192 45% 5.72%; + --card-foreground: 192 10% 97.2%; + + --border: 192 50% 13.2%; + --input: 192 50% 13.2%; + + --primary: 192 100% 44%; + --primary-foreground: 192 10% 97.2%; + + --secondary: 192 50% 13.2%; + --secondary-foreground: 192 10% 97.2%; + + --accent: 192 50% 13.2%; + --accent-foreground: 192 10% 97.2%; + + --destructive: 0 62.8% 30.6%; + --destructive-foreground: 192 10% 97.2%; + + --ring: 192 100% 44%; + } } @layer base { diff --git a/src/app/layout.tsx b/src/app/layout.tsx index f2bd548..efcc807 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -3,6 +3,7 @@ import { Inter } from "next/font/google"; import "./globals.css"; import { ThemeProvider } from "@/components/theme-provider"; import { Toaster } from "@/components/ui/toaster"; +import { cn } from "@/lib/utils"; const inter = Inter({ subsets: ["latin"] }); @@ -18,7 +19,7 @@ export default function RootLayout({ }>) { return ( - + {children} - + diff --git a/src/components/dashboard.tsx b/src/components/dashboard.tsx index 2956b2d..f7703e4 100644 --- a/src/components/dashboard.tsx +++ b/src/components/dashboard.tsx @@ -1,7 +1,6 @@ "use client"; import * as React from "react"; -import { HelpCircle, Settings } from "lucide-react"; import { cn } from "@/lib/utils"; import { @@ -9,13 +8,9 @@ import { ResizablePanel, ResizablePanelGroup, } from "@/components/ui/resizable"; -import { ScrollArea } from "@/components/ui/scroll-area"; -import { Separator } from "@/components/ui/separator"; import { TooltipProvider } from "@/components/ui/tooltip"; import { SidebarNav } from "./sidebar-nav"; -import { TopNav } from "./top-nav"; -import { docsConfig, topNavItems } from "@/config"; -import { DocsSidebarNav } from "./docs-sidebar-nav"; + // import { AddButton } from "@/components/buttons/AddButton"; // import { AddAssetFlow } from "@/components/modals/add-asset-flow"; // import { WorkspaceSwitcher } from "@/app/(dashboard)/_components/workspace-switcher"; @@ -79,7 +74,7 @@ export function Dashboard({ {/* */} - + {/* */} {children} diff --git a/src/components/hamburger-menu.tsx b/src/components/hamburger-menu.tsx index 8c1a18e..62cb2f3 100644 --- a/src/components/hamburger-menu.tsx +++ b/src/components/hamburger-menu.tsx @@ -35,36 +35,40 @@ export default function HamburgerMenu() { - - - - - - {siteConfig.name} - - - - - - {sideNavItems.map((group, i) => { - return ( - - -
- {group.items.map((link, idx) => { - return ( - - ); - })} -
- - ); - })} - + + + + + + {siteConfig.name} + + + + + + + {sideNavItems.map((group, i) => { + return ( + + {/* */} +

+ {group.group} +

+
+ {group.items.map((link, idx) => { + return ( + + ); + })} +
+ + ); + })} + diff --git a/src/components/theme-toggle.tsx b/src/components/theme-toggle.tsx index 607bd68..7babe2b 100644 --- a/src/components/theme-toggle.tsx +++ b/src/components/theme-toggle.tsx @@ -55,6 +55,13 @@ export function ThemeToggle() { > Light Violet + { + document.documentElement.setAttribute("class", "bright-turquoise"); + }} + > + Bright Turquoise + { document.documentElement.setAttribute("class", "violett"); diff --git a/src/components/top-nav.tsx b/src/components/top-nav.tsx index 6f6dfb1..321331e 100644 --- a/src/components/top-nav.tsx +++ b/src/components/top-nav.tsx @@ -9,7 +9,7 @@ export const TopNav = () => {