내비게이션, 테마 적용

viewer/tailwind.config.ts

@@ -19,38 +19,38 @@ const config: Config = {
 		},
 		extend: {
 			colors: {
-				border: "oklch(var(--border))",
-				input: "oklch(var(--input))",
-				ring: "oklch(var(--ring))",
-				background: "oklch(var(--background))",
-				foreground: "oklch(var(--foreground))",
+				border: "hsl(var(--border))",
+				input: "hsl(var(--input))",
+				ring: "hsl(var(--ring))",
+				background: "hsl(var(--background))",
+				foreground: "hsl(var(--foreground))",
 				primary: {
-					DEFAULT: "oklch(var(--primary))",
-					foreground: "oklch(var(--primary-foreground))",
+					DEFAULT: "hsl(var(--primary))",
+					foreground: "hsl(var(--primary-foreground))",
 				},
 				secondary: {
-					DEFAULT: "oklch(var(--secondary))",
-					foreground: "oklch(var(--secondary-foreground))",
+					DEFAULT: "hsl(var(--secondary))",
+					foreground: "hsl(var(--secondary-foreground))",
 				},
 				destructive: {
-					DEFAULT: "oklch(var(--destructive))",
-					foreground: "oklch(var(--destructive-foreground))",
+					DEFAULT: "hsl(var(--destructive))",
+					foreground: "hsl(var(--destructive-foreground))",
 				},
 				muted: {
-					DEFAULT: "oklch(var(--muted))",
-					foreground: "oklch(var(--muted-foreground))",
+					DEFAULT: "hsl(var(--muted))",
+					foreground: "hsl(var(--muted-foreground))",
 				},
 				accent: {
-					DEFAULT: "oklch(var(--accent))",
-					foreground: "oklch(var(--accent-foreground))",
+					DEFAULT: "hsl(var(--accent))",
+					foreground: "hsl(var(--accent-foreground))",
 				},
 				popover: {
-					DEFAULT: "oklch(var(--popover))",
-					foreground: "oklch(var(--popover-foreground))",
+					DEFAULT: "hsl(var(--popover))",
+					foreground: "hsl(var(--popover-foreground))",
 				},
 				card: {
-					DEFAULT: "oklch(var(--card))",
-					foreground: "oklch(var(--card-foreground))",
+					DEFAULT: "hsl(var(--card))",
+					foreground: "hsl(var(--card-foreground))",
 				},
 			},
 			borderRadius: {