fix: matine ui fixes for concistency (#5733)

2026-05-28 10:59:03 +02:00
1 parent c252b4f9ac
commit 4454e3fb7a
@@ -1,13 +1,103 @@
-import { createTheme } from "@mantine/core";
-
-import { primaryColor } from "./theme/colors/primary";
-import { secondaryColor } from "./theme/colors/secondary";
+import { createTheme, rem } from "@mantine/core";

 export const theme = createTheme({
-  colors: {
-    primaryColor,
-    secondaryColor,
+  primaryColor: "red",
+  autoContrast: true,
+  respectReducedMotion: true,
+  cursorType: "pointer",
+
+  fontFamily: "Inter, system-ui, -apple-system, sans-serif",
+  fontFamilyMonospace: "ui-monospace, 'Cascadia Code', 'Fira Code', monospace",
+
+  headings: {
+    fontFamily: "Inter, system-ui, -apple-system, sans-serif",
+    fontWeight: "600",
+    sizes: {
+      h1: { fontSize: rem(36), lineHeight: "1.1", fontWeight: "700" },
+      h2: { fontSize: rem(24), lineHeight: "1.2", fontWeight: "700" },
+      h3: { fontSize: rem(20), lineHeight: "1.3", fontWeight: "600" },
+      h4: { fontSize: rem(16), lineHeight: "1.4", fontWeight: "600" },
+      h5: { fontSize: rem(14), lineHeight: "1.5", fontWeight: "600" },
+      h6: { fontSize: rem(12), lineHeight: "1.5", fontWeight: "600" },
+    },
+  },
+
+  fontSizes: {
+    xs: rem(12),
+    sm: rem(14),
+    md: rem(16),
+    lg: rem(18),
+    xl: rem(20),
+  },
+
+  spacing: {
+    xs: rem(10),
+    sm: rem(12),
+    md: rem(16),
+    lg: rem(20),
+    xl: rem(32),
+  },
+
+  radius: {
+    xs: rem(4),
+    sm: rem(4),
+    md: rem(8),
+    lg: rem(12),
+    xl: rem(16),
+  },
+  defaultRadius: "md",
+
+  shadows: {
+    xs: "0 1px 2px rgba(0, 0, 0, 0.04)",
+    sm: "0 1px 3px rgba(0, 0, 0, 0.06)",
+    md: "0 2px 8px rgba(0, 0, 0, 0.08)",
+    lg: "0 4px 12px rgba(0, 0, 0, 0.10)",
+    xl: "0 8px 24px rgba(0, 0, 0, 0.12)",
+  },
+
+  components: {
+    Card: {
+      defaultProps: {
+        withBorder: true,
+        radius: "lg",
+      },
+    },
+    Paper: {
+      defaultProps: {
+        withBorder: true,
+        radius: "md",
+      },
+    },
+    Button: {
+      defaultProps: {
+        radius: "md",
+      },
+    },
+    ActionIcon: {
+      defaultProps: {
+        radius: "md",
+      },
+    },
+    Tooltip: {
+      defaultProps: {
+        openDelay: 300,
+      },
+    },
+    Menu: {
+      defaultProps: {
+        withArrow: true,
+      },
+    },
+    NavLink: {
+      defaultProps: {
+        style: { borderRadius: 5 },
+      },
+    },
+    LoadingOverlay: {
+      defaultProps: {
+        zIndex: 1000,
+        overlayProps: { radius: "sm", blur: 2 },
+      },
+    },
  },
-  primaryColor: "primaryColor",
-  defaultRadius: "sm",
 });