@txdfe/at-theme 1.1.6 → 2.0.0-compatiable

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.
Files changed (6) hide show
  1. package/package.json +1 -1
  2. package/teambition/css/index.css +51 -136
  3. package/teambition/js/index.js +51 -139
  4. package/teambition/less/index.less +51 -136
  5. package/teambition/scss/variables/color.scss +48 -181
  6. package/teambition/scss/variables/shadow.scss +4 -4
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@txdfe/at-theme",
3
- "version": "1.1.6",
3
+ "version": "2.0.0-compatiable",
4
4
  "description": "at主题包",
5
5
  "scripts": {
6
6
  "test": "echo \"Error: no test specified\" && exit 1",
package/teambition/css/index.css CHANGED
@@ -151,50 +151,50 @@
151
151
  --S52: 52px;
152
152
  --S56: 56px;
153
153
  --S80: 80px;
154
- --highlight-brand: var(--XDS_blue4_color);
155
- --bright-brand: var(--XDS_blue3_color);
156
- --border-brand: var(--XDS_blue2_color);
157
- --primary-brand: var(--XDS_blue1_color);
158
- --hover-brand: var(--XDS_blue1_hover_color);
159
- --click-brand: var(--XDS_blue1_active_color);
160
- --heavy-brand: var(--XDS_blue1_click_color);
161
- --highlight-danger: var(--XDS_red4_color);
162
- --bright-danger: var(--XDS_red3_color);
163
- --border-danger: var(--XDS_red2_color);
164
- --primary-danger: var(--XDS_red1_color);
165
- --hover-danger: var(--XDS_red1_hover_color);
166
- --click-danger: var(--XDS_red1_active_color);
167
- --heavy-danger: var(--XDS_red1_click_color);
168
- --highlight-warning: var(--XDS_orange4_color);
169
- --bright-warning: var(--XDS_orange3_color);
170
- --border-warning: var(--XDS_orange2_color);
171
- --primary-warning: var(--XDS_orange1_color);
172
- --hover-warning: var(--XDS_orange1_hover_color);
173
- --click-warning: var(--XDS_orange1_active_color);
174
- --heavy-warning: var(--XDS_orange1_click_color);
175
- --highlight-alert: var(--XDS_yellow4_color);
176
- --bright-alert: var(--XDS_yellow3_color);
177
- --border-alert: var(--XDS_yellow2_color);
178
- --primary-alert: var(--XDS_yellow1_color);
179
- --hover-alert: var(--XDS_yellow1_hover_color);
180
- --click-alert: var(--XDS_yellow1_active_color);
181
- --heavy-alert: var(--XDS_yellow1_click_color);
182
- --highlight-success: var(--XDS_green4_color);
183
- --bright-success: var(--XDS_green3_color);
184
- --border-success: var(--XDS_green2_color);
185
- --primary-success: var(--XDS_green1_color);
186
- --hover-success: var(--XDS_green1_hover_color);
187
- --click-success: var(--XDS_green1_active_color);
188
- --heavy-success: var(--XDS_green1_click_color);
154
+ --highlight-brand: #f2fbff;
155
+ --bright-brand: #ccecff;
156
+ --border-brand: #87d2ff;
157
+ --primary-brand: #1b9aee;
158
+ --hover-brand: #0171c2;
159
+ --click-brand: #004f8a;
160
+ --heavy-brand: #002e52;
161
+ --highlight-danger: #ffeded;
162
+ --bright-danger: #ffcccc;
163
+ --border-danger: #f87872;
164
+ --primary-danger: #e62412;
165
+ --hover-danger: #c21c07;
166
+ --click-danger: #9a1604;
167
+ --heavy-danger: #800f00;
168
+ --highlight-warning: #fff7e6;
169
+ --bright-warning: #ffd591;
170
+ --border-warning: #ffa941;
171
+ --primary-warning: #fa8c15;
172
+ --hover-warning: #d46b08;
173
+ --click-warning: #ad4e01;
174
+ --heavy-warning: #8f4000;
175
+ --highlight-alert: #ffffe3;
176
+ --bright-alert: #fff88f;
177
+ --border-alert: #ffe53e;
178
+ --primary-alert: #fad414;
179
+ --hover-alert: #d4ab06;
180
+ --click-alert: #ad8500;
181
+ --heavy-alert: #946c00;
182
+ --highlight-success: #edffed;
183
+ --bright-success: #cafac8;
184
+ --border-success: #64d16d;
185
+ --primary-success: #15ad31;
186
+ --hover-success: #038a24;
187
+ --click-success: #006d1f;
188
+ --heavy-success: #00591c;
189
189
  --snow: #ffffff;
190
- --gray-01: var(--XDS_bg_color);
191
- --gray-02: var(--XDS_line_light_color);
192
- --gray-03: var(--XDS_line_hard_color);
193
- --gray-04: var(--XDS_line_hard_color);
194
- --gray-05: var(--XDS_level4_base_color);
195
- --gray-06: var(--XDS_level3_base_color);
196
- --gray-07: var(--XDS_level2_base_color);
197
- --gray-08: var(--XDS_level1_base_color);
190
+ --gray-01: #f7f7f7;
191
+ --gray-02: #f0f0f0;
192
+ --gray-03: #e5e5e5;
193
+ --gray-04: #d9d9d9;
194
+ --gray-05: #bfbfbf;
195
+ --gray-06: #8c8c8c;
196
+ --gray-07: #595959;
197
+ --gray-08: #262626;
198
198
  --shadow-color: #000000;
199
199
  --dashboard-01: #fab34f;
200
200
  --dashboard-02: #ff656b;
@@ -211,96 +211,11 @@
211
211
  --placeholder-06: #29b3f0;
212
212
  --placeholder-07: #3885ea;
213
213
  --background-fill: #ffffff;
214
- --background-nav-search: rgba(0, 0, 0, 0);
215
- --background-section: var(--XDS_fg_z1_color);
216
- --background-layout: var(--XDS_fg_color);
217
- --background-overlay: var(--XDS_fg_z1_color);
214
+ --background-nav-search: #f7f7f7;
215
+ --background-section: #ffffff;
216
+ --background-layout: #f7f7f7;
217
+ --background-overlay: #f0f0f0;
218
218
  --background-switch-trigger: #ffffff;
219
- --background-base: var(--XDS_bg_base);
220
- --cell-line-hover: var(--XDS_line_hover_color);
221
- --cell-line-active: var(--XDS_line_hard_color);
222
- --tab-wrapped-bg-color-hover: rgba(0, 0, 0, 0);
223
- --tab-wrapped-bg-color: rgba(0, 0, 0, 0);
224
- --tab-wrapped-bg-color-selected: var(--XDS_fg_color);
225
- --step-dot-item-tail-wait-color: var(--XDS_line_hard_color);
226
- --step-dot-item-tail-process-color: var(--XDS_line_hard_color);
227
- --step-dot-item-tail-disabled-color: var(--XDS_line_hard_color);
228
- --step-circle-item-tail-wait-color: var(--XDS_line_hard_color);
229
- --step-circle-item-tail-process-color: var(--XDS_line_hard_color);
230
- --step-circle-item-tail-disabled-color: var(--XDS_line_hard_color);
231
- --pagination-item-bg: rgba(0, 0, 0, 0);
232
- --nav-normal-bg-color: rgba(0, 0, 0, 0);
233
- --nav-normal-sub-nav-bg-color: rgba(0, 0, 0, 0);
234
- --nav-primary-text-color: var(--XDS_fg_color);
235
- --nav-primary-sub-nav-text-color: var(--XDS_fg_color);
236
- --nav-primary-group-text-color: var(--XDS_fg_color);
237
- --nav-primary-item-hover-text-color: var(--XDS_fg_color);
238
- --nav-primary-sub-nav-hover-text-color: var(--XDS_fg_color);
239
- --nav-primary-item-selected-text-color: var(--XDS_fg_color);
240
- --nav-primary-sub-nav-selected-text-color: var(--XDS_fg_color);
241
- --nav-primary-item-opened-text-color: var(--XDS_fg_color);
242
- --nav-primary-item-opened-bg-color: var(--XDS_line_hover_color);
243
- --nav-primary-sub-nav-selected-bg-color: var(--XDS_line_hard_color);
244
- --nav-primary-sub-nav-bg-color: rgba(0, 0, 0, 0);
245
- --table-row-hover-bg: var(--XDS_line_hover_color);
246
- --menu-background-hover: var(--XDS_line_hover_color);
247
- --menu-background-selected: var(--XDS_line_hard_color);
248
- --menu-background-focus: var(--XDS_line_hard_color);
249
- --menu-divider-color: var(--XDS_line_hard_color);
250
- --input-bg-color: rgba(0, 0, 0, 0);
251
- --input-focus-bg-color: rgba(0, 0, 0, 0);
252
- --input-hover-bg-color: rgba(0, 0, 0, 0);
253
- --input-disabled-bg-color: var(--XDS_line_hard_color);
254
- --input-addon-bg-color: var(--XDS_line_hover_color);
255
- --tag-closable-primary-fill-bg-color: var(--XDS_line_hard_color);
256
- --tag-closable-primary-fill-bg-color-hover: var(--XDS_line_hard_color);
257
- --tag-closable-primary-fill-bg-color-disabled: var(--XDS_line_hard_color);
258
- --tag-closable-primary-fill-border-color-hover: var(--XDS_line_hover_color);
259
- --tag-closable-primary-fill-border-color-disabled: var(--XDS_line_hover_color);
260
- --tag-closable-primary-fill-text-color-disabled: var(--XDS_level4_base_color);
261
- --transfer-panel-header-background-color: var(--XDS_line_hover_color);
262
- --switch-disabled-on-bg-color: var(--XDS_line_hard_color);
263
- --search-nav-search-bg-color: var(--XDS_line_hover_color);
264
- --range-normal-slider-bg-color: #ffffff;
265
- --range-normal-slider-bg-color-hover: #ffffff;
266
- --radio-bg-color: rgba(0, 0, 0, 0);
267
- --radio-disabled-bg-color: var(--XDS_line_hard_color);
268
- --calendar-card-table-cell-disabled-background: var(--XDS_line_hover_color);
269
- --calendar-fullscreen-table-cell-disabled-background: var(--XDS_line_hover_color);
270
- --checkbox-bg-color: rgba(0, 0, 0, 0);
271
- --checkbox-disabled-bg-color: var(--XDS_line_hard_color);
272
- --balloon-tooltip-color-primary-bg: rgba(0, 0, 0, 0.9) !important;
273
- --balloon-tooltip-color-normal-bg: 'var(--XDS_fg_z1_color)', '!important';
274
- --balloon-tooltip-color-normal: var(--XDS_level1_base_color);
275
- --balloon-tooltip-color-primary: #ffffff;
276
- --btn-warning-primary-bg-disabled: var(--XDS_line_hard_color);
277
- --btn-warning-primary-color-disabled: var(--XDS_level4_base_color);
278
- --btn-warning-primary-border-color-disabled: rgba(0, 0, 0, 0);
279
- --btn-pure-color-disabled: var(--XDS_level4_base_color);
280
- --btn-pure-bg-disabled: var(--XDS_line_hard_color);
281
- --btn-pure-border-color-disabled: var(--XDS_line_hard_color);
282
- --btn-ghost-dark-bg-normal: rgba(0, 0, 0, 0);
283
- --btn-ghost-dark-color: var(--XDS_level1_base_color);
284
- --btn-ghost-dark-color-hover: var(--XDS_level1_base_color);
285
- --btn-ghost-dark-color-active: var(--XDS_level1_base_color);
286
- --btn-ghost-dark-border-color-active: var(--XDS_level1_base_color);
287
- --btn-ghost-dark-border-color-hover: var(--XDS_level1_base_color);
288
- --btn-ghost-dark-border-color: var(--XDS_level1_base_color);
289
- --btn-ghost-dark-bg-hover: var(--XDS_line_hover_color);
290
- --btn-ghost-dark-bg-active: var(--XDS_line_hard_color);
291
- --btn-ghost-dark-color-disabled: var(--XDS_level4_base_color);
292
- --btn-ghost-dark-border-color-disabled: var(--XDS_level4_base_color);
293
- --btn-ghost-light-bg-normal: rgba(0, 0, 0, 0);
294
- --btn-ghost-light-border-color: var(--XDS_fg_z1_color);
295
- --btn-ghost-light-color: var(--XDS_fg_z1_color);
296
- --btn-ghost-light-color-active: var(--XDS_fg_z1_color);
297
- --btn-ghost-light-color-hover: var(--XDS_fg_z1_color);
298
- --btn-ghost-light-border-color-active: var(--XDS_fg_z1_color);
299
- --btn-ghost-light-border-color-hover: var(--XDS_fg_z1_color);
300
- --btn-ghost-light-bg-hover: var(--XDS_line_hover_color);
301
- --btn-ghost-light-bg-active: var(--XDS_line_hard_color);
302
- --btn-ghost-light-color-disabled: var(--XDS_level4_base_color);
303
- --btn-ghost-light-border-color-disabled: var(--XDS_level4_base_color);
304
219
  --font-size-caption: 12px;
305
220
  --font-size-body: 14px;
306
221
  --font-size-subhead: 14px;
@@ -326,10 +241,10 @@
326
241
  --shape-radius: 4px;
327
242
  --shape-checkbox: 2px;
328
243
  --shape-circular: 50%;
329
- --shadow-01: var(--XDS_shadow_small);
330
- --shadow-02: var(--XDS_shadow_card);
331
- --shadow-03: var(--XDS_shadow_bold_card);
332
- --shadow-04: var(--XDS_shadow_bold_card);
244
+ --shadow-01: 0 1px 3px 0 rgba(38, 38, 38, 0.1);
245
+ --shadow-02: 0 4px 16px 0 rgba(38, 38, 38, 0.12);
246
+ --shadow-03: 0 12px 32px 0 rgba(38, 38, 38, 0.16);
247
+ --shadow-04: 0 18px 42px 0 rgba(38, 38, 38, 0.2);
333
248
  --AT_THEME: teambition;
334
249
  --AT_THEME_TYPE: light;
335
250
  }
package/teambition/js/index.js CHANGED
@@ -153,50 +153,50 @@ module.exports = {
153
153
  S52: "52px",
154
154
  S56: "56px",
155
155
  S80: "80px",
156
- "highlight-brand": "var(--XDS_blue4_color)",
157
- "bright-brand": "var(--XDS_blue3_color)",
158
- "border-brand": "var(--XDS_blue2_color)",
159
- "primary-brand": "var(--XDS_blue1_color)",
160
- "hover-brand": "var(--XDS_blue1_hover_color)",
161
- "click-brand": "var(--XDS_blue1_active_color)",
162
- "heavy-brand": "var(--XDS_blue1_click_color)",
163
- "highlight-danger": "var(--XDS_red4_color)",
164
- "bright-danger": "var(--XDS_red3_color)",
165
- "border-danger": "var(--XDS_red2_color)",
166
- "primary-danger": "var(--XDS_red1_color)",
167
- "hover-danger": "var(--XDS_red1_hover_color)",
168
- "click-danger": "var(--XDS_red1_active_color)",
169
- "heavy-danger": "var(--XDS_red1_click_color)",
170
- "highlight-warning": "var(--XDS_orange4_color)",
171
- "bright-warning": "var(--XDS_orange3_color)",
172
- "border-warning": "var(--XDS_orange2_color)",
173
- "primary-warning": "var(--XDS_orange1_color)",
174
- "hover-warning": "var(--XDS_orange1_hover_color)",
175
- "click-warning": "var(--XDS_orange1_active_color)",
176
- "heavy-warning": "var(--XDS_orange1_click_color)",
177
- "highlight-alert": "var(--XDS_yellow4_color)",
178
- "bright-alert": "var(--XDS_yellow3_color)",
179
- "border-alert": "var(--XDS_yellow2_color)",
180
- "primary-alert": "var(--XDS_yellow1_color)",
181
- "hover-alert": "var(--XDS_yellow1_hover_color)",
182
- "click-alert": "var(--XDS_yellow1_active_color)",
183
- "heavy-alert": "var(--XDS_yellow1_click_color)",
184
- "highlight-success": "var(--XDS_green4_color)",
185
- "bright-success": "var(--XDS_green3_color)",
186
- "border-success": "var(--XDS_green2_color)",
187
- "primary-success": "var(--XDS_green1_color)",
188
- "hover-success": "var(--XDS_green1_hover_color)",
189
- "click-success": "var(--XDS_green1_active_color)",
190
- "heavy-success": "var(--XDS_green1_click_color)",
156
+ "highlight-brand": "#f2fbff",
157
+ "bright-brand": "#ccecff",
158
+ "border-brand": "#87d2ff",
159
+ "primary-brand": "#1b9aee",
160
+ "hover-brand": "#0171c2",
161
+ "click-brand": "#004f8a",
162
+ "heavy-brand": "#002e52",
163
+ "highlight-danger": "#ffeded",
164
+ "bright-danger": "#ffcccc",
165
+ "border-danger": "#f87872",
166
+ "primary-danger": "#e62412",
167
+ "hover-danger": "#c21c07",
168
+ "click-danger": "#9a1604",
169
+ "heavy-danger": "#800f00",
170
+ "highlight-warning": "#fff7e6",
171
+ "bright-warning": "#ffd591",
172
+ "border-warning": "#ffa941",
173
+ "primary-warning": "#fa8c15",
174
+ "hover-warning": "#d46b08",
175
+ "click-warning": "#ad4e01",
176
+ "heavy-warning": "#8f4000",
177
+ "highlight-alert": "#ffffe3",
178
+ "bright-alert": "#fff88f",
179
+ "border-alert": "#ffe53e",
180
+ "primary-alert": "#fad414",
181
+ "hover-alert": "#d4ab06",
182
+ "click-alert": "#ad8500",
183
+ "heavy-alert": "#946c00",
184
+ "highlight-success": "#edffed",
185
+ "bright-success": "#cafac8",
186
+ "border-success": "#64d16d",
187
+ "primary-success": "#15ad31",
188
+ "hover-success": "#038a24",
189
+ "click-success": "#006d1f",
190
+ "heavy-success": "#00591c",
191
191
  snow: "#ffffff",
192
- "gray-01": "var(--XDS_bg_color)",
193
- "gray-02": "var(--XDS_line_light_color)",
194
- "gray-03": "var(--XDS_line_hard_color)",
195
- "gray-04": "var(--XDS_line_hard_color)",
196
- "gray-05": "var(--XDS_level4_base_color)",
197
- "gray-06": "var(--XDS_level3_base_color)",
198
- "gray-07": "var(--XDS_level2_base_color)",
199
- "gray-08": "var(--XDS_level1_base_color)",
192
+ "gray-01": "#f7f7f7",
193
+ "gray-02": "#f0f0f0",
194
+ "gray-03": "#e5e5e5",
195
+ "gray-04": "#d9d9d9",
196
+ "gray-05": "#bfbfbf",
197
+ "gray-06": "#8c8c8c",
198
+ "gray-07": "#595959",
199
+ "gray-08": "#262626",
200
200
  "shadow-color": "#000000",
201
201
  "dashboard-01": "#fab34f",
202
202
  "dashboard-02": "#ff656b",
@@ -213,99 +213,11 @@ module.exports = {
213
213
  "placeholder-06": "#29b3f0",
214
214
  "placeholder-07": "#3885ea",
215
215
  "background-fill": "#ffffff",
216
- "background-nav-search": "rgba(0, 0, 0, 0)",
217
- "background-section": "var(--XDS_fg_z1_color)",
218
- "background-layout": "var(--XDS_fg_color)",
219
- "background-overlay": "var(--XDS_fg_z1_color)",
216
+ "background-nav-search": "#f7f7f7",
217
+ "background-section": "#ffffff",
218
+ "background-layout": "#f7f7f7",
219
+ "background-overlay": "#f0f0f0",
220
220
  "background-switch-trigger": "#ffffff",
221
- "background-base": "var(--XDS_bg_base)",
222
- "cell-line-hover": "var(--XDS_line_hover_color)",
223
- "cell-line-active": "var(--XDS_line_hard_color)",
224
- "tab-wrapped-bg-color-hover": "rgba(0, 0, 0, 0)",
225
- "tab-wrapped-bg-color": "rgba(0, 0, 0, 0)",
226
- "tab-wrapped-bg-color-selected": "var(--XDS_fg_color)",
227
- "step-dot-item-tail-wait-color": "var(--XDS_line_hard_color)",
228
- "step-dot-item-tail-process-color": "var(--XDS_line_hard_color)",
229
- "step-dot-item-tail-disabled-color": "var(--XDS_line_hard_color)",
230
- "step-circle-item-tail-wait-color": "var(--XDS_line_hard_color)",
231
- "step-circle-item-tail-process-color": "var(--XDS_line_hard_color)",
232
- "step-circle-item-tail-disabled-color": "var(--XDS_line_hard_color)",
233
- "pagination-item-bg": "rgba(0, 0, 0, 0)",
234
- "nav-normal-bg-color": "rgba(0, 0, 0, 0)",
235
- "nav-normal-sub-nav-bg-color": "rgba(0, 0, 0, 0)",
236
- "nav-primary-text-color": "var(--XDS_fg_color)",
237
- "nav-primary-sub-nav-text-color": "var(--XDS_fg_color)",
238
- "nav-primary-group-text-color": "var(--XDS_fg_color)",
239
- "nav-primary-item-hover-text-color": "var(--XDS_fg_color)",
240
- "nav-primary-sub-nav-hover-text-color": "var(--XDS_fg_color)",
241
- "nav-primary-item-selected-text-color": "var(--XDS_fg_color)",
242
- "nav-primary-sub-nav-selected-text-color": "var(--XDS_fg_color)",
243
- "nav-primary-item-opened-text-color": "var(--XDS_fg_color)",
244
- "nav-primary-item-opened-bg-color": "var(--XDS_line_hover_color)",
245
- "nav-primary-sub-nav-selected-bg-color": "var(--XDS_line_hard_color)",
246
- "nav-primary-sub-nav-bg-color": "rgba(0, 0, 0, 0)",
247
- "table-row-hover-bg": "var(--XDS_line_hover_color)",
248
- "menu-background-hover": "var(--XDS_line_hover_color)",
249
- "menu-background-selected": "var(--XDS_line_hard_color)",
250
- "menu-background-focus": "var(--XDS_line_hard_color)",
251
- "menu-divider-color": "var(--XDS_line_hard_color)",
252
- "input-bg-color": "rgba(0, 0, 0, 0)",
253
- "input-focus-bg-color": "rgba(0, 0, 0, 0)",
254
- "input-hover-bg-color": "rgba(0, 0, 0, 0)",
255
- "input-disabled-bg-color": "var(--XDS_line_hard_color)",
256
- "input-addon-bg-color": "var(--XDS_line_hover_color)",
257
- "tag-closable-primary-fill-bg-color": "var(--XDS_line_hard_color)",
258
- "tag-closable-primary-fill-bg-color-hover": "var(--XDS_line_hard_color)",
259
- "tag-closable-primary-fill-bg-color-disabled": "var(--XDS_line_hard_color)",
260
- "tag-closable-primary-fill-border-color-hover": "var(--XDS_line_hover_color)",
261
- "tag-closable-primary-fill-border-color-disabled":
262
- "var(--XDS_line_hover_color)",
263
- "tag-closable-primary-fill-text-color-disabled":
264
- "var(--XDS_level4_base_color)",
265
- "transfer-panel-header-background-color": "var(--XDS_line_hover_color)",
266
- "switch-disabled-on-bg-color": "var(--XDS_line_hard_color)",
267
- "search-nav-search-bg-color": "var(--XDS_line_hover_color)",
268
- "range-normal-slider-bg-color": "#ffffff",
269
- "range-normal-slider-bg-color-hover": "#ffffff",
270
- "radio-bg-color": "rgba(0, 0, 0, 0)",
271
- "radio-disabled-bg-color": "var(--XDS_line_hard_color)",
272
- "calendar-card-table-cell-disabled-background": "var(--XDS_line_hover_color)",
273
- "calendar-fullscreen-table-cell-disabled-background":
274
- "var(--XDS_line_hover_color)",
275
- "checkbox-bg-color": "rgba(0, 0, 0, 0)",
276
- "checkbox-disabled-bg-color": "var(--XDS_line_hard_color)",
277
- "balloon-tooltip-color-primary-bg": "rgba(0, 0, 0, 0.9) !important",
278
- "balloon-tooltip-color-normal-bg": "'var(--XDS_fg_z1_color)', '!important'",
279
- "balloon-tooltip-color-normal": "var(--XDS_level1_base_color)",
280
- "balloon-tooltip-color-primary": "#ffffff",
281
- "btn-warning-primary-bg-disabled": "var(--XDS_line_hard_color)",
282
- "btn-warning-primary-color-disabled": "var(--XDS_level4_base_color)",
283
- "btn-warning-primary-border-color-disabled": "rgba(0, 0, 0, 0)",
284
- "btn-pure-color-disabled": "var(--XDS_level4_base_color)",
285
- "btn-pure-bg-disabled": "var(--XDS_line_hard_color)",
286
- "btn-pure-border-color-disabled": "var(--XDS_line_hard_color)",
287
- "btn-ghost-dark-bg-normal": "rgba(0, 0, 0, 0)",
288
- "btn-ghost-dark-color": "var(--XDS_level1_base_color)",
289
- "btn-ghost-dark-color-hover": "var(--XDS_level1_base_color)",
290
- "btn-ghost-dark-color-active": "var(--XDS_level1_base_color)",
291
- "btn-ghost-dark-border-color-active": "var(--XDS_level1_base_color)",
292
- "btn-ghost-dark-border-color-hover": "var(--XDS_level1_base_color)",
293
- "btn-ghost-dark-border-color": "var(--XDS_level1_base_color)",
294
- "btn-ghost-dark-bg-hover": "var(--XDS_line_hover_color)",
295
- "btn-ghost-dark-bg-active": "var(--XDS_line_hard_color)",
296
- "btn-ghost-dark-color-disabled": "var(--XDS_level4_base_color)",
297
- "btn-ghost-dark-border-color-disabled": "var(--XDS_level4_base_color)",
298
- "btn-ghost-light-bg-normal": "rgba(0, 0, 0, 0)",
299
- "btn-ghost-light-border-color": "var(--XDS_fg_z1_color)",
300
- "btn-ghost-light-color": "var(--XDS_fg_z1_color)",
301
- "btn-ghost-light-color-active": "var(--XDS_fg_z1_color)",
302
- "btn-ghost-light-color-hover": "var(--XDS_fg_z1_color)",
303
- "btn-ghost-light-border-color-active": "var(--XDS_fg_z1_color)",
304
- "btn-ghost-light-border-color-hover": "var(--XDS_fg_z1_color)",
305
- "btn-ghost-light-bg-hover": "var(--XDS_line_hover_color)",
306
- "btn-ghost-light-bg-active": "var(--XDS_line_hard_color)",
307
- "btn-ghost-light-color-disabled": "var(--XDS_level4_base_color)",
308
- "btn-ghost-light-border-color-disabled": "var(--XDS_level4_base_color)",
309
221
  "font-size-caption": "12px",
310
222
  "font-size-body": "14px",
311
223
  "font-size-subhead": "14px",
@@ -331,10 +243,10 @@ module.exports = {
331
243
  "shape-radius": "4px",
332
244
  "shape-checkbox": "2px",
333
245
  "shape-circular": "50%",
334
- "shadow-01": "var(--XDS_shadow_small)",
335
- "shadow-02": "var(--XDS_shadow_card)",
336
- "shadow-03": "var(--XDS_shadow_bold_card)",
337
- "shadow-04": "var(--XDS_shadow_bold_card)",
246
+ "shadow-01": "0 1px 3px 0 rgba(38, 38, 38, 0.1)",
247
+ "shadow-02": "0 4px 16px 0 rgba(38, 38, 38, 0.12)",
248
+ "shadow-03": "0 12px 32px 0 rgba(38, 38, 38, 0.16)",
249
+ "shadow-04": "0 18px 42px 0 rgba(38, 38, 38, 0.2)",
338
250
  AT_THEME: "teambition",
339
251
  AT_THEME_TYPE: "light"
340
252
  };
package/teambition/less/index.less CHANGED
@@ -150,50 +150,50 @@
150
150
  @S52: 52px;
151
151
  @S56: 56px;
152
152
  @S80: 80px;
153
- @highlight-brand: var(--XDS_blue4_color);
154
- @bright-brand: var(--XDS_blue3_color);
155
- @border-brand: var(--XDS_blue2_color);
156
- @primary-brand: var(--XDS_blue1_color);
157
- @hover-brand: var(--XDS_blue1_hover_color);
158
- @click-brand: var(--XDS_blue1_active_color);
159
- @heavy-brand: var(--XDS_blue1_click_color);
160
- @highlight-danger: var(--XDS_red4_color);
161
- @bright-danger: var(--XDS_red3_color);
162
- @border-danger: var(--XDS_red2_color);
163
- @primary-danger: var(--XDS_red1_color);
164
- @hover-danger: var(--XDS_red1_hover_color);
165
- @click-danger: var(--XDS_red1_active_color);
166
- @heavy-danger: var(--XDS_red1_click_color);
167
- @highlight-warning: var(--XDS_orange4_color);
168
- @bright-warning: var(--XDS_orange3_color);
169
- @border-warning: var(--XDS_orange2_color);
170
- @primary-warning: var(--XDS_orange1_color);
171
- @hover-warning: var(--XDS_orange1_hover_color);
172
- @click-warning: var(--XDS_orange1_active_color);
173
- @heavy-warning: var(--XDS_orange1_click_color);
174
- @highlight-alert: var(--XDS_yellow4_color);
175
- @bright-alert: var(--XDS_yellow3_color);
176
- @border-alert: var(--XDS_yellow2_color);
177
- @primary-alert: var(--XDS_yellow1_color);
178
- @hover-alert: var(--XDS_yellow1_hover_color);
179
- @click-alert: var(--XDS_yellow1_active_color);
180
- @heavy-alert: var(--XDS_yellow1_click_color);
181
- @highlight-success: var(--XDS_green4_color);
182
- @bright-success: var(--XDS_green3_color);
183
- @border-success: var(--XDS_green2_color);
184
- @primary-success: var(--XDS_green1_color);
185
- @hover-success: var(--XDS_green1_hover_color);
186
- @click-success: var(--XDS_green1_active_color);
187
- @heavy-success: var(--XDS_green1_click_color);
153
+ @highlight-brand: #f2fbff;
154
+ @bright-brand: #ccecff;
155
+ @border-brand: #87d2ff;
156
+ @primary-brand: #1b9aee;
157
+ @hover-brand: #0171c2;
158
+ @click-brand: #004f8a;
159
+ @heavy-brand: #002e52;
160
+ @highlight-danger: #ffeded;
161
+ @bright-danger: #ffcccc;
162
+ @border-danger: #f87872;
163
+ @primary-danger: #e62412;
164
+ @hover-danger: #c21c07;
165
+ @click-danger: #9a1604;
166
+ @heavy-danger: #800f00;
167
+ @highlight-warning: #fff7e6;
168
+ @bright-warning: #ffd591;
169
+ @border-warning: #ffa941;
170
+ @primary-warning: #fa8c15;
171
+ @hover-warning: #d46b08;
172
+ @click-warning: #ad4e01;
173
+ @heavy-warning: #8f4000;
174
+ @highlight-alert: #ffffe3;
175
+ @bright-alert: #fff88f;
176
+ @border-alert: #ffe53e;
177
+ @primary-alert: #fad414;
178
+ @hover-alert: #d4ab06;
179
+ @click-alert: #ad8500;
180
+ @heavy-alert: #946c00;
181
+ @highlight-success: #edffed;
182
+ @bright-success: #cafac8;
183
+ @border-success: #64d16d;
184
+ @primary-success: #15ad31;
185
+ @hover-success: #038a24;
186
+ @click-success: #006d1f;
187
+ @heavy-success: #00591c;
188
188
  @snow: #ffffff;
189
- @gray-01: var(--XDS_bg_color);
190
- @gray-02: var(--XDS_line_light_color);
191
- @gray-03: var(--XDS_line_hard_color);
192
- @gray-04: var(--XDS_line_hard_color);
193
- @gray-05: var(--XDS_level4_base_color);
194
- @gray-06: var(--XDS_level3_base_color);
195
- @gray-07: var(--XDS_level2_base_color);
196
- @gray-08: var(--XDS_level1_base_color);
189
+ @gray-01: #f7f7f7;
190
+ @gray-02: #f0f0f0;
191
+ @gray-03: #e5e5e5;
192
+ @gray-04: #d9d9d9;
193
+ @gray-05: #bfbfbf;
194
+ @gray-06: #8c8c8c;
195
+ @gray-07: #595959;
196
+ @gray-08: #262626;
197
197
  @shadow-color: #000000;
198
198
  @dashboard-01: #fab34f;
199
199
  @dashboard-02: #ff656b;
@@ -210,96 +210,11 @@
210
210
  @placeholder-06: #29b3f0;
211
211
  @placeholder-07: #3885ea;
212
212
  @background-fill: #ffffff;
213
- @background-nav-search: rgba(0, 0, 0, 0);
214
- @background-section: var(--XDS_fg_z1_color);
215
- @background-layout: var(--XDS_fg_color);
216
- @background-overlay: var(--XDS_fg_z1_color);
213
+ @background-nav-search: #f7f7f7;
214
+ @background-section: #ffffff;
215
+ @background-layout: #f7f7f7;
216
+ @background-overlay: #f0f0f0;
217
217
  @background-switch-trigger: #ffffff;
218
- @background-base: var(--XDS_bg_base);
219
- @cell-line-hover: var(--XDS_line_hover_color);
220
- @cell-line-active: var(--XDS_line_hard_color);
221
- @tab-wrapped-bg-color-hover: rgba(0, 0, 0, 0);
222
- @tab-wrapped-bg-color: rgba(0, 0, 0, 0);
223
- @tab-wrapped-bg-color-selected: var(--XDS_fg_color);
224
- @step-dot-item-tail-wait-color: var(--XDS_line_hard_color);
225
- @step-dot-item-tail-process-color: var(--XDS_line_hard_color);
226
- @step-dot-item-tail-disabled-color: var(--XDS_line_hard_color);
227
- @step-circle-item-tail-wait-color: var(--XDS_line_hard_color);
228
- @step-circle-item-tail-process-color: var(--XDS_line_hard_color);
229
- @step-circle-item-tail-disabled-color: var(--XDS_line_hard_color);
230
- @pagination-item-bg: rgba(0, 0, 0, 0);
231
- @nav-normal-bg-color: rgba(0, 0, 0, 0);
232
- @nav-normal-sub-nav-bg-color: rgba(0, 0, 0, 0);
233
- @nav-primary-text-color: var(--XDS_fg_color);
234
- @nav-primary-sub-nav-text-color: var(--XDS_fg_color);
235
- @nav-primary-group-text-color: var(--XDS_fg_color);
236
- @nav-primary-item-hover-text-color: var(--XDS_fg_color);
237
- @nav-primary-sub-nav-hover-text-color: var(--XDS_fg_color);
238
- @nav-primary-item-selected-text-color: var(--XDS_fg_color);
239
- @nav-primary-sub-nav-selected-text-color: var(--XDS_fg_color);
240
- @nav-primary-item-opened-text-color: var(--XDS_fg_color);
241
- @nav-primary-item-opened-bg-color: var(--XDS_line_hover_color);
242
- @nav-primary-sub-nav-selected-bg-color: var(--XDS_line_hard_color);
243
- @nav-primary-sub-nav-bg-color: rgba(0, 0, 0, 0);
244
- @table-row-hover-bg: var(--XDS_line_hover_color);
245
- @menu-background-hover: var(--XDS_line_hover_color);
246
- @menu-background-selected: var(--XDS_line_hard_color);
247
- @menu-background-focus: var(--XDS_line_hard_color);
248
- @menu-divider-color: var(--XDS_line_hard_color);
249
- @input-bg-color: rgba(0, 0, 0, 0);
250
- @input-focus-bg-color: rgba(0, 0, 0, 0);
251
- @input-hover-bg-color: rgba(0, 0, 0, 0);
252
- @input-disabled-bg-color: var(--XDS_line_hard_color);
253
- @input-addon-bg-color: var(--XDS_line_hover_color);
254
- @tag-closable-primary-fill-bg-color: var(--XDS_line_hard_color);
255
- @tag-closable-primary-fill-bg-color-hover: var(--XDS_line_hard_color);
256
- @tag-closable-primary-fill-bg-color-disabled: var(--XDS_line_hard_color);
257
- @tag-closable-primary-fill-border-color-hover: var(--XDS_line_hover_color);
258
- @tag-closable-primary-fill-border-color-disabled: var(--XDS_line_hover_color);
259
- @tag-closable-primary-fill-text-color-disabled: var(--XDS_level4_base_color);
260
- @transfer-panel-header-background-color: var(--XDS_line_hover_color);
261
- @switch-disabled-on-bg-color: var(--XDS_line_hard_color);
262
- @search-nav-search-bg-color: var(--XDS_line_hover_color);
263
- @range-normal-slider-bg-color: #ffffff;
264
- @range-normal-slider-bg-color-hover: #ffffff;
265
- @radio-bg-color: rgba(0, 0, 0, 0);
266
- @radio-disabled-bg-color: var(--XDS_line_hard_color);
267
- @calendar-card-table-cell-disabled-background: var(--XDS_line_hover_color);
268
- @calendar-fullscreen-table-cell-disabled-background: var(--XDS_line_hover_color);
269
- @checkbox-bg-color: rgba(0, 0, 0, 0);
270
- @checkbox-disabled-bg-color: var(--XDS_line_hard_color);
271
- @balloon-tooltip-color-primary-bg: rgba(0, 0, 0, 0.9) !important;
272
- @balloon-tooltip-color-normal-bg: 'var(--XDS_fg_z1_color)', '!important';
273
- @balloon-tooltip-color-normal: var(--XDS_level1_base_color);
274
- @balloon-tooltip-color-primary: #ffffff;
275
- @btn-warning-primary-bg-disabled: var(--XDS_line_hard_color);
276
- @btn-warning-primary-color-disabled: var(--XDS_level4_base_color);
277
- @btn-warning-primary-border-color-disabled: rgba(0, 0, 0, 0);
278
- @btn-pure-color-disabled: var(--XDS_level4_base_color);
279
- @btn-pure-bg-disabled: var(--XDS_line_hard_color);
280
- @btn-pure-border-color-disabled: var(--XDS_line_hard_color);
281
- @btn-ghost-dark-bg-normal: rgba(0, 0, 0, 0);
282
- @btn-ghost-dark-color: var(--XDS_level1_base_color);
283
- @btn-ghost-dark-color-hover: var(--XDS_level1_base_color);
284
- @btn-ghost-dark-color-active: var(--XDS_level1_base_color);
285
- @btn-ghost-dark-border-color-active: var(--XDS_level1_base_color);
286
- @btn-ghost-dark-border-color-hover: var(--XDS_level1_base_color);
287
- @btn-ghost-dark-border-color: var(--XDS_level1_base_color);
288
- @btn-ghost-dark-bg-hover: var(--XDS_line_hover_color);
289
- @btn-ghost-dark-bg-active: var(--XDS_line_hard_color);
290
- @btn-ghost-dark-color-disabled: var(--XDS_level4_base_color);
291
- @btn-ghost-dark-border-color-disabled: var(--XDS_level4_base_color);
292
- @btn-ghost-light-bg-normal: rgba(0, 0, 0, 0);
293
- @btn-ghost-light-border-color: var(--XDS_fg_z1_color);
294
- @btn-ghost-light-color: var(--XDS_fg_z1_color);
295
- @btn-ghost-light-color-active: var(--XDS_fg_z1_color);
296
- @btn-ghost-light-color-hover: var(--XDS_fg_z1_color);
297
- @btn-ghost-light-border-color-active: var(--XDS_fg_z1_color);
298
- @btn-ghost-light-border-color-hover: var(--XDS_fg_z1_color);
299
- @btn-ghost-light-bg-hover: var(--XDS_line_hover_color);
300
- @btn-ghost-light-bg-active: var(--XDS_line_hard_color);
301
- @btn-ghost-light-color-disabled: var(--XDS_level4_base_color);
302
- @btn-ghost-light-border-color-disabled: var(--XDS_level4_base_color);
303
218
  @font-size-caption: 12px;
304
219
  @font-size-body: 14px;
305
220
  @font-size-subhead: 14px;
@@ -325,9 +240,9 @@
325
240
  @shape-radius: 4px;
326
241
  @shape-checkbox: 2px;
327
242
  @shape-circular: 50%;
328
- @shadow-01: var(--XDS_shadow_small);
329
- @shadow-02: var(--XDS_shadow_card);
330
- @shadow-03: var(--XDS_shadow_bold_card);
331
- @shadow-04: var(--XDS_shadow_bold_card);
243
+ @shadow-01: 0 1px 3px 0 rgba(38, 38, 38, 0.1);
244
+ @shadow-02: 0 4px 16px 0 rgba(38, 38, 38, 0.12);
245
+ @shadow-03: 0 12px 32px 0 rgba(38, 38, 38, 0.16);
246
+ @shadow-04: 0 18px 42px 0 rgba(38, 38, 38, 0.2);
332
247
  @AT_THEME: teambition;
333
248
  @AT_THEME_TYPE: light;
package/teambition/scss/variables/color.scss CHANGED
@@ -1,58 +1,51 @@
1
1
  // 颜色变量
2
2
  @import '../../../common/variables/color.scss';
3
3
 
4
- $highlight-brand: var(--XDS_blue4_color) !default;
5
- $bright-brand: var(--XDS_blue3_color) !default;
6
- $border-brand: var(--XDS_blue2_color) !default;
7
- $primary-brand: var(--XDS_blue1_color) !default;
8
- $hover-brand: var(--XDS_blue1_hover_color) !default;
9
- $click-brand: var(--XDS_blue1_active_color) !default;
10
- $heavy-brand: var(--XDS_blue1_click_color) !default;
11
-
12
- $highlight-danger: var(--XDS_red4_color) !default;
13
- $bright-danger: var(--XDS_red3_color) !default;
14
- $border-danger: var(--XDS_red2_color) !default;
15
- $primary-danger: var(--XDS_red1_color) !default;
16
- $hover-danger: var(--XDS_red1_hover_color) !default;
17
- $click-danger: var(--XDS_red1_active_color) !default;
18
- $heavy-danger: var(--XDS_red1_click_color) !default;
19
-
20
- $highlight-warning: var(--XDS_orange4_color) !default;
21
- $bright-warning: var(--XDS_orange3_color) !default;
22
- $border-warning: var(--XDS_orange2_color) !default;
23
- $primary-warning: var(--XDS_orange1_color) !default;
24
- $hover-warning: var(--XDS_orange1_hover_color) !default;
25
- $click-warning: var(--XDS_orange1_active_color) !default;
26
- $heavy-warning: var(--XDS_orange1_click_color) !default;
27
-
28
- $highlight-alert: var(--XDS_yellow4_color) !default;
29
- $bright-alert: var(--XDS_yellow3_color) !default;
30
- $border-alert: var(--XDS_yellow2_color) !default;
31
- $primary-alert: var(--XDS_yellow1_color) !default;
32
- $hover-alert: var(--XDS_yellow1_hover_color) !default;
33
- $click-alert: var(--XDS_yellow1_active_color) !default;
34
- $heavy-alert: var(--XDS_yellow1_click_color) !default;
35
-
36
- $highlight-success: var(--XDS_green4_color) !default;
37
- $bright-success: var(--XDS_green3_color) !default;
38
- $border-success: var(--XDS_green2_color) !default;
39
- $primary-success: var(--XDS_green1_color) !default;
40
- $hover-success: var(--XDS_green1_hover_color) !default;
41
- $click-success: var(--XDS_green1_active_color) !default;
42
- $heavy-success: var(--XDS_green1_click_color) !default;
43
-
4
+ $highlight-brand: $B20 !default;
5
+ $bright-brand: $B30 !default;
6
+ $border-brand: $B40 !default;
7
+ $primary-brand: $B50 !default;
8
+ $hover-brand: $B60 !default;
9
+ $click-brand: $B70 !default;
10
+ $heavy-brand: $B80 !default;
11
+ $highlight-danger: $R20 !default;
12
+ $bright-danger: $R30 !default;
13
+ $border-danger: $R40 !default;
14
+ $primary-danger: $R50 !default;
15
+ $hover-danger: $R60 !default;
16
+ $click-danger: $R70 !default;
17
+ $heavy-danger: $R80 !default;
18
+ $highlight-warning: $O20 !default;
19
+ $bright-warning: $O30 !default;
20
+ $border-warning: $O40 !default;
21
+ $primary-warning: $O50 !default;
22
+ $hover-warning: $O60 !default;
23
+ $click-warning: $O70 !default;
24
+ $heavy-warning: $O80 !default;
25
+ $highlight-alert: $A20 !default;
26
+ $bright-alert: $A30 !default;
27
+ $border-alert: $A40 !default;
28
+ $primary-alert: $A50 !default;
29
+ $hover-alert: $A60 !default;
30
+ $click-alert: $A70 !default;
31
+ $heavy-alert: $A80 !default;
32
+ $highlight-success: $GN20 !default;
33
+ $bright-success: $GN30 !default;
34
+ $border-success: $GN40 !default;
35
+ $primary-success: $GN50 !default;
36
+ $hover-success: $GN60 !default;
37
+ $click-success: $GN70 !default;
38
+ $heavy-success: $GN80 !default;
44
39
  $snow: $G0 !default;
45
- $gray-01: var(--XDS_bg_color) !default;
46
- $gray-02: var(--XDS_line_light_color) !default;
47
- $gray-03: var(--XDS_line_hard_color) !default;
48
- $gray-04: var(--XDS_line_hard_color) !default;
49
- $gray-05: var(--XDS_level4_base_color) !default;
50
- $gray-06: var(--XDS_level3_base_color) !default;
51
- $gray-07: var(--XDS_level2_base_color) !default;
52
- $gray-08: var(--XDS_level1_base_color) !default;
53
-
40
+ $gray-01: $G10 !default;
41
+ $gray-02: $G20 !default;
42
+ $gray-03: $G30 !default;
43
+ $gray-04: $G40 !default;
44
+ $gray-05: $G50 !default;
45
+ $gray-06: $G60 !default;
46
+ $gray-07: $G70 !default;
47
+ $gray-08: $G80 !default;
54
48
  $shadow-color: $G100 !default;
55
-
56
49
  $dashboard-01: $DT10 !default;
57
50
  $dashboard-02: $DT20 !default;
58
51
  $dashboard-03: $DT30 !default;
@@ -68,134 +61,8 @@ $placeholder-05: $PH50 !default;
68
61
  $placeholder-06: $PH60 !default;
69
62
  $placeholder-07: $PH70 !default;
70
63
  $background-fill: $G0 !default;
71
- $background-nav-search: transparent !default;
72
-
73
- $background-section: var(--XDS_fg_z1_color) !default;
74
- $background-layout: var(--XDS_fg_color) !default;
75
- $background-overlay: var(--XDS_fg_z1_color) !default;
76
- $background-switch-trigger: $G0 !default;
77
- $background-base: var(--XDS_bg_base) !default;
78
-
79
- $cell-line-hover: var(--XDS_line_hover_color) !default;
80
- $cell-line-active: var(--XDS_line_hard_color) !default;
81
-
82
- // custom-override-color
83
-
84
- // tab 组件
85
- $tab-wrapped-bg-color-hover: transparent;
86
- $tab-wrapped-bg-color: transparent;
87
- $tab-wrapped-bg-color-selected: var(--XDS_fg_color);
88
-
89
- // step
90
- $step-dot-item-tail-wait-color: var(--XDS_line_hard_color) !default;
91
- $step-dot-item-tail-process-color: var(--XDS_line_hard_color) !default;
92
- $step-dot-item-tail-disabled-color: var(--XDS_line_hard_color) !default;
93
- $step-circle-item-tail-wait-color: var(--XDS_line_hard_color) !default;
94
- $step-circle-item-tail-process-color: var(--XDS_line_hard_color) !default;
95
- $step-circle-item-tail-disabled-color: var(--XDS_line_hard_color) !default;
96
-
97
- // pagination
98
- $pagination-item-bg: transparent;
99
-
100
- // nav
101
- $nav-normal-bg-color: transparent !default;
102
- $nav-normal-sub-nav-bg-color: transparent !default;
103
- $nav-primary-text-color: var(--XDS_fg_color) !default;
104
- $nav-primary-sub-nav-text-color: var(--XDS_fg_color) !default;
105
- $nav-primary-group-text-color: var(--XDS_fg_color) !default;
106
- $nav-primary-item-hover-text-color: var(--XDS_fg_color) !default;
107
- $nav-primary-sub-nav-hover-text-color: var(--XDS_fg_color) !default;
108
- $nav-primary-item-selected-text-color: var(--XDS_fg_color) !default;
109
- $nav-primary-sub-nav-selected-text-color: var(--XDS_fg_color) !default;
110
- $nav-primary-item-opened-text-color: var(--XDS_fg_color) !default;
111
- $nav-primary-item-opened-bg-color: var(--XDS_line_hover_color) !default;
112
- $nav-primary-sub-nav-selected-bg-color: var(--XDS_line_hard_color) !default;
113
- $nav-primary-sub-nav-bg-color: transparent !default;
114
-
115
- // table
116
- $table-row-hover-bg: var(--XDS_line_hover_color) !default;
117
-
118
- // menu
119
- $menu-background-hover: var(--XDS_line_hover_color) !default;
120
- $menu-background-selected: var(--XDS_line_hard_color) !default;
121
- $menu-background-focus: var(--XDS_line_hard_color) !default;
122
- $menu-divider-color: var(--XDS_line_hard_color) !default;
123
-
124
-
125
- // input
126
- $input-bg-color: transparent !default;
127
- $input-focus-bg-color: transparent !default;
128
- $input-hover-bg-color: transparent !default;
129
- $input-disabled-bg-color: var(--XDS_line_hard_color) !default;
130
- $input-addon-bg-color: var(--XDS_line_hover_color) !default;
131
-
132
- // tag
133
- $tag-closable-primary-fill-bg-color: var(--XDS_line_hard_color) !default;
134
- $tag-closable-primary-fill-bg-color-hover: var(--XDS_line_hard_color) !default;
135
- $tag-closable-primary-fill-bg-color-disabled: var(--XDS_line_hard_color) !default;
136
- $tag-closable-primary-fill-border-color-hover: var(--XDS_line_hover_color) !default;
137
- $tag-closable-primary-fill-border-color-disabled: var(--XDS_line_hover_color) !default;
138
- $tag-closable-primary-fill-text-color-disabled: var(--XDS_level4_base_color) !default;
139
-
140
- // transfer
141
- $transfer-panel-header-background-color: var(--XDS_line_hover_color) !default;
142
-
143
- // switch
144
- $switch-disabled-on-bg-color: var(--XDS_line_hard_color) !default;
145
-
146
- // searcher
147
- $search-nav-search-bg-color: var(--XDS_line_hover_color) !default;
148
-
149
- // range
150
- $range-normal-slider-bg-color: white !default;
151
- $range-normal-slider-bg-color-hover: white !default;
152
-
153
- // radio
154
- $radio-bg-color: transparent !default;
155
- $radio-disabled-bg-color: var(--XDS_line_hard_color) !default;
156
-
157
- // calendar
158
- $calendar-card-table-cell-disabled-background: var(--XDS_line_hover_color) !default;
159
- $calendar-fullscreen-table-cell-disabled-background: var(--XDS_line_hover_color) !default;
160
-
161
- // checkbox
162
- $checkbox-bg-color: transparent !default;
163
- $checkbox-disabled-bg-color: var(--XDS_line_hard_color) !default;
164
-
165
- // ballon
166
- $balloon-tooltip-color-primary-bg: rgba(0, 0, 0, .9) !important !default;
167
- $balloon-tooltip-color-normal-bg: var(--XDS_fg_z1_color) !important !default;
168
- $balloon-tooltip-color-normal: var(--XDS_level1_base_color) !default;
169
- $balloon-tooltip-color-primary: white !default;
170
-
171
- // button
172
- $btn-warning-primary-bg-disabled: var(--XDS_line_hard_color) !default;
173
- $btn-warning-primary-color-disabled: var(--XDS_level4_base_color) !default;
174
- $btn-warning-primary-border-color-disabled: transparent !default;
175
- $btn-pure-color-disabled: var(--XDS_level4_base_color) !default;
176
- $btn-pure-bg-disabled: var(--XDS_line_hard_color) !default;
177
- $btn-pure-border-color-disabled: var(--XDS_line_hard_color) !default;
178
- // button ghost dark
179
- $btn-ghost-dark-bg-normal: transparent !default;
180
- $btn-ghost-dark-color: var(--XDS_level1_base_color) !default;
181
- $btn-ghost-dark-color-hover: var(--XDS_level1_base_color) !default;
182
- $btn-ghost-dark-color-active: var(--XDS_level1_base_color) !default;
183
- $btn-ghost-dark-border-color-active: var(--XDS_level1_base_color) !default;
184
- $btn-ghost-dark-border-color-hover: var(--XDS_level1_base_color) !default;
185
- $btn-ghost-dark-border-color: var(--XDS_level1_base_color) !default;
186
- $btn-ghost-dark-bg-hover: var(--XDS_line_hover_color) !default;
187
- $btn-ghost-dark-bg-active: var(--XDS_line_hard_color) !default;
188
- $btn-ghost-dark-color-disabled: var(--XDS_level4_base_color) !default;
189
- $btn-ghost-dark-border-color-disabled: var(--XDS_level4_base_color) !default;
190
- // button ghost light
191
- $btn-ghost-light-bg-normal: transparent !default;
192
- $btn-ghost-light-border-color: var(--XDS_fg_z1_color) !default;
193
- $btn-ghost-light-color: var(--XDS_fg_z1_color) !default;
194
- $btn-ghost-light-color-active: var(--XDS_fg_z1_color) !default;
195
- $btn-ghost-light-color-hover: var(--XDS_fg_z1_color) !default;
196
- $btn-ghost-light-border-color-active: var(--XDS_fg_z1_color) !default;
197
- $btn-ghost-light-border-color-hover: var(--XDS_fg_z1_color) !default;
198
- $btn-ghost-light-bg-hover: var(--XDS_line_hover_color) !default;
199
- $btn-ghost-light-bg-active: var(--XDS_line_hard_color) !default;
200
- $btn-ghost-light-color-disabled: var(--XDS_level4_base_color) !default;
201
- $btn-ghost-light-border-color-disabled: var(--XDS_level4_base_color) !default;
64
+ $background-nav-search: $G10 !default;
65
+ $background-section: $G0 !default;
66
+ $background-layout: $G10 !default;
67
+ $background-overlay: $G20 !default;
68
+ $background-switch-trigger: $G0 !default;
package/teambition/scss/variables/shadow.scss CHANGED
@@ -1,6 +1,6 @@
1
1
  @import '../../../common/variables/shadow.scss';
2
2
 
3
- $shadow-01: var(--XDS_shadow_small) !default;
4
- $shadow-02: var(--XDS_shadow_card) !default;
5
- $shadow-03: var(--XDS_shadow_bold_card) !default;
6
- $shadow-04: var(--XDS_shadow_bold_card) !default;
3
+ $shadow-01: $SH1 !default;
4
+ $shadow-02: $SH2 !default;
5
+ $shadow-03: $SH3 !default;
6
+ $shadow-04: $SH4 !default;