nandi.uk
This repository has no description
1'use client';
2
3import {
4 createTheme,
5 Avatar,
6 Button,
7 CheckboxIndicator,
8 MenuItem,
9 Modal,
10 NavLink,
11 Spoiler,
12 TabsTab,
13 Tooltip,
14 Title,
15 Text,
16} from '@mantine/core';
17
18export const theme = createTheme({
19 primaryColor: 'tangerine',
20 colors: {
21 tangerine: [
22 '#fff1e2',
23 '#ffe1cc',
24 '#ffc29a',
25 '#ffa164',
26 '#fe8537',
27 '#fe731a',
28 '#ff6400',
29 '#e45800',
30 '#cb4d00',
31 '#b14000',
32 ],
33 stone: [
34 '#fafaf9',
35 '#f5f5f4',
36 '#e7e5e4',
37 '#d6d3d1',
38 '#a8a29e',
39 '#78716c',
40 '#57534e',
41 '#44403c',
42 '#292524',
43 '#0c0a09',
44 ],
45 blue: [
46 '#e3faff',
47 '#cff0fe',
48 '#a2dff8',
49 '#72cdf3',
50 '#4cbdef',
51 '#35b4ed',
52 '#23afed',
53 '#109eda',
54 '#0088be',
55 '#0076a8',
56 ],
57 grape: [
58 '#ffe8ff',
59 '#fdceff',
60 '#f79bff',
61 '#f164ff',
62 '#ec36ff',
63 '#ea25ff',
64 '#e803ff',
65 '#ce00e4',
66 '#b800cc',
67 '#a000b3',
68 ],
69 },
70 fontFamily:
71 'Hanken Grotesk, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji',
72 defaultRadius: 'md',
73 components: {
74 Button: Button.extend({
75 defaultProps: {
76 radius: 'xl',
77 },
78 }),
79 NavLink: NavLink.extend({
80 styles: (theme) => ({
81 root: { borderRadius: theme.radius.md },
82 label: {
83 fontSize: theme.fontSizes.md,
84 fontWeight: 600,
85 },
86 }),
87 }),
88 Avatar: Avatar.extend({
89 defaultProps: {
90 radius: 'md',
91 },
92 }),
93 MenuItem: MenuItem.extend({
94 defaultProps: {
95 fz: 'md',
96 fw: 600,
97 },
98 }),
99 CheckboxIndicator: CheckboxIndicator.extend({
100 defaultProps: {
101 radius: 'xl',
102 },
103 }),
104 Modal: Modal.extend({
105 defaultProps: {
106 radius: 'lg',
107 transitionProps: { transition: 'pop' },
108 },
109 }),
110 Spoiler: Spoiler.extend({
111 styles: {
112 control: {
113 color: 'gray',
114 fontWeight: 600,
115 },
116 },
117 }),
118 TabsTab: TabsTab.extend({
119 defaultProps: {
120 fw: 500,
121 fz: 'md',
122 },
123 }),
124 Tooltip: Tooltip.extend({
125 defaultProps: {
126 position: 'top-start',
127 },
128 }),
129 Title: Text.extend({
130 styles: {
131 root: {
132 wordBreak: 'break-word',
133 },
134 },
135 }),
136 Text: Text.extend({
137 styles: {
138 root: {
139 wordBreak: 'break-word',
140 },
141 },
142 }),
143 },
144});