1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 | :root {
|
7 | --button-primary-size-medium-height: 32px;
|
8 | --button-primary-size-medium-text-padding-x: 12px;
|
9 | --button-primary-size-medium-text-padding-y: 5px;
|
10 | --button-primary-size-large-height: 40px;
|
11 | --button-primary-size-large-text-padding-x: 16px;
|
12 | --button-primary-size-large-text-padding-y: 9px;
|
13 | --button-primary-text-font-family: -apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Lato', 'Helvetica', 'Arial', sans-serif;;
|
14 | --button-primary-text-color-default: #ffffff;
|
15 | --button-primary-text-color-disabled: #ffffff;
|
16 | --button-primary-text-font-weight: 600;
|
17 | --button-primary-text-font-size: 16px;
|
18 | --button-primary-text-line-height: 1.25;
|
19 | --button-primary-background-color-default: #3366cc;
|
20 | --button-primary-background-color-hover: #447ff5;
|
21 | --button-primary-background-color-active: #2a4b8d;
|
22 | --button-primary-background-color-focus: #3366cc;
|
23 | --button-primary-background-color-disabled: #c8ccd1;
|
24 | --button-primary-border-color-default: #3366cc;
|
25 | --button-primary-border-color-hover: #447ff5;
|
26 | --button-primary-border-color-active: #2a4b8d;
|
27 | --button-primary-border-color-focus: #3366cc;
|
28 | --button-primary-border-color-disabled: #c8ccd1;
|
29 | --button-primary-border-radius: 2px;
|
30 | --button-primary-border-width-default: 1px;
|
31 | --button-primary-border-width-increase: 2px;
|
32 | --button-text-line-height: 1.25;
|
33 | --button-text-font-size: 16px;
|
34 | --button-text-font-weight: 600;
|
35 | --button-text-padding-medium-x: 12px;
|
36 | --button-text-padding-medium-y: 5px;
|
37 | --button-text-padding-large-x: 16px;
|
38 | --button-text-padding-large-y: 9px;
|
39 | --button-text-color-positive: #202122;
|
40 | --button-text-color-reversed: #ffffff;
|
41 | --button-height-medium: 32px;
|
42 | --button-height-large: 40px;
|
43 | --button-border-color-disabled: #c8ccd1;
|
44 | --button-background-color-disabled: #c8ccd1;
|
45 | --text-color-base: #202122;
|
46 | --text-color-emphasized: #000000;
|
47 | --text-color-secondary: #72777d;
|
48 | --background-color-unframed-base: #ffffff;
|
49 | --background-color-unframed-hover: #eaecf0;
|
50 | --background-color-unframed-focus: #ffffff;
|
51 | --background-color-unframed-disabled: #eaecf0;
|
52 | --background-color-framed-base: #f8f9fa;
|
53 | --background-color-framed-hover: #ffffff;
|
54 | --background-color-framed-active: #72777d;
|
55 | --background-color-framed-disabled: #c8ccd1;
|
56 | --border-color-base: #a2a9b1;
|
57 | --border-color-hover: #72777d;
|
58 | --border-color-active: #72777d;
|
59 | --border-color-focus: #a2a9b1;
|
60 | --border-color-disabled: #c8ccd1;
|
61 | --border-radius-none: 0px;
|
62 | --border-radius-round: 2px;
|
63 | --border-radius-rounder: 4px;
|
64 | --border-width-thin: 1px;
|
65 | --border-width-thick: 2px;
|
66 | --font-family-sans: -apple-system, 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Lato', 'Helvetica', 'Arial', sans-serif;;
|
67 | --font-family-serif: 'Linux Libertine', 'Georgia', 'Times', serif;;
|
68 | --font-family-monospace: 'Menlo', 'Consolas', 'Liberation Mono', 'Courier New', monospace;;
|
69 | --font-weight-regular: 400;
|
70 | --font-weight-bold: 600;
|
71 | --font-line-height-small: 1.25;
|
72 | --font-line-height-medium: 1.5;
|
73 | --font-line-height-large: 1.6;
|
74 | --color-base-0: #000000;
|
75 | --color-base-10: #202122;
|
76 | --color-base-20: #54595d;
|
77 | --color-base-30: #72777d;
|
78 | --color-base-50: #a2a9b1;
|
79 | --color-base-70: #c8ccd1;
|
80 | --color-base-80: #eaecf0;
|
81 | --color-base-90: #f8f9fa;
|
82 | --color-base-100: #ffffff;
|
83 | --color-accent-30: #2a4b8d;
|
84 | --color-accent-50: #3366cc;
|
85 | --color-accent-90: #eaf3ff;
|
86 | --color-utility-red-30: #b32424;
|
87 | --color-utility-red-50: #dd3333;
|
88 | --color-utility-red-90: #fee7e6;
|
89 | --color-utility-green-30: #14866d;
|
90 | --color-utility-green-50: #00af89;
|
91 | --color-utility-green-90: #d5fdf4;
|
92 | --color-utility-yellow-30: #ac6600;
|
93 | --color-utility-yellow-50: #ffcc33;
|
94 | --color-utility-yellow-90: #fef6e7;
|
95 | --color-interaction-primary-hover: #447ff5;
|
96 | --color-interaction-destructive-active: #d11d13;
|
97 | --dimension-font-size-xsmall: 13px;
|
98 | --dimension-font-size-small: 14px;
|
99 | --dimension-font-size-medium: 16px;
|
100 | --dimension-font-size-large: 18px;
|
101 | --dimension-font-size-xlarge: 20px;
|
102 | --dimension-font-size-xxlarge: 24px;
|
103 | --dimension-font-size-xxxlarge: 32px;
|
104 | --dimension-static-size-0: 0px;
|
105 | --dimension-static-size-10: 1px;
|
106 | --dimension-static-size-25: 2px;
|
107 | --dimension-static-size-50: 4px;
|
108 | --dimension-static-size-65: 5px;
|
109 | --dimension-static-size-100: 8px;
|
110 | --dimension-static-size-110: 9px;
|
111 | --dimension-static-size-150: 12px;
|
112 | --dimension-static-size-200: 16px;
|
113 | --dimension-static-size-250: 20px;
|
114 | --dimension-static-size-300: 24px;
|
115 | --dimension-static-size-400: 32px;
|
116 | --dimension-static-size-500: 40px;
|
117 | --transition-duration-fast: 100ms;
|
118 | --transition-duration-regular: 200ms;
|
119 | --transition-duration-slower: 300ms;
|
120 | --transition-duration-slowest: 400ms;
|
121 | }
|