Files
edr-platform/apps/edr-freight-web/backoffice/src/theme/freight-brand.ts
2026-06-10 07:53:15 +00:00

41 lines
1.1 KiB
TypeScript

import { createTheme, type MantineColorsTuple } from "@mantine/core";
/** EDR Freight primary brand green */
export const FREIGHT_BRAND = "#1B9E7A";
export const FREIGHT_BRAND_DARK = "#15805F";
export const FREIGHT_BRAND_LIGHT = "#2DBF95";
export const freightBrand = {
primary: FREIGHT_BRAND,
primaryDark: FREIGHT_BRAND_DARK,
primaryLight: FREIGHT_BRAND_LIGHT,
gradient: `linear-gradient(135deg, ${FREIGHT_BRAND} 0%, ${FREIGHT_BRAND_DARK} 100%)`,
shadow: "0 4px 12px rgba(27, 158, 122, 0.28)",
shadowSm: "0 2px 6px rgba(27, 158, 122, 0.22)",
ring: "rgba(27, 158, 122, 0.2)",
mutedBg: "#E7F8F2",
mutedBorder: "#B7EBDC",
} as const;
/** Mantine green scale with #1B9E7A at index 6 (filled buttons, nav active). */
const freightGreen: MantineColorsTuple = [
"#E7F8F2",
"#C5EFE1",
"#9CE4CD",
"#6BD6B5",
"#41C8A0",
"#25B58C",
FREIGHT_BRAND,
FREIGHT_BRAND_DARK,
"#105F47",
"#0A3D2E",
];
export const freightMantineTheme = createTheme({
primaryColor: "green",
colors: {
green: freightGreen,
},
fontFamily: "'Outfit', var(--font-sans)",
});