@bifrostui/styles 2.0.0-alpha.6 → 2.0.0-alpha.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.
Files changed (8) hide show
  1. package/dist/index.css +16 -22
  2. package/package.json +1 -1
  3. package/registry/dm-light.mjs +2 -2
  4. package/registry/pioneer-light.mjs +18 -9
  5. package/themes/dm-light.less +1 -1
  6. package/themes/index.less +0 -1
  7. package/themes/pioneer-light.less +19 -9
  8. package/themes/pioneer-light-components.less +0 -55
package/dist/index.css CHANGED
@@ -4,18 +4,6 @@
4
4
  /** 此文件由脚本自动生成，请勿直接修改，若有变更请维护bui-styles/registry/*.mjs，再执行`pnpm theme:js2less`更新主题 */
5
5
  /** 此文件由脚本自动生成，请勿直接修改，若有变更请维护bui-styles/registry/*.mjs，再执行`pnpm theme:js2less`更新主题 */
6
6
  /** 此文件由脚本自动生成，请勿直接修改，若有变更请维护bui-styles/registry/*.mjs，再执行`pnpm theme:js2less`更新主题 */
7
- .bui-pioneer-light .bui-btn.bui-btn-contained.bui-btn-primary.bui-btn-large,
8
- [data-color-mode][data-theme='pioneer'] .bui-btn.bui-btn-contained.bui-btn-primary.bui-btn-large {
9
- background-image: radial-gradient(35px 25px ellipse at 2% 110%, #fffe1e 0%, rgba(251, 134, 35, 0) 99%), radial-gradient(35px 25px ellipse at 110% 120%, #ff3018 0%, rgba(0, 48, 24, 0) 92%), linear-gradient(90deg, #fc8622 0%, #ff5000 100%);
10
- }
11
- .bui-pioneer-light .bui-btn.bui-btn-contained.bui-btn-primary.bui-btn-full,
12
- [data-color-mode][data-theme='pioneer'] .bui-btn.bui-btn-contained.bui-btn-primary.bui-btn-full {
13
- background-image: radial-gradient(93px 50px ellipse at 2% 110%, #fffe1e 0%, rgba(251, 134, 35, 0) 100%), radial-gradient(93px 50px ellipse at 98% 110%, #ff3018 0%, rgba(0, 48, 24, 0) 92%), linear-gradient(90deg, #fc8622 0%, #ff5000 100%);
14
- }
15
- .bui-pioneer-light .bui-tabs .bui-tabs-indicator,
16
- [data-color-mode][data-theme='pioneer'] .bui-tabs .bui-tabs-indicator {
17
- background-image: linear-gradient(90deg, #ff9b00 0%, #ffa700 21%, #ff8300 100%);
18
- }
19
7
  /* 经典 */
20
8
  :root,
21
9
  page,
@@ -192,7 +180,7 @@ xhs-page,
192
180
  --bui-color-blue-dark: #2b9ce5;
193
181
  --bui-color-aiblue: #5cfffa;
194
182
  --bui-color-aiblue-light: #f0fffc;
195
- --bui-color-aiblue-dark: #1d858c;
183
+ --bui-color-aiblue-dark: #00898e;
196
184
  --bui-color-primary-start: var(--bui-color-red);
197
185
  --bui-color-primary-end: #ff4a72;
198
186
  --bui-color-info-start: #51bbff;
@@ -236,18 +224,21 @@ xhs-page,
236
224
  --bui-color-blue-dark: #0757a3;
237
225
  --bui-color-aiblue: #5cfffa;
238
226
  --bui-color-aiblue-light: #f0fffc;
239
- --bui-color-aiblue-dark: #1d858c;
227
+ --bui-color-aiblue-dark: #00898e;
240
228
  --bui-color-primary: var(--bui-color-orange);
241
229
  --bui-color-primary-light: var(--bui-color-orange-light);
242
230
  --bui-color-primary-dark: var(--bui-color-orange-dark);
231
+ --bui-color-warning: var(--bui-color-yellow);
232
+ --bui-color-warning-light: var(--bui-color-yellow-light);
233
+ --bui-color-warning-dark: var(--bui-color-yellow-dark);
243
234
  --bui-title-size-4: var(--bui-font-size-md1);
244
235
  --bui-color-fg-disabled: rgba(3, 11, 26, 0.5);
245
236
  --bui-color-border-primary: rgba(255, 80, 0, 0.4);
246
237
  --bui-color-border-info: rgba(34, 154, 240, 0.4);
247
238
  --bui-color-border-success: rgba(64, 191, 0, 0.4);
248
- --bui-color-border-warning: rgba(255, 80, 0, 0.4);
239
+ --bui-color-border-warning: rgba(255, 166, 8, 0.4);
249
240
  --bui-color-border-danger: rgba(255, 71, 26, 0.4);
250
- --bui-color-primary-start: #ffb300;
241
+ --bui-color-primary-start: #ff8500;
251
242
  --bui-color-primary-end: var(--bui-color-primary);
252
243
  --bui-color-info-start: #5bc8ff;
253
244
  --bui-color-info-end: var(--bui-color-info);
@@ -260,14 +251,16 @@ xhs-page,
260
251
  --bui-shape-radius-drawer: var(--bui-radius-6);
261
252
  --bui-shape-radius-card: var(--bui-radius-5);
262
253
  --bui-shape-radius-default: var(--bui-radius-4);
254
+ --bui-btn-small-height: 21px;
263
255
  --bui-btn-full-height: 45px;
264
- --bui-btn-large-height: 30px;
265
- --bui-btn-full-font-size: 18px;
256
+ --bui-btn-large-height: 45px;
257
+ --bui-btn-full-font-size: var(--bui-title-size-3);
258
+ --bui-btn-large-font-size: var(--bui-title-size-3);
266
259
  --bui-btn-full-font-family: var(--bui-font-family-accent);
267
- --bui-btn-small-border-radius: 6px;
268
- --bui-btn-border-radius: 6px;
269
- --bui-btn-large-border-radius: 7px;
270
- --bui-btn-full-border-radius: 14px;
260
+ --bui-btn-small-border-radius: var(--bui-radius-3);
261
+ --bui-btn-border-radius: var(--bui-radius-4);
262
+ --bui-btn-large-border-radius: var(--bui-radius-5);
263
+ --bui-btn-full-border-radius: var(--bui-radius-5);
271
264
  --bui-card-header-title-font-size: var(--bui-title-size-3);
272
265
  --bui-tab-font-size: var(--bui-title-size-4);
273
266
  --bui-tab-color: var(--bui-color-fg-muted);
@@ -275,6 +268,7 @@ xhs-page,
275
268
  --bui-tabs-indicator-height: 4PX;
276
269
  --bui-tabs-indicator-border-radius: 2px;
277
270
  --bui-tabs-indicator-box-shadow: 0 2px 4px 0 rgba(255, 98, 0, 0.2);
271
+ --bui-tabs-indicator-bg: linear-gradient(90deg, var(--bui-color-primary-start) 0%, var(--bui-color-primary-end) 100%);
278
272
  }
279
273
  /** 暗黑模式 */
280
274
  .bui-dark,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bifrostui/styles",
3
- "version": "2.0.0-alpha.6",
3
+ "version": "2.0.0-alpha.8",
4
4
  "main": "dist/index.css",
5
5
  "description": "Common style definitions for BUI React components",
6
6
  "homepage": "http://bui.taopiaopiao.com",
package/registry/dm-light.mjs CHANGED
@@ -36,7 +36,7 @@ export const dmLight = {
36
36
  /** 智能蓝 */
37
37
  '--bui-color-aiblue': '#5cfffa',
38
38
  '--bui-color-aiblue-light': '#f0fffc',
39
- '--bui-color-aiblue-dark': '#1d858c',
39
+ '--bui-color-aiblue-dark': '#00898e',
40
40
 
41
41
  /** 主题色渐变 */
42
42
  '--bui-color-primary-start': 'var(--bui-color-red)',
@@ -57,4 +57,4 @@ export const dmLight = {
57
57
  '--bui-color-border-warning': 'rgba(255, 175, 0, 0.4)',
58
58
  '--bui-color-border-danger': 'rgba(255, 50, 153, 0.4)',
59
59
  },
60
- };
60
+ };
package/registry/pioneer-light.mjs CHANGED
@@ -45,13 +45,18 @@ export const pioneerLight = {
45
45
  /** 智能蓝 */
46
46
  '--bui-color-aiblue': '#5cfffa',
47
47
  '--bui-color-aiblue-light': '#f0fffc',
48
- '--bui-color-aiblue-dark': '#1d858c',
48
+ '--bui-color-aiblue-dark': '#00898e',
49
49
 
50
50
  /** 主题 */
51
51
  '--bui-color-primary': 'var(--bui-color-orange)',
52
52
  '--bui-color-primary-light': 'var(--bui-color-orange-light)',
53
53
  '--bui-color-primary-dark': 'var(--bui-color-orange-dark)',
54
54
 
55
+ /** 警告 */
56
+ '--bui-color-warning': 'var(--bui-color-yellow)',
57
+ '--bui-color-warning-light': 'var(--bui-color-yellow-light)',
58
+ '--bui-color-warning-dark': 'var(--bui-color-yellow-dark)',
59
+
55
60
  /** 语义化字号 */
56
61
  '--bui-title-size-4': 'var(--bui-font-size-md1)',
57
62
 
@@ -62,11 +67,11 @@ export const pioneerLight = {
62
67
  '--bui-color-border-primary': 'rgba(255, 80, 0, 0.4)',
63
68
  '--bui-color-border-info': 'rgba(34, 154, 240, 0.4)',
64
69
  '--bui-color-border-success': 'rgba(64, 191, 0, 0.4)',
65
- '--bui-color-border-warning': 'rgba(255, 80, 0, 0.4)',
70
+ '--bui-color-border-warning': 'rgba(255, 166, 8, 0.4)',
66
71
  '--bui-color-border-danger': 'rgba(255, 71, 26, 0.4)',
67
72
 
68
73
  /** 主题色渐变 */
69
- '--bui-color-primary-start': '#ffb300',
74
+ '--bui-color-primary-start': '#ff8500',
70
75
  '--bui-color-primary-end': 'var(--bui-color-primary)',
71
76
  '--bui-color-info-start': '#5bc8ff',
72
77
  '--bui-color-info-end': 'var(--bui-color-info)',
@@ -85,14 +90,16 @@ export const pioneerLight = {
85
90
  '--bui-shape-radius-default': 'var(--bui-radius-4)',
86
91
 
87
92
  // Button
93
+ '--bui-btn-small-height': '21px',
88
94
  '--bui-btn-full-height': '45px',
89
- '--bui-btn-large-height': '30px',
90
- '--bui-btn-full-font-size': '18px',
95
+ '--bui-btn-large-height': '45px',
96
+ '--bui-btn-full-font-size': 'var(--bui-title-size-3)',
97
+ '--bui-btn-large-font-size': 'var(--bui-title-size-3)',
91
98
  '--bui-btn-full-font-family': 'var(--bui-font-family-accent)',
92
- '--bui-btn-small-border-radius': '6px',
93
- '--bui-btn-border-radius': '6px',
94
- '--bui-btn-large-border-radius': '7px',
95
- '--bui-btn-full-border-radius': '14px',
99
+ '--bui-btn-small-border-radius': 'var(--bui-radius-3)',
100
+ '--bui-btn-border-radius': 'var(--bui-radius-4)',
101
+ '--bui-btn-large-border-radius': 'var(--bui-radius-5)',
102
+ '--bui-btn-full-border-radius': 'var(--bui-radius-5)',
96
103
 
97
104
  // Card
98
105
  '--bui-card-header-title-font-size': 'var(--bui-title-size-3)',
@@ -103,5 +110,7 @@ export const pioneerLight = {
103
110
  '--bui-tabs-indicator-height': '4PX',
104
111
  '--bui-tabs-indicator-border-radius': '2px',
105
112
  '--bui-tabs-indicator-box-shadow': '0 2px 4px 0 rgba(255, 98, 0, 0.2)',
113
+ '--bui-tabs-indicator-bg':
114
+ 'linear-gradient(90deg,var(--bui-color-primary-start) 0%,var(--bui-color-primary-end) 100%)',
106
115
  },
107
116
  };
package/themes/dm-light.less CHANGED
@@ -20,7 +20,7 @@
20
20
  --bui-color-blue-dark: #2b9ce5;
21
21
  --bui-color-aiblue: #5cfffa;
22
22
  --bui-color-aiblue-light: #f0fffc;
23
- --bui-color-aiblue-dark: #1d858c;
23
+ --bui-color-aiblue-dark: #00898e;
24
24
  --bui-color-primary-start: var(--bui-color-red);
25
25
  --bui-color-primary-end: #ff4a72;
26
26
  --bui-color-info-start: #51bbff;
package/themes/index.less CHANGED
@@ -3,4 +3,3 @@
3
3
  @import './default-dark.less';
4
4
  @import './dm-light.less';
5
5
  @import './pioneer-light.less';
6
- @import './pioneer-light-components.less';
package/themes/pioneer-light.less CHANGED
@@ -27,18 +27,21 @@
27
27
  --bui-color-blue-dark: #0757a3;
28
28
  --bui-color-aiblue: #5cfffa;
29
29
  --bui-color-aiblue-light: #f0fffc;
30
- --bui-color-aiblue-dark: #1d858c;
30
+ --bui-color-aiblue-dark: #00898e;
31
31
  --bui-color-primary: var(--bui-color-orange);
32
32
  --bui-color-primary-light: var(--bui-color-orange-light);
33
33
  --bui-color-primary-dark: var(--bui-color-orange-dark);
34
+ --bui-color-warning: var(--bui-color-yellow);
35
+ --bui-color-warning-light: var(--bui-color-yellow-light);
36
+ --bui-color-warning-dark: var(--bui-color-yellow-dark);
34
37
  --bui-title-size-4: var(--bui-font-size-md1);
35
38
  --bui-color-fg-disabled: rgba(3, 11, 26, 0.5);
36
39
  --bui-color-border-primary: rgba(255, 80, 0, 0.4);
37
40
  --bui-color-border-info: rgba(34, 154, 240, 0.4);
38
41
  --bui-color-border-success: rgba(64, 191, 0, 0.4);
39
- --bui-color-border-warning: rgba(255, 80, 0, 0.4);
42
+ --bui-color-border-warning: rgba(255, 166, 8, 0.4);
40
43
  --bui-color-border-danger: rgba(255, 71, 26, 0.4);
41
- --bui-color-primary-start: #ffb300;
44
+ --bui-color-primary-start: #ff8500;
42
45
  --bui-color-primary-end: var(--bui-color-primary);
43
46
  --bui-color-info-start: #5bc8ff;
44
47
  --bui-color-info-end: var(--bui-color-info);
@@ -51,14 +54,16 @@
51
54
  --bui-shape-radius-drawer: var(--bui-radius-6);
52
55
  --bui-shape-radius-card: var(--bui-radius-5);
53
56
  --bui-shape-radius-default: var(--bui-radius-4);
57
+ --bui-btn-small-height: 21px;
54
58
  --bui-btn-full-height: 45px;
55
- --bui-btn-large-height: 30px;
56
- --bui-btn-full-font-size: 18px;
59
+ --bui-btn-large-height: 45px;
60
+ --bui-btn-full-font-size: var(--bui-title-size-3);
61
+ --bui-btn-large-font-size: var(--bui-title-size-3);
57
62
  --bui-btn-full-font-family: var(--bui-font-family-accent);
58
- --bui-btn-small-border-radius: 6px;
59
- --bui-btn-border-radius: 6px;
60
- --bui-btn-large-border-radius: 7px;
61
- --bui-btn-full-border-radius: 14px;
63
+ --bui-btn-small-border-radius: var(--bui-radius-3);
64
+ --bui-btn-border-radius: var(--bui-radius-4);
65
+ --bui-btn-large-border-radius: var(--bui-radius-5);
66
+ --bui-btn-full-border-radius: var(--bui-radius-5);
62
67
  --bui-card-header-title-font-size: var(--bui-title-size-3);
63
68
  --bui-tab-font-size: var(--bui-title-size-4);
64
69
  --bui-tab-color: var(--bui-color-fg-muted);
@@ -67,4 +72,9 @@
67
72
  --bui-tabs-indicator-height: 4PX;
68
73
  --bui-tabs-indicator-border-radius: 2px;
69
74
  --bui-tabs-indicator-box-shadow: 0 2px 4px 0 rgba(255, 98, 0, 0.2);
75
+ --bui-tabs-indicator-bg: linear-gradient(
76
+ 90deg,
77
+ var(--bui-color-primary-start) 0%,
78
+ var(--bui-color-primary-end) 100%
79
+ );
70
80
  }
package/themes/pioneer-light-components.less DELETED
@@ -1,55 +0,0 @@
1
- // 无法用css variables实现的先锋版高亮主题色
2
- @import '../mixins/variables.less';
3
-
4
- .pioneer-light-components() {
5
- .bui-btn {
6
- &.bui-btn-contained {
7
- &.bui-btn-primary {
8
- &.bui-btn-large {
9
- background-image:
10
- radial-gradient(
11
- 35px 25px ellipse at 2% 110%,
12
- #fffe1e 0%,
13
- rgba(251, 134, 35, 0) 99%
14
- ),
15
- radial-gradient(
16
- 35px 25px ellipse at 110% 120%,
17
- #ff3018 0%,
18
- rgba(0, 48, 24, 0) 92%
19
- ),
20
- linear-gradient(90deg, #fc8622 0%, #ff5000 100%);
21
- }
22
-
23
- &.bui-btn-full {
24
- background-image:
25
- radial-gradient(
26
- 93px 50px ellipse at 2% 110%,
27
- #fffe1e 0%,
28
- rgba(251, 134, 35, 0) 100%
29
- ),
30
- radial-gradient(
31
- 93px 50px ellipse at 98% 110%,
32
- #ff3018 0%,
33
- rgba(0, 48, 24, 0) 92%
34
- ),
35
- linear-gradient(90deg, #fc8622 0%, #ff5000 100%);
36
- }
37
- }
38
- }
39
- }
40
-
41
- .bui-tabs {
42
- .bui-tabs-indicator {
43
- background-image: linear-gradient(
44
- 90deg,
45
- #ff9b00 0%,
46
- #ffa700 21%,
47
- #ff8300 100%
48
- );
49
- }
50
- }
51
- }
52
-
53
- @{theme-selector-pioneer-light} {
54
- .pioneer-light-components();
55
- }