@bifrostui/styles 1.5.3 → 2.0.0-alpha.1

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 (21) hide show
  1. package/dist/index.css +193 -296
  2. package/index.less +12 -66
  3. package/mixins/gradient.less +1 -1
  4. package/mixins/variables.less +1 -1
  5. package/package.json +11 -2
  6. package/registry/default-dark.mjs +34 -0
  7. package/registry/default-light.mjs +211 -0
  8. package/registry/dm-light.mjs +60 -0
  9. package/registry/index.mjs +4 -0
  10. package/registry/pioneer-light.mjs +107 -0
  11. package/themes/default-dark.less +21 -0
  12. package/themes/default-light.less +151 -0
  13. package/themes/dm-light.less +39 -0
  14. package/themes/index.less +6 -0
  15. package/themes/pioneer-light-components.less +51 -0
  16. package/themes/pioneer-light.less +70 -0
  17. package/theme/default-dark.less +0 -29
  18. package/theme/default-light.less +0 -154
  19. package/theme/dm-dark.less +0 -33
  20. package/theme/dm-light.less +0 -19
  21. package/theme/index.less +0 -4
package/package.json CHANGED
@@ -1,13 +1,21 @@
1
1
  {
2
2
  "name": "@bifrostui/styles",
3
- "version": "1.5.3",
3
+ "version": "2.0.0-alpha.1",
4
4
  "main": "dist/index.css",
5
5
  "description": "Common style definitions for BUI React components",
6
6
  "homepage": "http://bui.taopiaopiao.com",
7
7
  "license": "MIT",
8
+ "exports": {
9
+ ".": "./dist/index.css",
10
+ "./index.less": "./index.less",
11
+ "./themes": "./themes/index.less",
12
+ "./registry": "./registry/index.mjs",
13
+ "./mixins/index.less": "./mixins/index.less"
14
+ },
8
15
  "files": [
9
16
  "index.less",
10
- "theme",
17
+ "themes",
18
+ "registry",
11
19
  "mixins",
12
20
  "dist",
13
21
  "package.json",
@@ -21,6 +29,7 @@
21
29
  "less": "^4.2.0"
22
30
  },
23
31
  "scripts": {
32
+ "theme:create": "node ./scripts/create-theme.mjs",
24
33
  "build": "rm -rf dist && mkdir dist && lessc index.less > dist/index.css"
25
34
  }
26
35
  }
package/registry/default-dark.mjs ADDED
@@ -0,0 +1,34 @@
1
+ export const defaultDark = {
2
+ name: 'defaultDark',
3
+ label: 'Default Dark',
4
+ mixinName: 'default-dark',
5
+ cssVars: {
6
+ // default是最通用的色彩，比如标题和一级信息
7
+ '--bui-color-fg-default': '#f0f6fc',
8
+ // 柔和色，通常用于次级及补充说明信息
9
+ '--bui-color-fg-muted': '#8b949e',
10
+ // 淡色，很细微的色彩，用于辅助和需要弱化的信息
11
+ '--bui-color-fg-subtle': '#484f58',
12
+ // 用于失效、不可用等状态
13
+ '--bui-color-fg-disabled': '#484f58',
14
+
15
+ // 默认背景色
16
+ '--bui-color-bg-default': '#010409',
17
+ // 视图背景色
18
+ '--bui-color-bg-view': '#161b22',
19
+ '--bui-color-bg-popover': 'rgba(72, 79, 88, 0.7)',
20
+ '--bui-color-bg-alpha-light-9': 'rgba(22, 27, 34, 0.9)',
21
+ '--bui-color-bg-alpha-light-7': 'rgba(22, 27, 34, 0.7)',
22
+ '--bui-color-bg-alpha-light-5': 'rgba(22, 27, 34, 0.5)',
23
+ '--bui-color-bg-alpha-light-3': 'rgba(22, 27, 34, 0.3)',
24
+ '--bui-color-bg-alpha-light-1': 'rgba(22, 27, 34, 0.1)',
25
+ '--bui-color-bg-alpha-dark-9': 'rgba(72, 79, 88, 0.9)',
26
+ '--bui-color-bg-alpha-dark-7': 'rgba(72, 79, 88, 0.7)',
27
+ '--bui-color-bg-alpha-dark-5': 'rgba(72, 79, 88, 0.5)',
28
+ '--bui-color-bg-alpha-dark-3': 'rgba(72, 79, 88, 0.3)',
29
+ '--bui-color-bg-alpha-dark-1': 'rgba(72, 79, 88, 0.1)',
30
+
31
+ // 分割线、边框
32
+ '--bui-color-border-default': '#30363d',
33
+ },
34
+ };
package/registry/default-light.mjs ADDED
@@ -0,0 +1,211 @@
1
+ export const defaultLight = {
2
+ name: 'defaultLight',
3
+ label: 'Default Light',
4
+ mixinName: 'default-light',
5
+ cssVars: {
6
+ // 字体
7
+ '--bui-font-family':
8
+ "'PingFang SC', 'Chinese Quote', 'Segoe UI', roboto, 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', helvetica, arial, sans-serif",
9
+
10
+ /** 品牌红 */
11
+ '--bui-color-red': '#ff335c',
12
+ '--bui-color-red-light': '#ffebef',
13
+
14
+ /** 明亮粉 */
15
+ '--bui-color-pink': '#dd10f2',
16
+ '--bui-color-pink-light': '#fce7fe',
17
+
18
+ /** 活力橙 */
19
+ '--bui-color-orange': '#ff8533',
20
+ '--bui-color-orange-light': '#fff0e5',
21
+
22
+ /** 活力黄 */
23
+ '--bui-color-yellow': '#ff8533',
24
+ '--bui-color-yellow-light': '#fff0e5',
25
+
26
+ /** 亲和绿 */
27
+ '--bui-color-green': '#00d68f',
28
+ '--bui-color-green-light': '#dcf9f0',
29
+
30
+ /** 神秘紫 */
31
+ '--bui-color-purple': '#8b52ff',
32
+ '--bui-color-purple-light': '#f2ebff',
33
+
34
+ /** 宁静蓝 */
35
+ '--bui-color-blue': '#148aff',
36
+ '--bui-color-blue-light': '#e1f0ff',
37
+
38
+ /** 中性灰 */
39
+ '--bui-color-gray': '#8896b1',
40
+ '--bui-color-gray-light': '#f7f9fc',
41
+ '--bui-color-black': '#000',
42
+ '--bui-color-white': '#fff',
43
+ '--bui-color-vip': '#ff866e',
44
+ '--bui-color-vip1': '#fec9a3',
45
+ '--bui-color-vip2': '#f44a8b',
46
+ '--bui-color-vip3': '#c46e31',
47
+ '--bui-color-vip4': '#fccfe0',
48
+
49
+ /** 中性色 */
50
+ '--bui-color-neutral-0': 'var(--bui-color-black)',
51
+ '--bui-color-neutral-1': '#030b1a',
52
+ '--bui-color-neutral-2': '#444b5b',
53
+ '--bui-color-neutral-3': '#8b93a5',
54
+ '--bui-color-neutral-4': '#bfc4cf',
55
+ '--bui-color-neutral-5': '#e9ebef',
56
+ '--bui-color-neutral-6': '#f7f9fc',
57
+ '--bui-color-neutral-7': 'var(--bui-color-white)',
58
+
59
+ /** 字重 */
60
+ '--bui-font-weight-normal': '400',
61
+ '--bui-font-weight-medium': '500',
62
+ '--bui-font-weight-semibold': '600',
63
+ '--bui-font-weight-bold': '700',
64
+
65
+ /** 语义色 */
66
+ '--bui-color-primary': 'var(--bui-color-red)',
67
+ '--bui-color-primary-light': 'var(--bui-color-red-light)',
68
+ '--bui-color-info': 'var(--bui-color-blue)',
69
+ '--bui-color-info-light': 'var(--bui-color-blue-light)',
70
+ '--bui-color-success': 'var(--bui-color-green)',
71
+ '--bui-color-success-light': 'var(--bui-color-green-light)',
72
+ '--bui-color-warning': 'var(--bui-color-orange)',
73
+ '--bui-color-warning-light': 'var(--bui-color-orange-light)',
74
+ '--bui-color-danger': 'var(--bui-color-red)',
75
+ '--bui-color-danger-light': 'var(--bui-color-red-light)',
76
+
77
+ /** 基础字号 */
78
+ '--bui-font-size-xs1': '8px',
79
+ '--bui-font-size-xs2': '9px',
80
+ '--bui-font-size-sm1': '10px',
81
+ '--bui-font-size-sm2': '11px',
82
+ '--bui-font-size-sm3': '12px',
83
+ '--bui-font-size-sm4': '13px',
84
+ '--bui-font-size-md1': '14px',
85
+ '--bui-font-size-md2': '15px',
86
+ '--bui-font-size-md3': '16px',
87
+ '--bui-font-size-md4': '18px',
88
+ '--bui-font-size-lg1': '20px',
89
+ '--bui-font-size-lg2': '22px',
90
+ '--bui-font-size-lg3': '24px',
91
+ '--bui-font-size-lg4': '26px',
92
+
93
+ /** 语义化字号 */
94
+ '--bui-title-size-1': '21px',
95
+ '--bui-title-size-2': 'var(--bui-font-size-md4)',
96
+ '--bui-title-size-3': 'var(--bui-font-size-md3)',
97
+ '--bui-title-size-4': 'var(--bui-font-size-md2)',
98
+ '--bui-text-size-1': 'var(--bui-font-size-md1)',
99
+ '--bui-text-size-2': 'var(--bui-font-size-sm4)',
100
+ '--bui-text-size-3': 'var(--bui-font-size-sm3)',
101
+ '--bui-text-size-4': 'var(--bui-font-size-sm2)',
102
+ '--bui-text-size-5': 'var(--bui-font-size-sm1)',
103
+
104
+ // 前景色，通常用于文字
105
+ // default是最通用的色彩，比如标题和一级信息
106
+ '--bui-color-fg-default': 'var(--bui-color-neutral-1)',
107
+ // 柔和色，通常用于次级及补充说明信息
108
+ '--bui-color-fg-muted': 'var(--bui-color-neutral-2)',
109
+ // 淡色，很细微的色彩，用于辅助和需要弱化的信息
110
+ '--bui-color-fg-subtle': 'var(--bui-color-neutral-3)',
111
+ // 用于失效、不可用等状态
112
+ '--bui-color-fg-disabled': 'var(--bui-color-neutral-4)',
113
+
114
+ // 背景色
115
+ '--bui-color-bg-default': 'var(--bui-color-neutral-6)',
116
+ // 视图背景色
117
+ '--bui-color-bg-view': 'var(--bui-color-neutral-7)',
118
+ '--bui-color-bg-popover': 'var(--bui-color-neutral-7)',
119
+ '--bui-color-bg-alpha-light-9': 'rgba(255, 255, 255, 0.9)',
120
+ '--bui-color-bg-alpha-light-7': 'rgba(255, 255, 255, 0.7)',
121
+ '--bui-color-bg-alpha-light-5': 'rgba(255, 255, 255, 0.5)',
122
+ '--bui-color-bg-alpha-light-3': 'rgba(255, 255, 255, 0.3)',
123
+ '--bui-color-bg-alpha-light-1': 'rgba(255, 255, 255, 0.1)',
124
+ '--bui-color-bg-alpha-dark-9': 'rgba(0, 0, 0, 0.9)',
125
+ '--bui-color-bg-alpha-dark-7': 'rgba(0, 0, 0, 0.7)',
126
+ '--bui-color-bg-alpha-dark-5': 'rgba(0, 0, 0, 0.5)',
127
+ '--bui-color-bg-alpha-dark-3': 'rgba(0, 0, 0, 0.3)',
128
+ '--bui-color-bg-alpha-dark-1': 'rgba(0, 0, 0, 0.1)',
129
+
130
+ // 分割线、边框
131
+ '--bui-color-border-default': 'var(--bui-color-neutral-5)',
132
+ '--bui-color-border-primary': 'rgba(255, 51, 92, 0.4)',
133
+ '--bui-color-border-info': 'rgba(20, 138, 255, 0.4)',
134
+ '--bui-color-border-success': 'rgba(0, 214, 143, 0.4)',
135
+ '--bui-color-border-warning': 'rgba(255, 133, 51, 0.4)',
136
+ '--bui-color-border-danger': 'rgba(255, 51, 92, 0.4)',
137
+ '--bui-color-border-gray': 'rgba(136, 150, 177, 0.4)',
138
+
139
+ // 主题色渐变
140
+ '--bui-color-primary-start': '#ef16b9',
141
+ '--bui-color-primary-end': 'var(--bui-color-red)',
142
+ '--bui-color-secondary-start': '#f32adf',
143
+ '--bui-color-secondary-end': 'var(--bui-color-pink)',
144
+ '--bui-color-info-start': '#33a7ff',
145
+ '--bui-color-info-end': 'var(--bui-color-blue)',
146
+ '--bui-color-warning-start': '#ffad33',
147
+ '--bui-color-warning-end': 'var(--bui-color-orange)',
148
+ '--bui-color-success-start': '#00ebac',
149
+ '--bui-color-success-end': 'var(--bui-color-green)',
150
+ '--bui-color-danger-start': '#ef16b9',
151
+ '--bui-color-danger-end': 'var(--bui-color-red)',
152
+ '--bui-color-vip-start': '#ffd4a6',
153
+ '--bui-color-vip-end': '#ffbeae',
154
+
155
+ /* 基础圆角 */
156
+ '--bui-radius-circular': '10000px',
157
+ '--bui-radius-8': '24px',
158
+ '--bui-radius-7': '18px',
159
+ '--bui-radius-6': '15px',
160
+ '--bui-radius-5': '12px',
161
+ '--bui-radius-4': '9px',
162
+ '--bui-radius-3': '6px',
163
+ '--bui-radius-2': '4px',
164
+ '--bui-radius-1': '3px',
165
+ '--bui-radius-none': '0px',
166
+
167
+ // 形状定义
168
+ // 页面级浮层
169
+ '--bui-shape-radius-popover': 'var(--bui-radius-7)',
170
+ '--bui-shape-radius-drawer': 'var(--bui-radius-5)',
171
+ // 卡片、普通视图、抽屉、action sheet，常用于信息密度较低的视图
172
+ '--bui-shape-radius-card': 'var(--bui-radius-4)',
173
+ // 独立海报、卡片，常用于信息密度较高的视图
174
+ '--bui-shape-radius-default': 'var(--bui-radius-3)',
175
+ // 容器内海报
176
+ '--bui-shape-radius-poster': 'var(--bui-radius-2)',
177
+ // 标签
178
+ '--bui-shape-radius-label': 'var(--bui-radius-1)',
179
+
180
+ /* 基础间距 */
181
+ '--bui-spacing-1': '1px',
182
+ '--bui-spacing-2': '2px',
183
+ '--bui-spacing-3': '3px',
184
+ '--bui-spacing-4': '4px',
185
+ '--bui-spacing-5': '6px',
186
+ '--bui-spacing-6': '9px',
187
+ '--bui-spacing-7': '12px',
188
+ '--bui-spacing-8': '15px',
189
+ '--bui-spacing-9': '18px',
190
+ '--bui-spacing-10': '24px',
191
+
192
+ // 空间定义
193
+ '--bui-spacing-xl': 'var(--bui-spacing-8)',
194
+ '--bui-spacing-lg': 'var(--bui-spacing-7)',
195
+ '--bui-spacing-md': 'var(--bui-spacing-6)',
196
+ '--bui-spacing-sm': 'var(--bui-spacing-5)',
197
+ '--bui-spacing-xs': 'var(--bui-spacing-4)',
198
+
199
+ // 行高
200
+ '--bui-line-height': '1.5',
201
+
202
+ /** 层级 */
203
+ '--bui-z-index-dropdown': '1000', // dropdown 、cascader、DatePicker、select、TimePicker、treeSelect
204
+ '--bui-z-index-affix': '1100', // 吸顶元素、固定元素fixed
205
+ '--bui-z-index-modal-backdrop': '1200',
206
+ '--bui-z-index-modal': '1200', // drawer、 model
207
+ '--bui-z-index-popover': '1300',
208
+ '--bui-z-index-tooltip': '1400',
209
+ '--bui-z-index-toast': '1500', // 反馈提示，高于所有元素
210
+ },
211
+ };
package/registry/dm-light.mjs ADDED
@@ -0,0 +1,60 @@
1
+ export const dmLight = {
2
+ name: 'dmLight',
3
+ label: 'Damai Light',
4
+ mixinName: 'dm-light',
5
+ cssVars: {
6
+ /** 淘麦红 */
7
+ '--bui-color-red': '#ff3299',
8
+ '--bui-color-red-light': '#ffeaf5',
9
+ '--bui-color-red-dark': '#e62d8a',
10
+
11
+ /** 活力黄 */
12
+ '--bui-color-yellow': '#ffaf00',
13
+ '--bui-color-yellow-light': '#fff7e5',
14
+ '--bui-color-yellow-dark': '#e59d00',
15
+
16
+ /** 荧光黄 */
17
+ '--bui-color-lemonyellow': '#fff36f',
18
+ '--bui-color-lemonyellow-light': '#ffffeb',
19
+ '--bui-color-lemonyellow-dark': '#b3a13d',
20
+
21
+ /** 亲和绿 */
22
+ '--bui-color-green': '#0cdc87',
23
+ '--bui-color-green-light': '#e6fbf3',
24
+ '--bui-color-green-dark': '#0bc679',
25
+
26
+ /** 神秘紫 */
27
+ '--bui-color-purple': '#754dff',
28
+ '--bui-color-purple-light': '#f6f0ff',
29
+ '--bui-color-purple-dark': '#3924b3',
30
+
31
+ /** 宁静蓝 */
32
+ '--bui-color-blue': '#30aeff',
33
+ '--bui-color-blue-light': '#eaf7ff',
34
+ '--bui-color-blue-dark': '#2b9ce5',
35
+
36
+ /** 智能蓝 */
37
+ '--bui-color-aiblue': '#5cfffa',
38
+ '--bui-color-aiblue-light': '#f0fffc',
39
+ '--bui-color-aiblue-dark': '#1d858c',
40
+
41
+ /** 主题色渐变 */
42
+ '--bui-color-primary-start': 'var(--bui-color-red)',
43
+ '--bui-color-primary-end': '#ff4a72',
44
+ '--bui-color-info-start': '#51bbff',
45
+ '--bui-color-info-end': 'var(--bui-color-blue)',
46
+ '--bui-color-warning-start': '#ffc341',
47
+ '--bui-color-warning-end': 'var(--bui-color-yellow)',
48
+ '--bui-color-success-start': 'var(--bui-color-green)',
49
+ '--bui-color-success-end': '#00c474',
50
+ '--bui-color-danger-start': 'var(--bui-color-red)',
51
+ '--bui-color-danger-end': '#ff4a72',
52
+
53
+ /** 分割线、边框 */
54
+ '--bui-color-border-primary': 'rgba(255, 50, 153, 0.4)',
55
+ '--bui-color-border-info': 'rgba(48, 174, 255, 0.4)',
56
+ '--bui-color-border-success': 'rgba(12, 220, 135, 0.4)',
57
+ '--bui-color-border-warning': 'rgba(255, 175, 0, 0.4)',
58
+ '--bui-color-border-danger': 'rgba(255, 50, 153, 0.4)',
59
+ },
60
+ };
package/registry/index.mjs ADDED
@@ -0,0 +1,4 @@
1
+ export * from './default-dark.mjs';
2
+ export * from './default-light.mjs';
3
+ export * from './dm-light.mjs';
4
+ export * from './pioneer-light.mjs';
package/registry/pioneer-light.mjs ADDED
@@ -0,0 +1,107 @@
1
+ export const pioneerLight = {
2
+ name: 'pioneerLight',
3
+ label: 'Pioneer Light',
4
+ mixinName: 'pioneer-light',
5
+ cssVars: {
6
+ /** pioneer 特殊字体 */
7
+ '--bui-font-family-accent':
8
+ "'AlibabaPuHuiTi-Heavy', 'PingFang SC', 'Chinese Quote', 'Segoe UI', roboto, 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', helvetica, arial, sans-serif",
9
+
10
+ /** 品牌红 */
11
+ '--bui-color-red': '#ff471a',
12
+ '--bui-color-red-light': '#ffefe6',
13
+ '--bui-color-red-dark': '#b31800',
14
+
15
+ /** 活力橙 */
16
+ '--bui-color-orange': '#ff5000',
17
+ '--bui-color-orange-light': '#ffede5',
18
+ '--bui-color-orange-dark': '#d93d00',
19
+
20
+ /** 活力黄 */
21
+ '--bui-color-yellow': '#ffa608',
22
+ '--bui-color-yellow-light': '#fffae6',
23
+ '--bui-color-yellow-dark': '#b36500',
24
+
25
+ /** 荧光黄 */
26
+ '--bui-color-lemonyellow': '#fff36f',
27
+ '--bui-color-lemonyellow-light': '#ffffeb',
28
+ '--bui-color-lemonyellow-dark': '#b3a13d',
29
+
30
+ /** 亲和绿 */
31
+ '--bui-color-green': '#40bf00',
32
+ '--bui-color-green-light': '#f2ffe6',
33
+ '--bui-color-green-dark': '#1f7300',
34
+
35
+ /** 神秘紫 */
36
+ '--bui-color-purple': '#754dff',
37
+ '--bui-color-purple-light': '#f6f0ff',
38
+ '--bui-color-purple-dark': '#3924b3',
39
+
40
+ /** 宁静蓝 */
41
+ '--bui-color-blue': '#229af0',
42
+ '--bui-color-blue-light': '#f0fbff',
43
+ '--bui-color-blue-dark': '#0757a3',
44
+
45
+ /** 智能蓝 */
46
+ '--bui-color-aiblue': '#5cfffa',
47
+ '--bui-color-aiblue-light': '#f0fffc',
48
+ '--bui-color-aiblue-dark': '#1d858c',
49
+
50
+ /** 主题 */
51
+ '--bui-color-primary': 'var(--bui-color-orange)',
52
+ '--bui-color-primary-light': 'var(--bui-color-orange-light)',
53
+ '--bui-color-primary-dark': 'var(--bui-color-orange-dark)',
54
+
55
+ /** 语义化字号 */
56
+ '--bui-title-size-4': 'var(--bui-font-size-md1)',
57
+
58
+ // 用于失效、不可用等状态
59
+ '--bui-color-fg-disabled': 'rgba(3, 11, 26, 0.5)',
60
+
61
+ /** 分割线、边框 */
62
+ '--bui-color-border-primary': 'rgba(255, 80, 0, 0.4)',
63
+ '--bui-color-border-info': 'rgba(34, 154, 240, 0.4)',
64
+ '--bui-color-border-success': 'rgba(64, 191, 0, 0.4)',
65
+ '--bui-color-border-warning': 'rgba(255, 80, 0, 0.4)',
66
+ '--bui-color-border-danger': 'rgba(255, 71, 26, 0.4)',
67
+
68
+ /** 主题色渐变 */
69
+ '--bui-color-primary-start': '#ffb300',
70
+ '--bui-color-primary-end': 'var(--bui-color-primary)',
71
+ '--bui-color-info-start': '#5bc8ff',
72
+ '--bui-color-info-end': 'var(--bui-color-info)',
73
+ '--bui-color-warning-start': '#fc3',
74
+ '--bui-color-warning-end': 'var(--bui-color-warning)',
75
+ '--bui-color-success-start': '#66d933',
76
+ '--bui-color-success-end': 'var(--bui-color-success)',
77
+ '--bui-color-danger-start': '#ff7633',
78
+ '--bui-color-danger-end': 'var(--bui-color-danger)',
79
+
80
+ /** 形状定义 */
81
+ '--bui-shape-radius-drawer': 'var(--bui-radius-6)',
82
+ // 卡片、普通视图、抽屉、action sheet，常用于信息密度较低的视图
83
+ '--bui-shape-radius-card': 'var(--bui-radius-5)',
84
+ // 独立海报、卡片，常用于信息密度较高的视图
85
+ '--bui-shape-radius-default': 'var(--bui-radius-4)',
86
+
87
+ // Button
88
+ '--bui-btn-full-height': '45px',
89
+ '--bui-btn-large-height': '30px',
90
+ '--bui-btn-full-font-size': '18px',
91
+ '--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',
96
+
97
+ // Card
98
+ '--bui-card-header-title-font-size': 'var(--bui-title-size-3)',
99
+
100
+ // Tabs
101
+ '--bui-tab-font-size': 'var(--bui-title-size-4)',
102
+ '--bui-tab-color': 'var(--bui-color-fg-muted)',
103
+ '--bui-tabs-indicator-height': '4PX',
104
+ '--bui-tabs-indicator-border-radius': '2px',
105
+ '--bui-tabs-indicator-box-shadow': '0 2px 4px 0 rgba(255, 98, 0, 0.2)',
106
+ },
107
+ };
package/themes/default-dark.less ADDED
@@ -0,0 +1,21 @@
1
+ /** 此文件由脚本自动生成，请勿直接修改，若有变更请维护bui-styles/registry/*.mjs，再执行`pnpm theme:js2less`更新主题 */
2
+ .default-dark() {
3
+ --bui-color-fg-default: #f0f6fc;
4
+ --bui-color-fg-muted: #8b949e;
5
+ --bui-color-fg-subtle: #484f58;
6
+ --bui-color-fg-disabled: #484f58;
7
+ --bui-color-bg-default: #010409;
8
+ --bui-color-bg-view: #161b22;
9
+ --bui-color-bg-popover: rgba(72, 79, 88, 0.7);
10
+ --bui-color-bg-alpha-light-9: rgba(22, 27, 34, 0.9);
11
+ --bui-color-bg-alpha-light-7: rgba(22, 27, 34, 0.7);
12
+ --bui-color-bg-alpha-light-5: rgba(22, 27, 34, 0.5);
13
+ --bui-color-bg-alpha-light-3: rgba(22, 27, 34, 0.3);
14
+ --bui-color-bg-alpha-light-1: rgba(22, 27, 34, 0.1);
15
+ --bui-color-bg-alpha-dark-9: rgba(72, 79, 88, 0.9);
16
+ --bui-color-bg-alpha-dark-7: rgba(72, 79, 88, 0.7);
17
+ --bui-color-bg-alpha-dark-5: rgba(72, 79, 88, 0.5);
18
+ --bui-color-bg-alpha-dark-3: rgba(72, 79, 88, 0.3);
19
+ --bui-color-bg-alpha-dark-1: rgba(72, 79, 88, 0.1);
20
+ --bui-color-border-default: #30363d;
21
+ }
package/themes/default-light.less ADDED
@@ -0,0 +1,151 @@
1
+ /** 此文件由脚本自动生成，请勿直接修改，若有变更请维护bui-styles/registry/*.mjs，再执行`pnpm theme:js2less`更新主题 */
2
+ .default-light() {
3
+ --bui-font-family:
4
+ 'PingFang SC', 'Chinese Quote', 'Segoe UI', roboto, 'Hiragino Sans GB',
5
+ 'Microsoft YaHei', 'Helvetica Neue', helvetica, arial, sans-serif;
6
+ --bui-color-red: #ff335c;
7
+ --bui-color-red-light: #ffebef;
8
+ --bui-color-pink: #dd10f2;
9
+ --bui-color-pink-light: #fce7fe;
10
+ --bui-color-orange: #ff8533;
11
+ --bui-color-orange-light: #fff0e5;
12
+ --bui-color-yellow: #ff8533;
13
+ --bui-color-yellow-light: #fff0e5;
14
+ --bui-color-green: #00d68f;
15
+ --bui-color-green-light: #dcf9f0;
16
+ --bui-color-purple: #8b52ff;
17
+ --bui-color-purple-light: #f2ebff;
18
+ --bui-color-blue: #148aff;
19
+ --bui-color-blue-light: #e1f0ff;
20
+ --bui-color-gray: #8896b1;
21
+ --bui-color-gray-light: #f7f9fc;
22
+ --bui-color-black: #000;
23
+ --bui-color-white: #fff;
24
+ --bui-color-vip: #ff866e;
25
+ --bui-color-vip1: #fec9a3;
26
+ --bui-color-vip2: #f44a8b;
27
+ --bui-color-vip3: #c46e31;
28
+ --bui-color-vip4: #fccfe0;
29
+ --bui-color-neutral-0: var(--bui-color-black);
30
+ --bui-color-neutral-1: #030b1a;
31
+ --bui-color-neutral-2: #444b5b;
32
+ --bui-color-neutral-3: #8b93a5;
33
+ --bui-color-neutral-4: #bfc4cf;
34
+ --bui-color-neutral-5: #e9ebef;
35
+ --bui-color-neutral-6: #f7f9fc;
36
+ --bui-color-neutral-7: var(--bui-color-white);
37
+ --bui-font-weight-normal: 400;
38
+ --bui-font-weight-medium: 500;
39
+ --bui-font-weight-semibold: 600;
40
+ --bui-font-weight-bold: 700;
41
+ --bui-color-primary: var(--bui-color-red);
42
+ --bui-color-primary-light: var(--bui-color-red-light);
43
+ --bui-color-info: var(--bui-color-blue);
44
+ --bui-color-info-light: var(--bui-color-blue-light);
45
+ --bui-color-success: var(--bui-color-green);
46
+ --bui-color-success-light: var(--bui-color-green-light);
47
+ --bui-color-warning: var(--bui-color-orange);
48
+ --bui-color-warning-light: var(--bui-color-orange-light);
49
+ --bui-color-danger: var(--bui-color-red);
50
+ --bui-color-danger-light: var(--bui-color-red-light);
51
+ --bui-font-size-xs1: 8px;
52
+ --bui-font-size-xs2: 9px;
53
+ --bui-font-size-sm1: 10px;
54
+ --bui-font-size-sm2: 11px;
55
+ --bui-font-size-sm3: 12px;
56
+ --bui-font-size-sm4: 13px;
57
+ --bui-font-size-md1: 14px;
58
+ --bui-font-size-md2: 15px;
59
+ --bui-font-size-md3: 16px;
60
+ --bui-font-size-md4: 18px;
61
+ --bui-font-size-lg1: 20px;
62
+ --bui-font-size-lg2: 22px;
63
+ --bui-font-size-lg3: 24px;
64
+ --bui-font-size-lg4: 26px;
65
+ --bui-title-size-1: 21px;
66
+ --bui-title-size-2: var(--bui-font-size-md4);
67
+ --bui-title-size-3: var(--bui-font-size-md3);
68
+ --bui-title-size-4: var(--bui-font-size-md2);
69
+ --bui-text-size-1: var(--bui-font-size-md1);
70
+ --bui-text-size-2: var(--bui-font-size-sm4);
71
+ --bui-text-size-3: var(--bui-font-size-sm3);
72
+ --bui-text-size-4: var(--bui-font-size-sm2);
73
+ --bui-text-size-5: var(--bui-font-size-sm1);
74
+ --bui-color-fg-default: var(--bui-color-neutral-1);
75
+ --bui-color-fg-muted: var(--bui-color-neutral-2);
76
+ --bui-color-fg-subtle: var(--bui-color-neutral-3);
77
+ --bui-color-fg-disabled: var(--bui-color-neutral-4);
78
+ --bui-color-bg-default: var(--bui-color-neutral-6);
79
+ --bui-color-bg-view: var(--bui-color-neutral-7);
80
+ --bui-color-bg-popover: var(--bui-color-neutral-7);
81
+ --bui-color-bg-alpha-light-9: rgba(255, 255, 255, 0.9);
82
+ --bui-color-bg-alpha-light-7: rgba(255, 255, 255, 0.7);
83
+ --bui-color-bg-alpha-light-5: rgba(255, 255, 255, 0.5);
84
+ --bui-color-bg-alpha-light-3: rgba(255, 255, 255, 0.3);
85
+ --bui-color-bg-alpha-light-1: rgba(255, 255, 255, 0.1);
86
+ --bui-color-bg-alpha-dark-9: rgba(0, 0, 0, 0.9);
87
+ --bui-color-bg-alpha-dark-7: rgba(0, 0, 0, 0.7);
88
+ --bui-color-bg-alpha-dark-5: rgba(0, 0, 0, 0.5);
89
+ --bui-color-bg-alpha-dark-3: rgba(0, 0, 0, 0.3);
90
+ --bui-color-bg-alpha-dark-1: rgba(0, 0, 0, 0.1);
91
+ --bui-color-border-default: var(--bui-color-neutral-5);
92
+ --bui-color-border-primary: rgba(255, 51, 92, 0.4);
93
+ --bui-color-border-info: rgba(20, 138, 255, 0.4);
94
+ --bui-color-border-success: rgba(0, 214, 143, 0.4);
95
+ --bui-color-border-warning: rgba(255, 133, 51, 0.4);
96
+ --bui-color-border-danger: rgba(255, 51, 92, 0.4);
97
+ --bui-color-border-gray: rgba(136, 150, 177, 0.4);
98
+ --bui-color-primary-start: #ef16b9;
99
+ --bui-color-primary-end: var(--bui-color-red);
100
+ --bui-color-secondary-start: #f32adf;
101
+ --bui-color-secondary-end: var(--bui-color-pink);
102
+ --bui-color-info-start: #33a7ff;
103
+ --bui-color-info-end: var(--bui-color-blue);
104
+ --bui-color-warning-start: #ffad33;
105
+ --bui-color-warning-end: var(--bui-color-orange);
106
+ --bui-color-success-start: #00ebac;
107
+ --bui-color-success-end: var(--bui-color-green);
108
+ --bui-color-danger-start: #ef16b9;
109
+ --bui-color-danger-end: var(--bui-color-red);
110
+ --bui-color-vip-start: #ffd4a6;
111
+ --bui-color-vip-end: #ffbeae;
112
+ --bui-radius-circular: 10000px;
113
+ --bui-radius-8: 24px;
114
+ --bui-radius-7: 18px;
115
+ --bui-radius-6: 15px;
116
+ --bui-radius-5: 12px;
117
+ --bui-radius-4: 9px;
118
+ --bui-radius-3: 6px;
119
+ --bui-radius-2: 4px;
120
+ --bui-radius-1: 3px;
121
+ --bui-radius-none: 0px;
122
+ --bui-shape-radius-popover: var(--bui-radius-7);
123
+ --bui-shape-radius-drawer: var(--bui-radius-5);
124
+ --bui-shape-radius-card: var(--bui-radius-4);
125
+ --bui-shape-radius-default: var(--bui-radius-3);
126
+ --bui-shape-radius-poster: var(--bui-radius-2);
127
+ --bui-shape-radius-label: var(--bui-radius-1);
128
+ --bui-spacing-1: 1px;
129
+ --bui-spacing-2: 2px;
130
+ --bui-spacing-3: 3px;
131
+ --bui-spacing-4: 4px;
132
+ --bui-spacing-5: 6px;
133
+ --bui-spacing-6: 9px;
134
+ --bui-spacing-7: 12px;
135
+ --bui-spacing-8: 15px;
136
+ --bui-spacing-9: 18px;
137
+ --bui-spacing-10: 24px;
138
+ --bui-spacing-xl: var(--bui-spacing-8);
139
+ --bui-spacing-lg: var(--bui-spacing-7);
140
+ --bui-spacing-md: var(--bui-spacing-6);
141
+ --bui-spacing-sm: var(--bui-spacing-5);
142
+ --bui-spacing-xs: var(--bui-spacing-4);
143
+ --bui-line-height: 1.5;
144
+ --bui-z-index-dropdown: 1000;
145
+ --bui-z-index-affix: 1100;
146
+ --bui-z-index-modal-backdrop: 1200;
147
+ --bui-z-index-modal: 1200;
148
+ --bui-z-index-popover: 1300;
149
+ --bui-z-index-tooltip: 1400;
150
+ --bui-z-index-toast: 1500;
151
+ }
package/themes/dm-light.less ADDED
@@ -0,0 +1,39 @@
1
+ /** 此文件由脚本自动生成，请勿直接修改，若有变更请维护bui-styles/registry/*.mjs，再执行`pnpm theme:js2less`更新主题 */
2
+ .dm-light() {
3
+ --bui-color-red: #ff3299;
4
+ --bui-color-red-light: #ffeaf5;
5
+ --bui-color-red-dark: #e62d8a;
6
+ --bui-color-yellow: #ffaf00;
7
+ --bui-color-yellow-light: #fff7e5;
8
+ --bui-color-yellow-dark: #e59d00;
9
+ --bui-color-lemonyellow: #fff36f;
10
+ --bui-color-lemonyellow-light: #ffffeb;
11
+ --bui-color-lemonyellow-dark: #b3a13d;
12
+ --bui-color-green: #0cdc87;
13
+ --bui-color-green-light: #e6fbf3;
14
+ --bui-color-green-dark: #0bc679;
15
+ --bui-color-purple: #754dff;
16
+ --bui-color-purple-light: #f6f0ff;
17
+ --bui-color-purple-dark: #3924b3;
18
+ --bui-color-blue: #30aeff;
19
+ --bui-color-blue-light: #eaf7ff;
20
+ --bui-color-blue-dark: #2b9ce5;
21
+ --bui-color-aiblue: #5cfffa;
22
+ --bui-color-aiblue-light: #f0fffc;
23
+ --bui-color-aiblue-dark: #1d858c;
24
+ --bui-color-primary-start: var(--bui-color-red);
25
+ --bui-color-primary-end: #ff4a72;
26
+ --bui-color-info-start: #51bbff;
27
+ --bui-color-info-end: var(--bui-color-blue);
28
+ --bui-color-warning-start: #ffc341;
29
+ --bui-color-warning-end: var(--bui-color-yellow);
30
+ --bui-color-success-start: var(--bui-color-green);
31
+ --bui-color-success-end: #00c474;
32
+ --bui-color-danger-start: var(--bui-color-red);
33
+ --bui-color-danger-end: #ff4a72;
34
+ --bui-color-border-primary: rgba(255, 50, 153, 0.4);
35
+ --bui-color-border-info: rgba(48, 174, 255, 0.4);
36
+ --bui-color-border-success: rgba(12, 220, 135, 0.4);
37
+ --bui-color-border-warning: rgba(255, 175, 0, 0.4);
38
+ --bui-color-border-danger: rgba(255, 50, 153, 0.4);
39
+ }
package/themes/index.less ADDED
@@ -0,0 +1,6 @@
1
+ /** 此文件由脚本自动生成，请勿直接修改，若有变更请维护bui-styles/registry/*.mjs，再执行`pnpm theme:js2less`更新主题 */
2
+ @import './default-light.less';
3
+ @import './default-dark.less';
4
+ @import './dm-light.less';
5
+ @import './pioneer-light.less';
6
+ @import './pioneer-light-components.less';