@akinon/ui-theme 0.1.0 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1 @@
1
+ {"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../src/colors.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;CAiBnB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;CAkBrB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;CAYhB,CAAC;AAEF,eAAO,MAAM,GAAG;;;;;;;;;;;;CAYf,CAAC;AAEF,eAAO,MAAM,KAAK;;;;;;;;;;;;CAYjB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;CAYhB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;CAYlB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;CAYhB,CAAC;AAGF,eAAO,MAAM,KAAK;;;;;;;;;;;;;CAajB,CAAC;AAGF,eAAO,MAAM,MAAM;;;;;;;;;;;;CAYlB,CAAC;AAGF,eAAO,MAAM,MAAM;;;;;;;;;;;;CAYlB,CAAC"}
@@ -0,0 +1,162 @@
1
+ "use strict";
2
+ // Tailwind like colors.
3
+ Object.defineProperty(exports, "__esModule", { value: true });
4
+ exports.akinon = exports.orange = exports.azure = exports.pink = exports.purple = exports.blue = exports.green = exports.red = exports.gray = exports.ebonyClay = exports.neutral = void 0;
5
+ exports.neutral = {
6
+ '50': '#ffffff',
7
+ '75': '#fbfcfd',
8
+ '100': '#f5f5f5',
9
+ '150': '#f1f3f9',
10
+ '200': '#e5e5e5',
11
+ '250': '#d6e1e3',
12
+ '300': '#d4d4d4',
13
+ '350': '#c8daec',
14
+ '375': '#bfbfbf',
15
+ '400': '#a3a3a3',
16
+ '500': '#737373',
17
+ '600': '#525252',
18
+ '700': '#404040',
19
+ '800': '#262626',
20
+ '900': '#171717',
21
+ '950': '#0a0a0a'
22
+ };
23
+ exports.ebonyClay = {
24
+ '50': '#677084',
25
+ '100': '#5c6880',
26
+ '150': '#58669a',
27
+ '200': '#515c7c',
28
+ '300': '#465178',
29
+ '350': '#43464f',
30
+ '375': '#3f4b5c',
31
+ '400': '#3d4561', // applied from design: filters card bg
32
+ '450': '#333b57',
33
+ '475': '#2b344c',
34
+ '500': '#293245', // applied from design: layout color
35
+ '550': '#262e47',
36
+ '600': '#232b3b', // applied from design: header input bg
37
+ '700': '#1d2331',
38
+ '800': '#171d27',
39
+ '900': '#11171e',
40
+ '950': '#0c111a'
41
+ };
42
+ exports.gray = {
43
+ '100': '#f5f5f5',
44
+ '200': '#e5e5e5',
45
+ '300': '#d4d4d4',
46
+ '400': '#a3a3a3',
47
+ '500': '#788195', // applied from design: header text placeholder
48
+ '600': '#525252',
49
+ '700': '#404040',
50
+ '800': '#262626',
51
+ '900': '#3b404c', // applied from design: layout border
52
+ '925': '#36373b',
53
+ '950': '#171717'
54
+ };
55
+ exports.red = {
56
+ '50': '#fffaf5',
57
+ '100': '#fcf3eb',
58
+ '200': '#fce0cf',
59
+ '300': '#fac7b1',
60
+ '400': '#f58d7a',
61
+ '500': '#ef4444',
62
+ '600': '#d93636',
63
+ '700': '#b32525',
64
+ '800': '#8f1818',
65
+ '900': '#6b0e0e',
66
+ '950': '#450606'
67
+ };
68
+ exports.green = {
69
+ '50': '#fafcf2',
70
+ '100': '#f5fae6',
71
+ '200': '#e5f5c1',
72
+ '300': '#d2ed9d',
73
+ '400': '#a9e05c',
74
+ '500': '#7ed321',
75
+ '600': '#6abf1b',
76
+ '700': '#529e13',
77
+ '800': '#3d800d',
78
+ '900': '#275e07',
79
+ '950': '#163d03'
80
+ };
81
+ exports.blue = {
82
+ '50': '#f5fcff',
83
+ '100': '#ebf8ff',
84
+ '200': '#cceafc',
85
+ '300': '#afd9fa',
86
+ '400': '#74b4f7',
87
+ '500': '#3b82f6',
88
+ '600': '#306fdb',
89
+ '700': '#2153b8',
90
+ '800': '#153b94',
91
+ '900': '#0c286e',
92
+ '950': '#051647'
93
+ };
94
+ exports.purple = {
95
+ '50': '#fbf7fc',
96
+ '100': '#f5eff8',
97
+ '200': '#ebdef0',
98
+ '300': '#dbc4e3',
99
+ '400': '#c7a1d1',
100
+ '500': '#ad7abb',
101
+ '600': '#915c9d',
102
+ '700': '#72467b',
103
+ '800': '#633e6a',
104
+ '900': '#543659',
105
+ '950': '#341b37'
106
+ };
107
+ exports.pink = {
108
+ '50': '#fff7fd',
109
+ '100': '#fcebf7',
110
+ '200': '#facfec',
111
+ '300': '#f7b2df',
112
+ '400': '#f27ec0',
113
+ '500': '#ec4899',
114
+ '600': '#d63c87',
115
+ '700': '#b32965',
116
+ '800': '#8f1b49',
117
+ '900': '#6b0f31',
118
+ '950': '#45061a'
119
+ };
120
+ // This will be our main primary.
121
+ exports.azure = {
122
+ '50': '#eef5ff',
123
+ '100': '#d9e8ff',
124
+ '200': '#bcd8ff',
125
+ '300': '#8ec0ff',
126
+ '400': '#599cff',
127
+ '500': '#4482ff', // applied from design: primary button color
128
+ '600': '#1b55f5',
129
+ '750': '#1890ff',
130
+ '700': '#1440e1',
131
+ '800': '#1734b6',
132
+ '900': '#19318f',
133
+ '950': '#142057'
134
+ };
135
+ // This will be our secondary color.
136
+ exports.orange = {
137
+ '50': '#fffcf2',
138
+ '100': '#fff8e6',
139
+ '200': '#ffebbf',
140
+ '300': '#fcd997',
141
+ '400': '#fcb44e',
142
+ '500': '#f98003',
143
+ '600': '#e06e02',
144
+ '700': '#ba5202',
145
+ '800': '#963d02',
146
+ '900': '#702900',
147
+ '950': '#471700'
148
+ };
149
+ // Akinon brand color and shades.
150
+ exports.akinon = {
151
+ '50': '#fcf2f7',
152
+ '100': '#fae6ef',
153
+ '200': '#f5c4d7',
154
+ '300': '#eda1b9',
155
+ '400': '#de5f77',
156
+ '500': '#d2282e',
157
+ '600': '#bd2025',
158
+ '700': '#9c161a',
159
+ '800': '#7d0e11',
160
+ '900': '#5e080a',
161
+ '950': '#3d0405'
162
+ };
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}
@@ -0,0 +1,17 @@
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./theme"), exports);
@@ -0,0 +1 @@
1
+ {"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,SAAS,EAAE,WAAW,EAAE,MAAM,MAAM,CAAC;AAevD,eAAO,MAAM,QAAQ,KAAK,CAAC;AAE3B,KAAK,SAAS,GACV,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,KAAK,GACL,OAAO,GACP,QAAQ,GACR,MAAM,GACN,WAAW,GACX,SAAS,CAAC;AAEd,KAAK,KAAK,GAAG;IACX,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CACvB,CAAC;AAEF,KAAK,MAAM,GAAG,MAAM,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;AAavC,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAAG;IAC7C,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,KAAK,EAAE,kBAuFnB,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,QAAQ,EAAE,OAAO,SAAS,CAAC,QAA6B,CAAC;AAEtE;;;;;;;;;GASG;AACH,eAAO,MAAM,eAAe;;CAc3B,CAAC"}
@@ -0,0 +1,143 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.getCssVariables = exports.useToken = exports.theme = exports.fontSize = void 0;
4
+ const antd_1 = require("antd");
5
+ const colors_1 = require("./colors");
6
+ // antd works with numbers. use this to convert px to rem.
7
+ exports.fontSize = 16;
8
+ const colors = {
9
+ akinon: colors_1.akinon,
10
+ azure: colors_1.azure,
11
+ orange: colors_1.orange,
12
+ red: colors_1.red,
13
+ green: colors_1.green,
14
+ purple: colors_1.purple,
15
+ gray: colors_1.gray,
16
+ ebonyClay: colors_1.ebonyClay,
17
+ neutral: colors_1.neutral
18
+ };
19
+ /**
20
+ * Non-editable akinon theme object.
21
+ * This object contains both our theme values and
22
+ * antd's default theme values.
23
+ *
24
+ * You can use https://ant.design/theme-editor tool
25
+ * to learn about properties and their effects.
26
+ */
27
+ exports.theme = {
28
+ // We use dark algorithm from antd by default,
29
+ // since our applications are dark themed.
30
+ algorithm: antd_1.theme.darkAlgorithm,
31
+ colors,
32
+ // We also need to override antd styles with
33
+ // our current color palette.
34
+ token: {
35
+ colorTextBase: colors.neutral['100'],
36
+ colorText: colors.neutral['100'],
37
+ colorTextSecondary: colors.gray['500'],
38
+ colorTextPlaceholder: colors.gray['500'],
39
+ colorPrimary: colors.azure['500'],
40
+ colorError: colors.red['500'],
41
+ colorBgLayout: colors.ebonyClay['500'], // effects layout bg
42
+ colorBgContainer: colors.ebonyClay['600'], // effects card bg, table bg, input bg
43
+ colorBgElevated: colors.ebonyClay['400'], // effects dropdown bg, select bg, notification bg
44
+ controlItemBgHover: colors.ebonyClay['200'], // effects item bg in dropdown item when hovered
45
+ controlItemBgActive: colors.ebonyClay['300'], // effects active item bg such in dropdown item
46
+ controlItemBgActiveHover: colors.ebonyClay['300'], // effects active item bg such in dropdown item when hovered
47
+ colorBgSpotlight: colors.ebonyClay['600'], //TODO: bg color of tooltip?
48
+ colorBorder: colors.ebonyClay['700'],
49
+ fontFamily: "'Jost Variable'," + antd_1.theme.getDesignToken().fontFamily,
50
+ fontSize: exports.fontSize * 0.875
51
+ },
52
+ components: {
53
+ Layout: {
54
+ headerBg: colors.ebonyClay['500'],
55
+ siderBg: colors.ebonyClay['500']
56
+ },
57
+ Dropdown: {
58
+ colorPrimary: colors.neutral['100'], // primary color (azure500) doesn't work well with dropdown bg
59
+ controlPaddingHorizontal: exports.fontSize
60
+ },
61
+ Menu: {
62
+ darkItemBg: colors.ebonyClay['500'],
63
+ darkSubMenuItemBg: colors.ebonyClay['600'],
64
+ darkItemSelectedBg: colors.ebonyClay['700'],
65
+ itemBorderRadius: 0,
66
+ itemMarginBlock: 0,
67
+ itemMarginInline: 0,
68
+ darkItemColor: colors.gray['500'],
69
+ itemHeight: exports.fontSize * 3.25
70
+ },
71
+ Breadcrumb: {
72
+ fontSize: exports.fontSize * 0.625,
73
+ lastItemColor: colors.azure['500']
74
+ },
75
+ Card: {
76
+ colorBgContainer: colors.ebonyClay['450'],
77
+ colorTextDescription: colors.neutral['100'],
78
+ headerFontSize: exports.fontSize * 1.25,
79
+ fontSize: exports.fontSize * 0.875
80
+ },
81
+ Collapse: {
82
+ headerPadding: '0 0 12px',
83
+ // because of ghost prop, we need to use important
84
+ contentPadding: '0 0 24px !important',
85
+ fontSizeIcon: exports.fontSize * 1.65,
86
+ fontSize: exports.fontSize
87
+ },
88
+ Form: {
89
+ itemMarginBottom: 16,
90
+ labelColor: colors.neutral['100'],
91
+ verticalLabelPadding: 4
92
+ },
93
+ Select: {
94
+ colorTextDisabled: colors.ebonyClay['350'],
95
+ colorBgContainerDisabled: colors.gray['925'],
96
+ colorBgContainer: colors.ebonyClay['475'],
97
+ fontSizeLG: exports.fontSize * 0.875,
98
+ colorBorder: colors.ebonyClay['550'],
99
+ lineWidth: 2
100
+ },
101
+ Input: {
102
+ colorBgContainer: colors.ebonyClay['475'],
103
+ fontSizeLG: exports.fontSize * 0.875,
104
+ colorBorder: colors.ebonyClay['550'],
105
+ lineWidth: 2
106
+ },
107
+ InputNumber: {
108
+ colorBgContainer: colors.ebonyClay['475'],
109
+ fontSizeLG: exports.fontSize * 0.875,
110
+ colorBorder: colors.ebonyClay['550'],
111
+ lineWidth: 2
112
+ }
113
+ }
114
+ };
115
+ /**
116
+ * Used to access antd's token values from react components.
117
+ * For detailed usage see,
118
+ * https://ant.design/docs/react/customize-theme#consume-design-token
119
+ */
120
+ exports.useToken = antd_1.theme.useToken;
121
+ /**
122
+ * Returns css variable objects for our
123
+ * theme's custom color palette.
124
+ *
125
+ * Outputs css variables like:
126
+ * --color-primary-100: #f0f8ff;
127
+ * --color-body-fg: #ffffff;
128
+ * --color-success-500: #52c41a;
129
+ * --color-{object_key}-{object_key}: {color_value};
130
+ */
131
+ const getCssVariables = () => {
132
+ const { colors } = exports.theme;
133
+ const prefix = '--color';
134
+ const result = {};
135
+ for (const [colorType, colorObject] of Object.entries(colors)) {
136
+ for (const [colorShade, colorValue] of Object.entries(colorObject)) {
137
+ const variableName = `${prefix}-${colorType}-${colorShade}`;
138
+ result[variableName] = colorValue;
139
+ }
140
+ }
141
+ return result;
142
+ };
143
+ exports.getCssVariables = getCssVariables;
@@ -0,0 +1,156 @@
1
+ export declare const neutral: {
2
+ '50': string;
3
+ '75': string;
4
+ '100': string;
5
+ '150': string;
6
+ '200': string;
7
+ '250': string;
8
+ '300': string;
9
+ '350': string;
10
+ '375': string;
11
+ '400': string;
12
+ '500': string;
13
+ '600': string;
14
+ '700': string;
15
+ '800': string;
16
+ '900': string;
17
+ '950': string;
18
+ };
19
+ export declare const ebonyClay: {
20
+ '50': string;
21
+ '100': string;
22
+ '150': string;
23
+ '200': string;
24
+ '300': string;
25
+ '350': string;
26
+ '375': string;
27
+ '400': string;
28
+ '450': string;
29
+ '475': string;
30
+ '500': string;
31
+ '550': string;
32
+ '600': string;
33
+ '700': string;
34
+ '800': string;
35
+ '900': string;
36
+ '950': string;
37
+ };
38
+ export declare const gray: {
39
+ '100': string;
40
+ '200': string;
41
+ '300': string;
42
+ '400': string;
43
+ '500': string;
44
+ '600': string;
45
+ '700': string;
46
+ '800': string;
47
+ '900': string;
48
+ '925': string;
49
+ '950': string;
50
+ };
51
+ export declare const red: {
52
+ '50': string;
53
+ '100': string;
54
+ '200': string;
55
+ '300': string;
56
+ '400': string;
57
+ '500': string;
58
+ '600': string;
59
+ '700': string;
60
+ '800': string;
61
+ '900': string;
62
+ '950': string;
63
+ };
64
+ export declare const green: {
65
+ '50': string;
66
+ '100': string;
67
+ '200': string;
68
+ '300': string;
69
+ '400': string;
70
+ '500': string;
71
+ '600': string;
72
+ '700': string;
73
+ '800': string;
74
+ '900': string;
75
+ '950': string;
76
+ };
77
+ export declare const blue: {
78
+ '50': string;
79
+ '100': string;
80
+ '200': string;
81
+ '300': string;
82
+ '400': string;
83
+ '500': string;
84
+ '600': string;
85
+ '700': string;
86
+ '800': string;
87
+ '900': string;
88
+ '950': string;
89
+ };
90
+ export declare const purple: {
91
+ '50': string;
92
+ '100': string;
93
+ '200': string;
94
+ '300': string;
95
+ '400': string;
96
+ '500': string;
97
+ '600': string;
98
+ '700': string;
99
+ '800': string;
100
+ '900': string;
101
+ '950': string;
102
+ };
103
+ export declare const pink: {
104
+ '50': string;
105
+ '100': string;
106
+ '200': string;
107
+ '300': string;
108
+ '400': string;
109
+ '500': string;
110
+ '600': string;
111
+ '700': string;
112
+ '800': string;
113
+ '900': string;
114
+ '950': string;
115
+ };
116
+ export declare const azure: {
117
+ '50': string;
118
+ '100': string;
119
+ '200': string;
120
+ '300': string;
121
+ '400': string;
122
+ '500': string;
123
+ '600': string;
124
+ '750': string;
125
+ '700': string;
126
+ '800': string;
127
+ '900': string;
128
+ '950': string;
129
+ };
130
+ export declare const orange: {
131
+ '50': string;
132
+ '100': string;
133
+ '200': string;
134
+ '300': string;
135
+ '400': string;
136
+ '500': string;
137
+ '600': string;
138
+ '700': string;
139
+ '800': string;
140
+ '900': string;
141
+ '950': string;
142
+ };
143
+ export declare const akinon: {
144
+ '50': string;
145
+ '100': string;
146
+ '200': string;
147
+ '300': string;
148
+ '400': string;
149
+ '500': string;
150
+ '600': string;
151
+ '700': string;
152
+ '800': string;
153
+ '900': string;
154
+ '950': string;
155
+ };
156
+ //# sourceMappingURL=colors.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../src/colors.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;CAiBnB,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;CAkBrB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;CAYhB,CAAC;AAEF,eAAO,MAAM,GAAG;;;;;;;;;;;;CAYf,CAAC;AAEF,eAAO,MAAM,KAAK;;;;;;;;;;;;CAYjB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;CAYhB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;CAYlB,CAAC;AAEF,eAAO,MAAM,IAAI;;;;;;;;;;;;CAYhB,CAAC;AAGF,eAAO,MAAM,KAAK;;;;;;;;;;;;;CAajB,CAAC;AAGF,eAAO,MAAM,MAAM;;;;;;;;;;;;CAYlB,CAAC;AAGF,eAAO,MAAM,MAAM;;;;;;;;;;;;CAYlB,CAAC"}
@@ -0,0 +1,159 @@
1
+ // Tailwind like colors.
2
+ export const neutral = {
3
+ '50': '#ffffff',
4
+ '75': '#fbfcfd',
5
+ '100': '#f5f5f5',
6
+ '150': '#f1f3f9',
7
+ '200': '#e5e5e5',
8
+ '250': '#d6e1e3',
9
+ '300': '#d4d4d4',
10
+ '350': '#c8daec',
11
+ '375': '#bfbfbf',
12
+ '400': '#a3a3a3',
13
+ '500': '#737373',
14
+ '600': '#525252',
15
+ '700': '#404040',
16
+ '800': '#262626',
17
+ '900': '#171717',
18
+ '950': '#0a0a0a'
19
+ };
20
+ export const ebonyClay = {
21
+ '50': '#677084',
22
+ '100': '#5c6880',
23
+ '150': '#58669a',
24
+ '200': '#515c7c',
25
+ '300': '#465178',
26
+ '350': '#43464f',
27
+ '375': '#3f4b5c',
28
+ '400': '#3d4561', // applied from design: filters card bg
29
+ '450': '#333b57',
30
+ '475': '#2b344c',
31
+ '500': '#293245', // applied from design: layout color
32
+ '550': '#262e47',
33
+ '600': '#232b3b', // applied from design: header input bg
34
+ '700': '#1d2331',
35
+ '800': '#171d27',
36
+ '900': '#11171e',
37
+ '950': '#0c111a'
38
+ };
39
+ export const gray = {
40
+ '100': '#f5f5f5',
41
+ '200': '#e5e5e5',
42
+ '300': '#d4d4d4',
43
+ '400': '#a3a3a3',
44
+ '500': '#788195', // applied from design: header text placeholder
45
+ '600': '#525252',
46
+ '700': '#404040',
47
+ '800': '#262626',
48
+ '900': '#3b404c', // applied from design: layout border
49
+ '925': '#36373b',
50
+ '950': '#171717'
51
+ };
52
+ export const red = {
53
+ '50': '#fffaf5',
54
+ '100': '#fcf3eb',
55
+ '200': '#fce0cf',
56
+ '300': '#fac7b1',
57
+ '400': '#f58d7a',
58
+ '500': '#ef4444',
59
+ '600': '#d93636',
60
+ '700': '#b32525',
61
+ '800': '#8f1818',
62
+ '900': '#6b0e0e',
63
+ '950': '#450606'
64
+ };
65
+ export const green = {
66
+ '50': '#fafcf2',
67
+ '100': '#f5fae6',
68
+ '200': '#e5f5c1',
69
+ '300': '#d2ed9d',
70
+ '400': '#a9e05c',
71
+ '500': '#7ed321',
72
+ '600': '#6abf1b',
73
+ '700': '#529e13',
74
+ '800': '#3d800d',
75
+ '900': '#275e07',
76
+ '950': '#163d03'
77
+ };
78
+ export const blue = {
79
+ '50': '#f5fcff',
80
+ '100': '#ebf8ff',
81
+ '200': '#cceafc',
82
+ '300': '#afd9fa',
83
+ '400': '#74b4f7',
84
+ '500': '#3b82f6',
85
+ '600': '#306fdb',
86
+ '700': '#2153b8',
87
+ '800': '#153b94',
88
+ '900': '#0c286e',
89
+ '950': '#051647'
90
+ };
91
+ export const purple = {
92
+ '50': '#fbf7fc',
93
+ '100': '#f5eff8',
94
+ '200': '#ebdef0',
95
+ '300': '#dbc4e3',
96
+ '400': '#c7a1d1',
97
+ '500': '#ad7abb',
98
+ '600': '#915c9d',
99
+ '700': '#72467b',
100
+ '800': '#633e6a',
101
+ '900': '#543659',
102
+ '950': '#341b37'
103
+ };
104
+ export const pink = {
105
+ '50': '#fff7fd',
106
+ '100': '#fcebf7',
107
+ '200': '#facfec',
108
+ '300': '#f7b2df',
109
+ '400': '#f27ec0',
110
+ '500': '#ec4899',
111
+ '600': '#d63c87',
112
+ '700': '#b32965',
113
+ '800': '#8f1b49',
114
+ '900': '#6b0f31',
115
+ '950': '#45061a'
116
+ };
117
+ // This will be our main primary.
118
+ export const azure = {
119
+ '50': '#eef5ff',
120
+ '100': '#d9e8ff',
121
+ '200': '#bcd8ff',
122
+ '300': '#8ec0ff',
123
+ '400': '#599cff',
124
+ '500': '#4482ff', // applied from design: primary button color
125
+ '600': '#1b55f5',
126
+ '750': '#1890ff',
127
+ '700': '#1440e1',
128
+ '800': '#1734b6',
129
+ '900': '#19318f',
130
+ '950': '#142057'
131
+ };
132
+ // This will be our secondary color.
133
+ export const orange = {
134
+ '50': '#fffcf2',
135
+ '100': '#fff8e6',
136
+ '200': '#ffebbf',
137
+ '300': '#fcd997',
138
+ '400': '#fcb44e',
139
+ '500': '#f98003',
140
+ '600': '#e06e02',
141
+ '700': '#ba5202',
142
+ '800': '#963d02',
143
+ '900': '#702900',
144
+ '950': '#471700'
145
+ };
146
+ // Akinon brand color and shades.
147
+ export const akinon = {
148
+ '50': '#fcf2f7',
149
+ '100': '#fae6ef',
150
+ '200': '#f5c4d7',
151
+ '300': '#eda1b9',
152
+ '400': '#de5f77',
153
+ '500': '#d2282e',
154
+ '600': '#bd2025',
155
+ '700': '#9c161a',
156
+ '800': '#7d0e11',
157
+ '900': '#5e080a',
158
+ '950': '#3d0405'
159
+ };
@@ -0,0 +1,2 @@
1
+ export * from './theme';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC"}
@@ -0,0 +1 @@
1
+ export * from './theme';