UNPKG

7.77 kBtext/lessView Raw
1/*
2 * Copyright 2021 Palantir Technologies, Inc. All rights reserved.
3 */
4
5@black: #10161a;
6
7@dark-gray1: #182026;
8@dark-gray2: #202b33;
9@dark-gray3: #293742;
10@dark-gray4: #30404d;
11@dark-gray5: #394b59;
12
13@gray1: #5c7080;
14@gray2: #738694;
15@gray3: #8a9ba8;
16@gray4: #a7b6c2;
17@gray5: #bfccd6;
18
19@light-gray1: #ced9e0;
20@light-gray2: #d8e1e8;
21@light-gray3: #e1e8ed;
22@light-gray4: #ebf1f5;
23@light-gray5: #f5f8fa;
24
25@white: #ffffff;
26
27@blue1: #0e5a8a;
28@blue2: #106ba3;
29@blue3: #137cbd;
30@blue4: #2b95d6;
31@blue5: #48aff0;
32
33@green1: #0a6640;
34@green2: #0d8050;
35@green3: #0f9960;
36@green4: #15b371;
37@green5: #3dcc91;
38
39@orange1: #a66321;
40@orange2: #bf7326;
41@orange3: #d9822b;
42@orange4: #f29d49;
43@orange5: #ffb366;
44
45@red1: #a82a2a;
46@red2: #c23030;
47@red3: #db3737;
48@red4: #f55656;
49@red5: #ff7373;
50
51@vermilion1: #9e2b0e;
52@vermilion2: #b83211;
53@vermilion3: #d13913;
54@vermilion4: #eb532d;
55@vermilion5: #ff6e4a;
56
57@rose1: #a82255;
58@rose2: #c22762;
59@rose3: #db2c6f;
60@rose4: #f5498b;
61@rose5: #ff66a1;
62
63@violet1: #5c255c;
64@violet2: #752f75;
65@violet3: #8f398f;
66@violet4: #a854a8;
67@violet5: #c274c2;
68
69@indigo1: #5642a6;
70@indigo2: #634dbf;
71@indigo3: #7157d9;
72@indigo4: #9179f2;
73@indigo5: #ad99ff;
74
75@cobalt1: #1f4b99;
76@cobalt2: #2458b3;
77@cobalt3: #2965cc;
78@cobalt4: #4580e6;
79@cobalt5: #669eff;
80
81@turquoise1: #008075;
82@turquoise2: #00998c;
83@turquoise3: #00b3a4;
84@turquoise4: #14ccbd;
85@turquoise5: #2ee6d6;
86
87@forest1: #1d7324;
88@forest2: #238c2c;
89@forest3: #29a634;
90@forest4: #43bf4d;
91@forest5: #62d96b;
92
93@lime1: #728c23;
94@lime2: #87a629;
95@lime3: #9bbf30;
96@lime4: #b6d94c;
97@lime5: #d1f26d;
98
99@gold1: #a67908;
100@gold2: #bf8c0a;
101@gold3: #d99e0b;
102@gold4: #f2b824;
103@gold5: #ffc940;
104
105@sepia1: #63411e;
106@sepia2: #7d5125;
107@sepia3: #96622d;
108@sepia4: #b07b46;
109@sepia5: #c99765;
110
111@pt-intent-primary: @blue3;
112@pt-intent-success: @green3;
113@pt-intent-warning: @orange3;
114@pt-intent-danger: @red3;
115
116@pt-app-background-color: @light-gray5;
117@pt-dark-app-background-color: @dark-gray3;
118
119@pt-outline-color: fade(@blue3, 60%);
120
121@pt-text-color: @dark-gray1;
122@pt-text-color-muted: @gray1;
123@pt-text-color-disabled: fade(@pt-text-color-muted, 60%);
124@pt-heading-color: @pt-text-color;
125@pt-link-color: @blue2;
126@pt-dark-text-color: @light-gray5;
127@pt-dark-text-color-muted: @gray4;
128@pt-dark-text-color-disabled: fade(@pt-dark-text-color-muted, 60%);
129@pt-dark-heading-color: @pt-dark-text-color;
130@pt-dark-link-color: @blue5;
131@pt-text-selection-color: rgba(125, 188, 255, 0.6);
132
133@pt-icon-color: @pt-text-color-muted;
134@pt-icon-color-hover: @pt-text-color;
135@pt-icon-color-disabled: @pt-text-color-disabled;
136@pt-icon-color-selected: @pt-intent-primary;
137@pt-dark-icon-color: @pt-dark-text-color-muted;
138@pt-dark-icon-color-hover: @pt-dark-text-color;
139@pt-dark-icon-color-disabled: @pt-dark-text-color-disabled;
140@pt-dark-icon-color-selected: @pt-intent-primary;
141
142@pt-divider-black: fade(@black, 15%);
143@pt-dark-divider-black: fade(@black, 40%);
144@pt-dark-divider-white: fade(@white, 15%);
145
146@pt-code-text-color: @pt-text-color-muted;
147@pt-dark-code-text-color: @pt-dark-text-color-muted;
148@pt-code-background-color: fade(@white, 70%);
149@pt-dark-code-background-color: fade(@black, 30%);
150
151@cerulean1: @cobalt1;
152@cerulean2: @cobalt2;
153@cerulean3: @cobalt3;
154@cerulean4: @cobalt4;
155@cerulean5: @cobalt5;
156@ns: bp3;
157@bp-ns: @ns;
158
159@pt-grid-size: 10px;
160
161@pt-font-family: -apple-system,
162 "BlinkMacSystemFont",
163 "Segoe UI",
164 "Roboto",
165 "Oxygen",
166 "Ubuntu",
167 "Cantarell",
168 "Open Sans",
169 "Helvetica Neue",
170 "Icons16", sans-serif;
171
172@pt-font-family-monospace: monospace;
173
174@pt-font-size: @pt-grid-size * 1.4;
175@pt-font-size-large: @pt-grid-size * 1.6;
176@pt-font-size-small: @pt-grid-size * 1.2;
177
178@pt-line-height: (@pt-grid-size * 1.8) / @pt-font-size + 0.0001;
179
180@icons16-family: "Icons16";
181@icons20-family: "Icons20";
182
183@pt-icon-size-standard: 16px;
184@pt-icon-size-large: 20px;
185
186@pt-border-radius: floor(@pt-grid-size / 3);
187
188@pt-button-height: @pt-grid-size * 3;
189@pt-button-height-small: @pt-grid-size * 2.4;
190@pt-button-height-smaller: @pt-grid-size * 2;
191@pt-button-height-large: @pt-grid-size * 4;
192
193@pt-input-height: @pt-grid-size * 3;
194@pt-input-height-large: @pt-grid-size * 4;
195@pt-input-height-small: @pt-grid-size * 2.4;
196
197@pt-navbar-height: @pt-grid-size * 5;
198
199@pt-z-index-base: 0;
200@pt-z-index-content: @pt-z-index-base + 10;
201@pt-z-index-overlay: @pt-z-index-content + 10;
202@pt-z-index-dialog-header: @pt-z-index-overlay + 10;
203
204@pt-border-shadow-opacity: 0.1;
205@pt-drop-shadow-opacity: 0.2;
206@pt-dark-border-shadow-opacity: @pt-border-shadow-opacity * 2;
207@pt-dark-drop-shadow-opacity: @pt-drop-shadow-opacity * 2;
208
209@pt-elevation-shadow-0: 0 0 0 1px @pt-divider-black,
210 0 0 0 fade(@black, 0%),
211 0 0 0 fade(@black, 0%);
212@pt-elevation-shadow-1: 0 0 0 1px fade(@black, @pt-border-shadow-opacity * 100%),
213 0 0 0 fade(@black, 0%),
214 0 1px 1px fade(@black, @pt-drop-shadow-opacity * 100%);
215@pt-elevation-shadow-2: 0 0 0 1px fade(@black, @pt-border-shadow-opacity * 100%),
216 0 1px 1px fade(@black, @pt-drop-shadow-opacity * 100%),
217 0 2px 6px fade(@black, @pt-drop-shadow-opacity * 100%);
218@pt-elevation-shadow-3: 0 0 0 1px fade(@black, @pt-border-shadow-opacity * 100%),
219 0 2px 4px fade(@black, @pt-drop-shadow-opacity * 100%),
220 0 8px 24px fade(@black, @pt-drop-shadow-opacity * 100%);
221@pt-elevation-shadow-4: 0 0 0 1px fade(@black, @pt-border-shadow-opacity * 100%),
222 0 4px 8px fade(@black, @pt-drop-shadow-opacity * 100%),
223 0 18px 46px 6px fade(@black, @pt-drop-shadow-opacity * 100%);
224
225@pt-dark-elevation-shadow-0: 0 0 0 1px @pt-dark-divider-black,
226 0 0 0 fade(@black, 0%),
227 0 0 0 fade(@black, 0%);
228@pt-dark-elevation-shadow-1: 0 0 0 1px fade(@black, @pt-dark-border-shadow-opacity * 100%),
229 0 0 0 fade(@black, 0%),
230 0 1px 1px fade(@black, @pt-dark-drop-shadow-opacity * 100%);
231@pt-dark-elevation-shadow-2: 0 0 0 1px fade(@black, @pt-dark-border-shadow-opacity * 100%),
232 0 1px 1px fade(@black, @pt-dark-drop-shadow-opacity * 100%),
233 0 2px 6px fade(@black, @pt-dark-drop-shadow-opacity * 100%);
234@pt-dark-elevation-shadow-3: 0 0 0 1px fade(@black, @pt-dark-border-shadow-opacity * 100%),
235 0 2px 4px fade(@black, @pt-dark-drop-shadow-opacity * 100%),
236 0 8px 24px fade(@black, @pt-dark-drop-shadow-opacity * 100%);
237@pt-dark-elevation-shadow-4: 0 0 0 1px fade(@black, @pt-dark-border-shadow-opacity * 100%),
238 0 4px 8px fade(@black, @pt-dark-drop-shadow-opacity * 100%),
239 0 18px 46px 6px fade(@black, @pt-dark-drop-shadow-opacity * 100%);
240
241@pt-transition-ease: cubic-bezier(0.4, 1, 0.75, 0.9);
242@pt-transition-ease-bounce: cubic-bezier(0.54, 1.12, 0.38, 1.11);
243@pt-transition-duration: 100ms;
244
245@pt-input-box-shadow: inset 0 0 0 1px fade(@black, 15%),
246 inset 0 1px 1px fade(@black, @pt-drop-shadow-opacity * 100%);
247
248@pt-dialog-box-shadow: @pt-elevation-shadow-4;
249@pt-popover-box-shadow: @pt-elevation-shadow-3;
250@pt-tooltip-box-shadow: @pt-popover-box-shadow;
251
252@pt-dark-input-box-shadow: inset 0 0 0 1px fade(@black, 30%),
253 inset 0 1px 1px fade(@black, @pt-dark-drop-shadow-opacity * 100%);
254
255@pt-dark-dialog-box-shadow: @pt-dark-elevation-shadow-4;
256@pt-dark-popover-box-shadow: @pt-dark-elevation-shadow-3;
257@pt-dark-tooltip-box-shadow: @pt-dark-popover-box-shadow;