components/lib/elements/Breadcrumbs.tsx

@@ -30,7 +30,6 @@ type Props = {
  * @className `twui-breadcrumb-link`
  * @className `twui-current-breadcrumb-wrapper`
  * @className `twui-breadcrumbs-divider`
- * @className `twui-breadcrumbs-back-button`
  */
 export default function Breadcrumbs({
     excludeRegexMatch,
@@ -93,7 +92,6 @@ export default function Breadcrumbs({
                             {...backButtonProps}
                             className={twMerge(
                                 "p-1 -my-2 -mx-2",
-                                "twui-breadcrumbs-back-button",
                                 backButtonProps?.className
                             )}
                             onClick={(e) => {
@@ -101,8 +99,9 @@ export default function Breadcrumbs({
                                 backButtonProps?.onClick?.(e);
                             }}
                             title="Breadcrumbs Back Button"
-                            beforeIcon={<ChevronLeft size={20} />}
+                        >
-                        />
+                            <ChevronLeft size={20} />
+                        </Button>
                         {divider || (
                             <Divider
                                 vertical

layouts/main/Header.tsx

@@ -18,7 +18,7 @@ export default function Header({ menuOpen, setMenuOpen }: Props) {
             className={twMerge(
                 "h-[var(--header-height)] border-0 border-b border-white/10",
                 "w-full flex flex-row items-center px-6 sticky top-0",
-                "bg-background-dark z-10"
+                "bg-[var(--bg-color)] z-10"
             )}
         >
             <Row className="gap-6 ml-auto hidden md:flex">

styles/globals.css

@@ -8,7 +8,7 @@
     --color-primary: #02030f;
 }
 
-.twui-button-general:not(.twui-breadcrumbs-back-button) {
+.twui-button-general {
     @apply rounded-none bg-white text-black;
 }
 

tailwind.config.ts

@@ -0,0 +1,20 @@
+import type { Config } from "tailwindcss";
+
+export default {
+    content: [
+        "./pages/**/*.{js,ts,jsx,tsx,mdx}",
+        "./components/**/*.{js,ts,jsx,tsx,mdx}",
+        "./app/**/*.{js,ts,jsx,tsx,mdx}",
+        "./layouts/**/*.{js,ts,jsx,tsx,mdx}",
+    ],
+    theme: {
+        extend: {
+            colors: {
+                background: "var(--background)",
+                foreground: "var(--foreground)",
+            },
+        },
+    },
+    plugins: [],
+    darkMode: "class",
+} satisfies Config;