From a3a2f3f6a7403d1caa6e9ced3faeb0f5b2f2243c Mon Sep 17 00:00:00 2001
From: giancarlo <giancarlopsk@gmail.com>
Date: Fri, 29 Mar 2024 14:53:30 +0800
Subject: [PATCH] Update UI element size and change directory exclusion rule

This commit modifies the size of sun and moon icons in the mode-toggle UI and simplifies the space usage of a flex container in the site header. Furthermore, it updates the path pattern for the directory exclusion rule in tailwind configuration to exclude node_module from all directories.
---
 apps/web/app/(marketing)/_components/site-header.tsx | 6 ++----
 packages/ui/src/makerkit/mode-toggle.tsx             | 4 ++--
 tooling/tailwind/index.ts                            | 2 +-
 3 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/apps/web/app/(marketing)/_components/site-header.tsx b/apps/web/app/(marketing)/_components/site-header.tsx
index 2a05e4776..1e7547651 100644
--- a/apps/web/app/(marketing)/_components/site-header.tsx
+++ b/apps/web/app/(marketing)/_components/site-header.tsx
@@ -18,10 +18,8 @@ export function SiteHeader(props: { user?: User | null }) {
           <SiteNavigation />
         </div>
 
-        <div className={'flex flex-1 items-center justify-end space-x-4'}>
-          <div className={'flex items-center'}>
-            <ModeToggle />
-          </div>
+        <div className={'flex flex-1 items-center justify-end space-x-2'}>
+          <ModeToggle />
 
           <SiteHeaderAccountSection user={props.user ?? null} />
         </div>
diff --git a/packages/ui/src/makerkit/mode-toggle.tsx b/packages/ui/src/makerkit/mode-toggle.tsx
index f2735bfe6..aff846893 100644
--- a/packages/ui/src/makerkit/mode-toggle.tsx
+++ b/packages/ui/src/makerkit/mode-toggle.tsx
@@ -42,8 +42,8 @@ export function ModeToggle() {
     <DropdownMenu>
       <DropdownMenuTrigger asChild>
         <Button variant="ghost" size="icon">
-          <Sun className="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
-          <Moon className="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
+          <Sun className="h-[1rem] w-[1rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
+          <Moon className="absolute h-[1rem] w-[1rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
           <span className="sr-only">Toggle theme</span>
         </Button>
       </DropdownMenuTrigger>
diff --git a/tooling/tailwind/index.ts b/tooling/tailwind/index.ts
index 418ae9451..072e02a11 100644
--- a/tooling/tailwind/index.ts
+++ b/tooling/tailwind/index.ts
@@ -6,7 +6,7 @@ export default {
   content: [
     '../../packages/**/*.tsx',
     '../../apps/**/*.tsx',
-    '!./**/node_modules/**',
+    '!**/node_modules',
   ],
   theme: {
     container: {