|
15 | 15 | // 标签字体的行高
|
16 | 16 | --tv-Tag-line-height: var(--tv-line-height-number);
|
17 | 17 |
|
18 |
| - //------------------------------------------------------- 尺寸 场景:fontsize, border-radius ,padding-x,y ------- |
| 18 | + //------------------------------------------------------- 尺寸 场景:font-size, border-radius ,padding-x,y ------- |
| 19 | + |
| 20 | + /** 由于 tag 有border的,所有的padding值比设计图减少1 */ |
| 21 | + |
19 | 22 | // 超小标签字号
|
20 |
| - --tv-Tag-font-size-mini: 10px; |
| 23 | + --tv-Tag-font-size-mini: var(--tv-font-size-sm); |
21 | 24 | // 超小标签水平间距
|
22 |
| - --tv-Tag-padding-x-mini: var(--tv-space-sm); |
| 25 | + --tv-Tag-padding-x-mini: 3px; |
23 | 26 | // 超小标签垂直间距
|
24 |
| - --tv-Tag-padding-y-mini: 0.5px; |
| 27 | + --tv-Tag-padding-y-mini: 0; |
25 | 28 | // 超小标签圆角
|
26 | 29 | --tv-Tag-border-radius-mini: var(--tv-border-radius-xs);
|
27 | 30 | // 标签在仅图标模式时,图标的大小
|
|
32 | 35 | // 小型标签字号
|
33 | 36 | --tv-Tag-font-size-small: var(--tv-font-size-sm);
|
34 | 37 | // 小型标签水平间距
|
35 |
| - --tv-Tag-padding-x-small: var(--tv-space-sm); |
| 38 | + --tv-Tag-padding-x-small: 7px; |
36 | 39 | // 小型标签垂直间距
|
37 |
| - --tv-Tag-padding-y-small: 0; |
| 40 | + --tv-Tag-padding-y-small: 2px; |
38 | 41 | // 小型标签圆角
|
39 |
| - --tv-Tag-border-radius-small: var(--tv-border-radius-xs); |
| 42 | + --tv-Tag-border-radius-small: var(--tv-border-radius-sm); |
40 | 43 | // 标签在仅图标模式时,图标的大小
|
41 | 44 | --tv-Tag-only-icon-font-size-small: 14px;
|
42 | 45 | // 标签在仅图标模式时,标签的内边距
|
43 |
| - --tv-Tag-only-icon-padding-small: 2px; |
| 46 | + --tv-Tag-only-icon-padding-small: 0.5px; |
44 | 47 |
|
45 | 48 | // 默认标签字号
|
46 | 49 | --tv-Tag-font-size: var(--tv-font-size-md);
|
47 | 50 | // 默认标签水平间距
|
48 |
| - --tv-Tag-padding-x: var(--tv-space-md); |
| 51 | + --tv-Tag-padding-x: 11px; |
49 | 52 | // 默认标签垂直间距
|
50 |
| - --tv-Tag-padding-y: 0.5px; |
| 53 | + --tv-Tag-padding-y: 2.5px; |
51 | 54 | // 默认标签圆角
|
52 |
| - --tv-Tag-border-radius: var(--tv-border-radius-sm); |
| 55 | + --tv-Tag-border-radius: var(--tv-border-radius-md); |
53 | 56 | // 标签在仅图标模式时,图标的大小
|
54 | 57 | --tv-Tag-only-icon-font-size: 16px;
|
55 | 58 | // 标签在仅图标模式时,标签的内边距
|
56 | 59 | --tv-Tag-only-icon-padding: 3px;
|
57 | 60 |
|
58 | 61 | // 中等标签字号
|
59 |
| - --tv-Tag-font-size-medium: var(--tv-font-size-md); |
| 62 | + --tv-Tag-font-size-medium: var(--tv-font-size-md); //14 |
60 | 63 | // 中等标签水平间距
|
61 |
| - --tv-Tag-padding-x-medium: var(--tv-space-lg); |
| 64 | + --tv-Tag-padding-x-medium: 11px; |
62 | 65 | // 中等标签垂直间距
|
63 | 66 | --tv-Tag-padding-y-medium: 4.5px;
|
64 | 67 | // 中等标签圆角
|
65 | 68 | --tv-Tag-border-radius-medium: var(--tv-border-radius-md);
|
66 | 69 | // 标签在仅图标模式时,图标的大小
|
67 |
| - --tv-Tag-only-icon-font-size-medium: 20px; |
| 70 | + --tv-Tag-only-icon-font-size-medium: 16px; |
68 | 71 | // 标签在仅图标模式时,标签的内边距
|
69 |
| - --tv-Tag-only-icon-padding-medium: 5px; |
| 72 | + --tv-Tag-only-icon-padding-medium: 7px; |
70 | 73 |
|
71 | 74 | //------------------------------------------------------- 颜色 场景:(1、考虑border,虽然cloud design没有,但适配其它肯定有border的) ----
|
72 | 75 |
|
|
0 commit comments