UNPKG

6.49 kBTypeScriptView Raw
1import { Omit } from './common-types';
2interface ColorVariants {
3 main: string;
4 light?: string;
5 dark?: string;
6 semilight?: string;
7}
8export declare const breakpoints: number[];
9export declare const space: number[];
10export declare const fontSizes: number[];
11export declare const weights: number[];
12export declare const radius = 3;
13export declare const font = "'Source Sans Pro', Arial, sans-serif";
14export declare const monospace = "'Ubuntu Mono', 'Courier New', monospace";
15export declare const lineHeight = 1.5;
16export declare const header: {
17 height: string;
18};
19declare const theme: {
20 breakpoints: number[];
21 space: number[];
22 fontSizes: number[];
23 weights: number[];
24 font: string;
25 monospace: string;
26 lineHeight: number;
27 colors: {
28 primary: {
29 main: string;
30 semilight: string;
31 light: string;
32 dark: string;
33 };
34 secondary: {
35 main: string;
36 semilight: string;
37 light: string;
38 dark: string;
39 };
40 tertiary: {
41 main: string;
42 light: string;
43 semilight: string;
44 dark: string;
45 };
46 quartenary: {
47 main: string;
48 light: string;
49 dark: string;
50 };
51 danger: {
52 main: string;
53 semilight: string;
54 light: string;
55 dark: string;
56 };
57 warning: {
58 main: string;
59 semilight: string;
60 light: string;
61 dark: string;
62 };
63 success: {
64 main: string;
65 semilight: string;
66 light: string;
67 dark: string;
68 };
69 info: {
70 main: string;
71 semilight: string;
72 light: string;
73 dark: string;
74 };
75 text: {
76 main: string;
77 light: string;
78 dark: string;
79 };
80 statusIdle: {
81 main: string;
82 };
83 statusConfiguring: {
84 main: string;
85 };
86 statusUpdating: {
87 main: string;
88 };
89 statusPostProvisioning: {
90 main: string;
91 };
92 statusOffline: {
93 main: string;
94 };
95 statusInactive: {
96 main: string;
97 };
98 gray: {
99 main: string;
100 light: string;
101 dark: string;
102 };
103 };
104 radius: number;
105 header: {
106 height: string;
107 };
108 global: {
109 font: {
110 family: string;
111 size: string;
112 height: number;
113 };
114 control: {
115 disabled: {
116 opacity: number;
117 };
118 border: {
119 radius: string;
120 color: string;
121 };
122 };
123 colors: {
124 focus: undefined;
125 placeholder: string;
126 };
127 focus: {
128 outline: {
129 color: string;
130 size: string;
131 };
132 };
133 selected: {
134 background: string;
135 };
136 hover: {
137 background: {
138 color: string;
139 opacity: number;
140 };
141 color: {
142 dark: string;
143 light: string;
144 };
145 };
146 active: {
147 background: {
148 color: string;
149 opacity: number;
150 };
151 color: {
152 dark: string;
153 light: string;
154 };
155 };
156 drop: {
157 border: {
158 radius: string;
159 };
160 zIndex: number;
161 extend: string;
162 };
163 input: {
164 weight: string | number;
165 };
166 };
167 button: {
168 height: string;
169 font: {
170 weight: string | number;
171 size: string;
172 };
173 border: {
174 width: string;
175 radius: string;
176 color: string;
177 };
178 padding: {
179 horizontal: string;
180 };
181 };
182 navBar: {
183 font: {
184 size: string;
185 };
186 };
187 radioButton: {
188 border: {
189 width: string;
190 color: {
191 dark: string;
192 light: string;
193 };
194 };
195 hover: {
196 border: {
197 color: {
198 dark: string;
199 light: string;
200 };
201 };
202 };
203 check: {
204 color: {
205 dark: string;
206 light: string;
207 };
208 };
209 icon: {
210 size: string;
211 };
212 gap: string;
213 size: string;
214 };
215 select: {
216 icons: {
217 color: string;
218 };
219 control: {
220 extend: string;
221 };
222 };
223 layer: {
224 container: {
225 zIndex: number;
226 };
227 zIndex: number;
228 };
229 text: {
230 medium: {
231 size: string;
232 height: number;
233 };
234 };
235 tab: {
236 extend: string;
237 color: string;
238 margin: string;
239 border: {
240 size: string;
241 color: string;
242 active: {
243 color: string;
244 };
245 hover: {
246 color: string;
247 };
248 };
249 hover: {
250 color: string;
251 };
252 active: {
253 color: string;
254 };
255 };
256 checkBox: {
257 size: string;
258 color: string;
259 border: {
260 color: {
261 dark: string;
262 light: string;
263 };
264 width: string;
265 };
266 check: {
267 radius: string;
268 thickness: string;
269 };
270 hover: {
271 border: {
272 color: {
273 dark: string;
274 light: string;
275 };
276 };
277 };
278 toggle: {
279 color: {
280 dark: string;
281 light: string;
282 };
283 radius: string;
284 size: string;
285 knob: {};
286 };
287 };
288 accordion: {
289 border: {
290 side: string;
291 };
292 };
293};
294export default theme;
295export interface Theme extends Omit<typeof theme, 'colors'> {
296 header: {
297 height: string;
298 };
299 colors: Record<string, ColorVariants>;
300}