UNPKG

15.9 kBSCSSView Raw
1@charset "UTF-8";
2
3////
4/// @module tag: 标签
5/// @tag Tag
6/// @category component
7/// @family data-display
8/// @varPrefix $tag-
9/// @classPrefix {prefix}-tag
10/// @order {"size/bounding":10,"size/content":11,"size/tail":12,"size/tick":13,"statement/normal":10,"statement/normal/bounding":100,"statement/normal/tail":101,"statement/hover":11,"statement/hover/tail":110,"statement/hover/bounding":111,"statement/disabled":12,"statement/disabled/tail":120,"statement/disabled/bounding":121,"statement/selected":13,"statement/selected/tick":130,"statement/selected-hover":14,"statement/selected-hover/tick":140,"statement/selected-disabled":15,"statement/selected-disabled/bounding":150,"statement/selected-disabled/tick":151}
11////
12
13
14
15// Size
16// -------------------
17
18/// height
19/// @namespace size/bounding
20$tag-size-l-height: $s-10 !default;
21/// height
22/// @namespace size/bounding
23$tag-size-m-height: $s-7 !default;
24/// height
25/// @namespace size/bounding
26$tag-size-s-height: $s-5 !default;
27
28/// spacing
29/// @namespace size/bounding
30$tag-size-l-spacing: $s-4 !default;
31/// spacing
32/// @namespace size/bounding
33$tag-size-m-spacing: $s-3 !default;
34/// spacing
35/// @namespace size/bounding
36$tag-size-s-spacing: $s-2 !default;
37
38/// padding (l, r)
39/// @namespace size/bounding
40$tag-size-l-padding-lr: $s-4 !default;
41
42/// padding (l, r)
43/// @namespace size/bounding
44$tag-size-m-padding-lr: $s-3 !default;
45
46/// padding (l, r)
47/// @namespace size/bounding
48$tag-size-s-padding-lr: $s-2 !default;
49
50/// corner
51/// @namespace size/bounding
52$tag-corner-radius: $corner-1 !default;
53
54/// corner
55/// @namespace size/bounding
56$tag-checkable-corner-radius: $corner-1 !default;
57
58/// border
59/// @namespace size/bounding
60$tag-border-width: $line-1 !default;
61
62/// shadow
63/// @namespace size/bounding
64$tag-shadow: $shadow-zero !default;
65
66/// text
67/// @namespace size/content
68$tag-size-l-text-size: $font-size-subhead !default;
69
70/// text
71/// @namespace size/content
72$tag-size-m-text-size: $font-size-body-2 !default;
73
74/// text
75/// @namespace size/content
76$tag-size-s-text-size: $font-size-caption !default;
77
78/// min width
79/// @namespace size/content
80$tag-size-s-content-min-width: $s-7 !default;
81
82/// min width
83/// @namespace size/content
84$tag-size-m-content-min-width: $s-10 !default;
85
86/// min width
87/// @namespace size/content
88$tag-size-l-content-min-width: $s-12 !default;
89
90/// icon size
91/// @namespace size/tail
92$tag-size-l-icon-font: $icon-xs !default;
93
94/// icon size
95/// @namespace size/tail
96$tag-size-m-icon-font: $icon-xxs !default;
97
98/// icon size
99/// @namespace size/tail
100$tag-size-s-icon-font: $icon-xxs !default;
101
102/// icon size
103/// @namespace size/tick
104$tag-size-l-tick-icon-size: $icon-s !default;
105
106/// icon size
107/// @namespace size/tick
108$tag-size-m-tick-icon-size: $icon-xs !default;
109
110/// icon size
111/// @namespace size/tick
112$tag-size-s-tick-icon-size: $icon-xxs !default;
113
114/// background size
115/// @namespace size/tick
116$tag-size-l-tick-icon-bg-size: $s-9 !default;
117
118/// background size
119/// @namespace size/tick
120$tag-size-m-tick-icon-bg-size: $s-7 !default;
121
122/// background size
123/// @namespace size/tick
124$tag-size-s-tick-icon-bg-size: $s-5 !default;
125
126
127
128// Unconfigurable for size
129// -------------------
130
131$tag-size-line-height: $s-4 !default;
132$tag-size-m-margin: $s-2 !default;
133$tag-size-s-margin: $s-1 !default;
134
135// icon - unconfigurable
136$tag-checkable-icon-selected: $icon-content-select;
137$tag-closable-normal-icon: $icon-content-close;
138
139// Animation
140$ease-in-out-circ: cubic-bezier(.78, .14, .15, .86);
141
142// Statement
143// -------------------
144
145/// text
146/// @namespace statement/normal/bounding
147$tag-normal-text-color: $color-text1-4 !default;
148
149/// text
150/// @namespace statement/normal/bounding
151$tag-fill-text-color: $color-text1-3 !default;
152
153/// text
154/// @namespace statement/normal/tail
155$tag-closable-normal-icon-color: $color-white !default;
156
157/// text
158/// @namespace statement/hover/tail
159$tag-closable-normal-icon-color-hover: $color-white !default;
160
161/// text
162/// @namespace statement/disabled/tail
163$tag-closable-normal-icon-color-disabled: $color-white !default;
164
165/// background
166/// @namespace statement/normal/tail
167$tag-closable-normal-bg: $color-line1-3 !default;
168
169/// background
170/// @namespace statement/hover/tail
171$tag-closable-normal-bg-hover: $color-line1-4 !default;
172
173/// background
174/// @namespace statement/disabled/tail
175$tag-closable-normal-bg-disabled: $color-line1-1 !default;
176
177/// text
178/// @namespace statement/normal/bounding
179$tag-closable-bordered-text-color: $color-text1-3 !default;
180
181/// border
182/// @namespace statement/normal/bounding
183$tag-closable-bordered-border-color: $color-line1-3 !default;
184
185/// background
186/// @namespace statement/normal/bounding
187$tag-closable-bordered-bg: $color-transparent !default;
188
189/// text
190/// @namespace statement/hover/bounding
191$tag-closable-bordered-text-color-hover: $color-text1-4 !default;
192
193/// border
194/// @namespace statement/hover/bounding
195$tag-closable-bordered-border-color-hover: $color-line1-4 !default;
196
197/// background
198/// @namespace statement/hover/bounding
199$tag-closable-bordered-bg-hover: $color-transparent !default;
200
201/// text
202/// @namespace statement/normal/tail
203$tag-closable-bordered-tail-color: $color-text1-3 !default;
204
205/// text
206/// @namespace statement/hover/tail
207$tag-closable-bordered-tail-color-hover: $color-text1-4 !default;
208
209/// text
210/// @namespace statement/disabled/tail
211$tag-closable-bordered-tail-color-disabled: $color-text1-1 !default;
212
213/// border
214/// @namespace statement/disabled/bounding
215$tag-closable-bordered-border-color-disabled: $color-line1-1 !default;
216
217/// text
218/// @namespace statement/disabled/bounding
219$tag-closable-bordered-text-color-disabled: $color-text1-1 !default;
220
221/// background
222/// @namespace statement/disabled/bounding
223$tag-closable-bordered-bg-disabled: $color-transparent !default;
224
225/// text
226/// @namespace statement/normal/tail
227$tag-fill-tail-color: $color-text1-3 !default;
228
229/// border
230/// @namespace statement/normal/bounding
231$tag-fill-border-color: $color-fill1-3 !default;
232
233/// border
234/// @namespace statement/hover/bounding
235$tag-fill-border-color-hover: $color-fill1-4 !default;
236
237/// text
238/// @namespace statement/disabled/bounding
239$tag-fill-text-color-disabled: $color-text1-1 !default;
240
241/// border
242/// @namespace statement/disabled/bounding
243$tag-fill-border-color-disabled: $color-fill1-1 !default;
244
245/// background
246/// @namespace statement/disabled/bounding
247$tag-fill-bg-color-disabled: $color-fill1-1 !default;
248
249/// text
250/// @namespace statement/disabled/tail
251$tag-fill-tail-color-disabled: $color-text1-1 !default;
252
253/// text
254/// @namespace statement/normal/bounding
255$tag-bordered-text-color: $color-text1-3 !default;
256
257/// text
258/// @namespace statement/normal/tail
259$tag-bordered-tail-color: $color-text1-3 !default;
260
261/// text
262/// @namespace statement/normal/bounding
263$tag-secondary-text-color: $color-brand1-6 !default;
264
265/// text
266/// @namespace statement/hover/bounding
267$tag-normal-text-color-hover: $color-brand1-6 !default;
268
269/// text
270/// @namespace statement/hover/bounding
271$tag-fill-text-color-hover: $color-text1-4 !default;
272
273/// text
274/// @namespace statement/hover/tail
275$tag-fill-tail-color-hover: $color-text1-4 !default;
276
277/// text
278/// @namespace statement/hover/bounding
279$tag-bordered-text-color-hover: $color-text1-4 !default;
280
281/// text
282/// @namespace statement/hover/tail
283$tag-bordered-tail-color-hover: $color-text1-4 !default;
284
285/// text
286/// @namespace statement/disabled/tail
287$tag-bordered-tail-color-disabled: $color-text1-1 !default;
288
289/// text
290/// @namespace statement/disabled/bounding
291$tag-bordered-text-color-disabled: $color-text1-1 !default;
292
293/// border
294/// @namespace statement/disabled/bounding
295$tag-bordered-border-color-disabled: $color-line1-1 !default;
296
297/// background
298/// @namespace statement/disabled/bounding
299$tag-bordered-bg-disabled: $color-fill1-1 !default;
300
301/// text
302/// @namespace statement/hover/bounding
303$tag-secondary-text-color-hover: $color-brand1-9 !default;
304
305/// border
306/// @namespace statement/normal/bounding
307$tag-bordered-border-color: $color-line1-3 !default;
308
309/// border
310/// @namespace statement/normal/bounding
311$tag-secondary-border-color: $color-brand1-6 !default;
312
313/// background
314/// @namespace statement/selected/tick
315$tag-checkable-normal-bg-selected: $color-brand1-6 !default;
316
317/// background
318/// @namespace statement/selected/tick
319$tag-checkable-secondary-bg-selected: $color-brand1-6 !default;
320
321/// border
322/// @namespace statement/hover/bounding
323$tag-bordered-border-color-hover: $color-line1-4 !default;
324
325/// border
326/// @namespace statement/hover/bounding
327$tag-secondary-border-color-hover: $color-brand1-9 !default;
328
329/// background
330/// @namespace statement/selected-hover/tick
331$tag-checkable-normal-bg-selected-hover: $color-brand1-9 !default;
332
333/// background
334/// @namespace statement/selected-hover/tick
335$tag-checkable-secondary-bg-selected-hover: $color-brand1-9 !default;
336
337/// background
338/// @namespace statement/normal/bounding
339$tag-fill-bg-color: $color-fill1-3 !default;
340
341/// background
342/// @namespace statement/normal/bounding
343$tag-primary-background-color: $color-brand1-6 !default;
344
345/// background
346/// @namespace statement/normal/bounding
347$tag-bordered-bg: $color-transparent !default;
348
349/// background
350/// @namespace statement/normal/bounding
351$tag-secondary-bg: $color-transparent !default;
352
353/// background
354/// @namespace statement/hover/bounding
355$tag-fill-bg-color-hover: $color-fill1-4 !default;
356
357/// background
358/// @namespace statement/hover/bounding
359$tag-bordered-bg-hover: $color-transparent !default;
360
361/// background
362/// @namespace statement/hover/bounding
363$tag-secondary-bg-hover: $color-transparent !default;
364
365/// text
366/// @namespace statement/disabled/bounding
367$tag-text-color-disabled: $color-text1-1 !default;
368
369/// border
370/// @namespace statement/disabled/bounding
371$tag-border-color-disabled: $color-line1-1 !default;
372
373/// text
374/// @namespace statement/normal/bounding
375$tag-checkable-fill-text-color: $color-text1-3 !default;
376
377/// background
378/// @namespace statement/normal/bounding
379$tag-checkable-fill-bg-color: $color-fill1-3 !default;
380
381/// border
382/// @namespace statement/normal/bounding
383$tag-checkable-fill-border-color: $color-fill1-3 !default;
384
385/// text
386/// @namespace statement/hover/bounding
387$tag-checkable-fill-text-color-hover: $color-text1-4 !default;
388
389/// background
390/// @namespace statement/hover/bounding
391$tag-checkable-fill-bg-color-hover: $color-fill1-4 !default;
392
393/// border
394/// @namespace statement/hover/bounding
395$tag-checkable-fill-border-color-hover: $color-fill1-4 !default;
396
397/// text
398/// @namespace statement/normal/tail
399$tag-checkable-fill-tail-color: $color-text1-3 !default;
400
401/// text
402/// @namespace statement/hover/tail
403$tag-checkable-fill-tail-color-hover: $color-text1-4 !default;
404
405/// text
406/// @namespace statement/disabled/tail
407$tag-checkable-fill-tail-color-disabled: $color-text1-1 !default;
408
409/// text
410/// @namespace statement/disabled/bounding
411$tag-checkable-fill-text-color-disabled: $color-text1-1 !default;
412
413/// border
414/// @namespace statement/disabled/bounding
415$tag-checkable-fill-border-color-disabled: $color-fill1-1 !default;
416
417/// background
418/// @namespace statement/disabled/bounding
419$tag-checkable-fill-bg-color-disabled: $color-fill1-1 !default;
420
421/// text
422/// @namespace statement/normal/bounding
423$tag-checkable-normal-text-color: $color-text1-3 !default;
424
425/// border
426/// @namespace statement/normal/bounding
427$tag-checkable-normal-border-color: $color-line1-3 !default;
428
429/// background
430/// @namespace statement/normal/bounding
431$tag-checkable-normal-bg: $color-transparent !default;
432
433/// text
434/// @namespace statement/hover/bounding
435$tag-checkable-normal-text-color-hover: $color-text1-4 !default;
436
437/// border
438/// @namespace statement/hover/bounding
439$tag-checkable-normal-border-color-hover: $color-line1-3 !default;
440
441/// background
442/// @namespace statement/hover/bounding
443$tag-checkable-normal-bg-hover: $color-transparent !default;
444
445/// text
446/// @namespace statement/selected-disabled/bounding
447$tag-checkable-normal-text-selected-disabled: $color-text1-1 !default;
448
449/// border
450/// @namespace statement/selected-disabled/bounding
451$tag-checkable-normal-border-selected-disabled: $color-line1-1 !default;
452
453/// background
454/// @namespace statement/selected-disabled/bounding
455$tag-checkable-normal-bg-selected-disabled: $color-fill1-1 !default;
456
457/// background
458/// @namespace statement/selected-disabled/bounding
459$tag-checkable-normal-tick-bg-selected-disabled: $color-line1-1 !default;
460
461/// text
462/// @namespace statement/normal/bounding
463$tag-checkable-primary-text-color: $color-white !default;
464
465/// background
466/// @namespace statement/normal/bounding
467$tag-checkable-primary-bg-color: $color-brand1-6 !default;
468
469/// border
470/// @namespace statement/normal/bounding
471$tag-checkable-primary-border-color: $color-brand1-6 !default;
472
473/// text
474/// @namespace statement/disabled/bounding
475$tag-checkable-primary-text-color-disabled: $color-text1-1 !default;
476
477/// text
478/// @namespace statement/hover/bounding
479$tag-checkable-primary-text-color-hover: $color-white !default;
480
481/// background
482/// @namespace statement/hover/bounding
483$tag-checkable-primary-bg-color-hover: $color-brand1-9 !default;
484
485/// border
486/// @namespace statement/hover/bounding
487$tag-checkable-primary-border-color-hover: $color-brand1-9 !default;
488
489/// border
490/// @namespace statement/disabled/bounding
491$tag-checkable-primary-border-color-disabled: $color-fill1-1 !default;
492
493/// background
494/// @namespace statement/disabled/bounding
495$tag-checkable-primary-bg-color-disabled: $color-fill1-1 !default;
496
497/// text
498/// @namespace statement/normal/tail
499$tag-checkable-primary-tail-color: $color-white !default;
500
501/// text
502/// @namespace statement/hover/tail
503$tag-checkable-primary-tail-color-hover: $color-white !default;
504
505/// background
506/// @namespace statement/selected-disabled/tick
507$tag-checkable-secondary-bg-selected-disabled: $color-line1-1 !default;
508
509/// text
510/// @namespace statement/selected/tick
511$tag-checkable-normal-icon-color-selected: $color-white !default;
512
513/// text
514/// @namespace statement/selected-hover/tick
515$tag-checkable-normal-icon-color-selected-hover: $color-white !default;
516
517/// text
518/// @namespace statement/selected-disabled/tick
519$tag-checkable-normal-icon-color-selected-disabled: $color-white !default;
520
521/// text
522/// @namespace statement/selected/tick
523$tag-checkable-secondary-icon-color-selected: $color-white !default;
524
525/// text
526/// @namespace statement/selected-hover/tick
527$tag-checkable-secondary-icon-color-selected-hover: $color-white !default;
528
529/// text
530/// @namespace statement/selected-disabled/tick
531$tag-checkable-secondary-icon-color-selected-disabled: $color-white !default;
532
533
534/// text
535/// @namespace statement/normal/bounding
536$tag-closable-primary-fill-text-color: $color-text1-3 !default;
537/// border
538/// @namespace statement/normal/bounding
539$tag-closable-primary-fill-border-color: $color-fill1-3 !default;
540/// background
541/// @namespace statement/normal/bounding
542$tag-closable-primary-fill-bg-color: $color-fill1-3 !default;
543/// text
544/// @namespace statement/hover/bounding
545$tag-closable-primary-fill-text-color-hover: $color-text1-4 !default;
546/// border
547/// @namespace statement/hover/bounding
548$tag-closable-primary-fill-border-color-hover: $color-fill1-4 !default;
549/// background
550/// @namespace statement/hover/bounding
551$tag-closable-primary-fill-bg-color-hover: $color-fill1-4 !default;
552/// text
553/// @namespace statement/disabled/bounding
554$tag-closable-primary-fill-text-color-disabled: $color-text1-1 !default;
555/// border
556/// @namespace statement/disabled/bounding
557$tag-closable-primary-fill-border-color-disabled: $color-fill1-1 !default;
558/// background
559/// @namespace statement/disabled/bounding
560$tag-closable-primary-fill-bg-color-disabled: $color-fill1-1 !default;
561
562// preset colors , unconfigurable
563$tag-color-preset-blue: #4494F9;
564$tag-color-preset-green: #46BC15;
565$tag-color-preset-orange: #FF9300;
566$tag-color-preset-red: #FF3000;
567$tag-color-preset-turquoise: #01C1B2;
568$tag-color-preset-yellow: #FCCC12;