@semi-bot/semi-theme-tt4d 1.0.6 → 1.0.8
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.
- package/README.md +2 -2
- package/package.json +1 -1
- package/raw.json +28 -25
- package/scss/_font.scss +16 -16
- package/scss/global.scss +22 -16
- package/scss/mixin.scss +12 -3
- package/scss/variables.scss +5 -5
- package/semi.css +204 -198
- package/semi.min.css +1 -1
package/README.md
CHANGED
package/package.json
CHANGED
package/raw.json
CHANGED
|
@@ -967,9 +967,12 @@
|
|
|
967
967
|
"custom": "",
|
|
968
968
|
"shadow": {
|
|
969
969
|
"shadow-0": "none",
|
|
970
|
-
"shadow-1": "0px
|
|
971
|
-
"shadow-2": "0px 4px
|
|
972
|
-
"shadow-
|
|
970
|
+
"shadow-1": "0px 0px 0px 0px rgba(0,0,0,0.08),0px 0px 0px 0px rgba(0,0,0,0)",
|
|
971
|
+
"shadow-2": "0px 2px 4px 0px rgba(0,0,0,0.14),0px 0px 1px 0px rgba(0,0,0,0.16)",
|
|
972
|
+
"shadow-L": "0px 24px 48px -12px rgba(17,24,39,0.18),0px 4px 4px -2px rgba(17,24,39,0.04)",
|
|
973
|
+
"shadow-M": "0px 4px 6px -2px rgba(17,24,39,0.03),0px 12px 16px -4px rgba(17,24,39,0.08),0px 2px 2px -1px rgba(17,24,39,0.04)",
|
|
974
|
+
"shadow-S": "0px 4px 6px -1px rgba(17,24,39,0.1)",
|
|
975
|
+
"shadow-knob": "0px 4px 6px 0px rgba(0,0,0,0.10),0px 0px 1px 0px rgba(0,0,0,0.30)",
|
|
973
976
|
"shadow-elevated": "0px 0px 1px 0px rgba(0,0,0,0.30), 0px 4px 14px 0px rgba(0,0,0,0.10)"
|
|
974
977
|
},
|
|
975
978
|
"spacing": {
|
|
@@ -1418,38 +1421,38 @@
|
|
|
1418
1421
|
"typography": {
|
|
1419
1422
|
"Header": {
|
|
1420
1423
|
"header-1": {
|
|
1421
|
-
"fontSize": "
|
|
1422
|
-
"fontFamily": "TikTokFont,
|
|
1423
|
-
"lineHeight": "
|
|
1424
|
+
"fontSize": "40px",
|
|
1425
|
+
"fontFamily": " TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
1426
|
+
"lineHeight": "48px",
|
|
1424
1427
|
"letterSpacing": "0em"
|
|
1425
1428
|
},
|
|
1426
1429
|
"header-2": {
|
|
1427
|
-
"fontSize": "
|
|
1428
|
-
"fontFamily": " TikTokFont,
|
|
1429
|
-
"lineHeight": "
|
|
1430
|
+
"fontSize": "28px",
|
|
1431
|
+
"fontFamily": " TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
1432
|
+
"lineHeight": "40px",
|
|
1430
1433
|
"letterSpacing": "0em"
|
|
1431
1434
|
},
|
|
1432
1435
|
"header-3": {
|
|
1433
1436
|
"fontSize": "28px",
|
|
1434
|
-
"fontFamily": " TikTokFont,
|
|
1435
|
-
"lineHeight": "
|
|
1437
|
+
"fontFamily": " TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
1438
|
+
"lineHeight": "36px",
|
|
1436
1439
|
"letterSpacing": "0em"
|
|
1437
1440
|
},
|
|
1438
1441
|
"header-4": {
|
|
1439
|
-
"fontSize": "
|
|
1440
|
-
"fontFamily": " TikTokFont,
|
|
1442
|
+
"fontSize": "20px",
|
|
1443
|
+
"fontFamily": " TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
1441
1444
|
"lineHeight": "30px",
|
|
1442
1445
|
"letterSpacing": "0em"
|
|
1443
1446
|
},
|
|
1444
1447
|
"header-5": {
|
|
1445
|
-
"fontSize": "
|
|
1446
|
-
"fontFamily": " TikTokFont,
|
|
1447
|
-
"lineHeight": "
|
|
1448
|
+
"fontSize": "18px",
|
|
1449
|
+
"fontFamily": " TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
1450
|
+
"lineHeight": "22px",
|
|
1448
1451
|
"letterSpacing": "0em"
|
|
1449
1452
|
},
|
|
1450
1453
|
"header-6": {
|
|
1451
1454
|
"fontSize": "16px",
|
|
1452
|
-
"fontFamily": " TikTokFont,
|
|
1455
|
+
"fontFamily": " TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
1453
1456
|
"lineHeight": "20px",
|
|
1454
1457
|
"letterSpacing": "0em"
|
|
1455
1458
|
}
|
|
@@ -1457,13 +1460,13 @@
|
|
|
1457
1460
|
"Paragraph": {
|
|
1458
1461
|
"small": {
|
|
1459
1462
|
"fontSize": "12px",
|
|
1460
|
-
"fontFamily": "
|
|
1463
|
+
"fontFamily": " TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
1461
1464
|
"lineHeight": "16px",
|
|
1462
1465
|
"letterSpacing": "0px"
|
|
1463
1466
|
},
|
|
1464
1467
|
"regular": {
|
|
1465
1468
|
"fontSize": "14px",
|
|
1466
|
-
"fontFamily": "
|
|
1469
|
+
"fontFamily": " TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
1467
1470
|
"lineHeight": "18px",
|
|
1468
1471
|
"letterSpacing": "0em"
|
|
1469
1472
|
}
|
|
@@ -1492,17 +1495,17 @@
|
|
|
1492
1495
|
},
|
|
1493
1496
|
"border-radius": {
|
|
1494
1497
|
"--semi-border-radius-full": "9999px",
|
|
1495
|
-
"--semi-border-radius-large": "
|
|
1496
|
-
"--semi-border-radius-small": "
|
|
1497
|
-
"--semi-border-radius-circle": "
|
|
1498
|
-
"--semi-border-radius-medium": "
|
|
1498
|
+
"--semi-border-radius-large": "24px",
|
|
1499
|
+
"--semi-border-radius-small": "12px",
|
|
1500
|
+
"--semi-border-radius-circle": "8px",
|
|
1501
|
+
"--semi-border-radius-medium": "6px",
|
|
1499
1502
|
"--semi-border-radius-extra-small": "4px"
|
|
1500
1503
|
},
|
|
1501
1504
|
"typography-base": {
|
|
1502
|
-
"scale":
|
|
1505
|
+
"scale": "default",
|
|
1503
1506
|
"default": true,
|
|
1504
1507
|
"wordSpace": 0,
|
|
1505
|
-
"fontFamily": "
|
|
1508
|
+
"fontFamily": " TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif",
|
|
1506
1509
|
"letterSpace": 0,
|
|
1507
1510
|
"baseFontSize": "14px",
|
|
1508
1511
|
"lineHeightMultiplier": 1.4
|
package/scss/_font.scss
CHANGED
|
@@ -1,46 +1,46 @@
|
|
|
1
1
|
@mixin font-size-header-1 {
|
|
2
|
-
font-size:
|
|
3
|
-
font-family: TikTokFont,
|
|
4
|
-
line-height:
|
|
2
|
+
font-size: 40px;
|
|
3
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
4
|
+
line-height: 48px;
|
|
5
5
|
letter-spacing: 0em;
|
|
6
6
|
|
|
7
7
|
|
|
8
8
|
}
|
|
9
9
|
@mixin font-size-header-2 {
|
|
10
|
-
font-size:
|
|
11
|
-
font-family: TikTokFont,
|
|
12
|
-
line-height:
|
|
10
|
+
font-size: 28px;
|
|
11
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
12
|
+
line-height: 40px;
|
|
13
13
|
letter-spacing: 0em;
|
|
14
14
|
|
|
15
15
|
|
|
16
16
|
}
|
|
17
17
|
@mixin font-size-header-3 {
|
|
18
18
|
font-size: 28px;
|
|
19
|
-
font-family: TikTokFont,
|
|
20
|
-
line-height:
|
|
19
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
20
|
+
line-height: 36px;
|
|
21
21
|
letter-spacing: 0em;
|
|
22
22
|
|
|
23
23
|
|
|
24
24
|
}
|
|
25
25
|
@mixin font-size-header-4 {
|
|
26
|
-
font-size:
|
|
27
|
-
font-family: TikTokFont,
|
|
26
|
+
font-size: 20px;
|
|
27
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
28
28
|
line-height: 30px;
|
|
29
29
|
letter-spacing: 0em;
|
|
30
30
|
|
|
31
31
|
|
|
32
32
|
}
|
|
33
33
|
@mixin font-size-header-5 {
|
|
34
|
-
font-size:
|
|
35
|
-
font-family: TikTokFont,
|
|
36
|
-
line-height:
|
|
34
|
+
font-size: 18px;
|
|
35
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
36
|
+
line-height: 22px;
|
|
37
37
|
letter-spacing: 0em;
|
|
38
38
|
|
|
39
39
|
|
|
40
40
|
}
|
|
41
41
|
@mixin font-size-header-6 {
|
|
42
42
|
font-size: 16px;
|
|
43
|
-
font-family: TikTokFont,
|
|
43
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
44
44
|
line-height: 20px;
|
|
45
45
|
letter-spacing: 0em;
|
|
46
46
|
|
|
@@ -48,7 +48,7 @@ letter-spacing: 0em;
|
|
|
48
48
|
}
|
|
49
49
|
@mixin font-size-small {
|
|
50
50
|
font-size: 12px;
|
|
51
|
-
font-family:
|
|
51
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
52
52
|
line-height: 16px;
|
|
53
53
|
letter-spacing: 0px;
|
|
54
54
|
|
|
@@ -56,7 +56,7 @@ letter-spacing: 0px;
|
|
|
56
56
|
}
|
|
57
57
|
@mixin font-size-regular {
|
|
58
58
|
font-size: 14px;
|
|
59
|
-
font-family:
|
|
59
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
60
60
|
line-height: 18px;
|
|
61
61
|
letter-spacing: 0em;
|
|
62
62
|
|
package/scss/global.scss
CHANGED
|
@@ -182,18 +182,21 @@ body, body[theme-mode="dark"] .semi-always-light, :host, :host .semi-always-ligh
|
|
|
182
182
|
--semi-color-Data-Sequential-Color-7: rgba(0,92,175,1);
|
|
183
183
|
--semi-color-Data-Sequential-Color-8: rgba(3,69,134,1);
|
|
184
184
|
--semi-color-Data-Sequential-Color-9: rgba(1,46,93,1);
|
|
185
|
-
font-family:
|
|
185
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
186
186
|
-webkit-font-smoothing: antialiased;;
|
|
187
187
|
--semi-shadow-elevated: 0px 0px 1px 0px rgba(0,0,0,0.30), 0px 4px 14px 0px rgba(0,0,0,0.10);
|
|
188
188
|
--semi-shadow-0: none;
|
|
189
|
-
--semi-shadow-1: 0px
|
|
190
|
-
--semi-shadow-2: 0px 4px
|
|
191
|
-
--semi-shadow-
|
|
189
|
+
--semi-shadow-1: 0px 0px 0px 0px rgba(0,0,0,0.08),0px 0px 0px 0px rgba(0,0,0,0);
|
|
190
|
+
--semi-shadow-2: 0px 2px 4px 0px rgba(0,0,0,0.14),0px 0px 1px 0px rgba(0,0,0,0.16);
|
|
191
|
+
--semi-shadow-L: 0px 24px 48px -12px rgba(17,24,39,0.18),0px 4px 4px -2px rgba(17,24,39,0.04);
|
|
192
|
+
--semi-shadow-M: 0px 4px 6px -2px rgba(17,24,39,0.03),0px 12px 16px -4px rgba(17,24,39,0.08),0px 2px 2px -1px rgba(17,24,39,0.04);
|
|
193
|
+
--semi-shadow-S: 0px 4px 6px -1px rgba(17,24,39,0.1);
|
|
194
|
+
--semi-shadow-knob: 0px 4px 6px 0px rgba(0,0,0,0.10),0px 0px 1px 0px rgba(0,0,0,0.30);
|
|
192
195
|
--semi-border-radius-full: 9999px;
|
|
193
|
-
--semi-border-radius-large:
|
|
194
|
-
--semi-border-radius-small:
|
|
195
|
-
--semi-border-radius-circle:
|
|
196
|
-
--semi-border-radius-medium:
|
|
196
|
+
--semi-border-radius-large: 24px;
|
|
197
|
+
--semi-border-radius-small: 12px;
|
|
198
|
+
--semi-border-radius-circle: 8px;
|
|
199
|
+
--semi-border-radius-medium: 6px;
|
|
197
200
|
--semi-border-radius-extra-small: 4px;
|
|
198
201
|
|
|
199
202
|
|
|
@@ -298,18 +301,21 @@ body[theme-mode="dark"], body .semi-always-dark, :host([theme-mode="dark"]), :ho
|
|
|
298
301
|
--semi-color-tertiary-light-default: rgba(var(--semi-grey-5), 0.2);
|
|
299
302
|
--semi-color-secondary-light-active: rgba(var(--semi-blue-5), 0.4);
|
|
300
303
|
--semi-color-secondary-light-default: rgba(var(--semi-blue-5), 0.2);
|
|
301
|
-
font-family:
|
|
304
|
+
font-family: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
302
305
|
-webkit-font-smoothing: antialiased;;
|
|
303
306
|
--semi-shadow-elevated: 0px 0px 1px 0px rgba(0,0,0,0.30), 0px 4px 14px 0px rgba(0,0,0,0.10);
|
|
304
307
|
--semi-shadow-0: none;
|
|
305
|
-
--semi-shadow-1: 0px
|
|
306
|
-
--semi-shadow-2: 0px 4px
|
|
307
|
-
--semi-shadow-
|
|
308
|
+
--semi-shadow-1: 0px 0px 0px 0px rgba(0,0,0,0.08),0px 0px 0px 0px rgba(0,0,0,0);
|
|
309
|
+
--semi-shadow-2: 0px 2px 4px 0px rgba(0,0,0,0.14),0px 0px 1px 0px rgba(0,0,0,0.16);
|
|
310
|
+
--semi-shadow-L: 0px 24px 48px -12px rgba(17,24,39,0.18),0px 4px 4px -2px rgba(17,24,39,0.04);
|
|
311
|
+
--semi-shadow-M: 0px 4px 6px -2px rgba(17,24,39,0.03),0px 12px 16px -4px rgba(17,24,39,0.08),0px 2px 2px -1px rgba(17,24,39,0.04);
|
|
312
|
+
--semi-shadow-S: 0px 4px 6px -1px rgba(17,24,39,0.1);
|
|
313
|
+
--semi-shadow-knob: 0px 4px 6px 0px rgba(0,0,0,0.10),0px 0px 1px 0px rgba(0,0,0,0.30);
|
|
308
314
|
--semi-border-radius-full: 9999px;
|
|
309
|
-
--semi-border-radius-large:
|
|
310
|
-
--semi-border-radius-small:
|
|
311
|
-
--semi-border-radius-circle:
|
|
312
|
-
--semi-border-radius-medium:
|
|
315
|
+
--semi-border-radius-large: 24px;
|
|
316
|
+
--semi-border-radius-small: 12px;
|
|
317
|
+
--semi-border-radius-circle: 8px;
|
|
318
|
+
--semi-border-radius-medium: 6px;
|
|
313
319
|
--semi-border-radius-extra-small: 4px;
|
|
314
320
|
|
|
315
321
|
|
package/scss/mixin.scss
CHANGED
|
@@ -2,13 +2,22 @@
|
|
|
2
2
|
box-shadow: none;
|
|
3
3
|
};
|
|
4
4
|
@mixin shadow-1 {
|
|
5
|
-
box-shadow: 0px
|
|
5
|
+
box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.08),0px 0px 0px 0px rgba(0,0,0,0);
|
|
6
6
|
};
|
|
7
7
|
@mixin shadow-2 {
|
|
8
|
-
box-shadow: 0px 4px
|
|
8
|
+
box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.14),0px 0px 1px 0px rgba(0,0,0,0.16);
|
|
9
|
+
};
|
|
10
|
+
@mixin shadow-L {
|
|
11
|
+
box-shadow: 0px 24px 48px -12px rgba(17,24,39,0.18),0px 4px 4px -2px rgba(17,24,39,0.04);
|
|
12
|
+
};
|
|
13
|
+
@mixin shadow-M {
|
|
14
|
+
box-shadow: 0px 4px 6px -2px rgba(17,24,39,0.03),0px 12px 16px -4px rgba(17,24,39,0.08),0px 2px 2px -1px rgba(17,24,39,0.04);
|
|
15
|
+
};
|
|
16
|
+
@mixin shadow-S {
|
|
17
|
+
box-shadow: 0px 4px 6px -1px rgba(17,24,39,0.1);
|
|
9
18
|
};
|
|
10
19
|
@mixin shadow-knob {
|
|
11
|
-
box-shadow: 0px
|
|
20
|
+
box-shadow: 0px 4px 6px 0px rgba(0,0,0,0.10),0px 0px 1px 0px rgba(0,0,0,0.30);
|
|
12
21
|
};
|
|
13
22
|
@mixin shadow-elevated {
|
|
14
23
|
box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.30), 0px 4px 14px 0px rgba(0,0,0,0.10);
|
package/scss/variables.scss
CHANGED
|
@@ -55,16 +55,16 @@ $z-resizable_handler: 2000; // 伸缩框组件中handler的z-index
|
|
|
55
55
|
// font
|
|
56
56
|
|
|
57
57
|
|
|
58
|
-
$font-family-regular:
|
|
58
|
+
$font-family-regular: TikTok Sans, TikTokFont, 'Segoe UI', 'Inter', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif; // semi 预置字体回退
|
|
59
59
|
$font-size-small: 12px; // 小文本字号
|
|
60
60
|
$font-size-regular: 14px; // 常规文本字号
|
|
61
61
|
|
|
62
62
|
$font-size-header-6: 16px; // 六级标题字号
|
|
63
|
-
$font-size-header-5:
|
|
64
|
-
$font-size-header-4:
|
|
63
|
+
$font-size-header-5: 18px; // 五级标题字号
|
|
64
|
+
$font-size-header-4: 20px; // 四级标题字号
|
|
65
65
|
$font-size-header-3: 28px; // 三级标题字号
|
|
66
|
-
$font-size-header-2:
|
|
67
|
-
$font-size-header-1:
|
|
66
|
+
$font-size-header-2: 28px; // 二级标题字号
|
|
67
|
+
$font-size-header-1: 40px; // 一级标题字号
|
|
68
68
|
|
|
69
69
|
|
|
70
70
|
$font-weight-light: 200; // 字重 - 轻
|