@alauda/ui 6.3.3 → 6.3.4-beta

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 (2) hide show
  1. package/package.json +1 -1
  2. package/theme/_theme-preset.scss +157 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alauda/ui",
3
- "version": "6.3.3",
3
+ "version": "6.3.4-beta",
4
4
  "description": "Angular UI components by Alauda Frontend Team.",
5
5
  "repository": "git+https://github.com/alauda/alauda-ui.git",
6
6
  "author": "Alauda Frontend",
package/theme/_theme-preset.scss ADDED
@@ -0,0 +1,157 @@
1
+ @use 'sass:color';
2
+
3
+ @mixin component-size {
4
+ --aui-inline-height-l: 40px;
5
+ --aui-inline-height-m: 32px;
6
+ --aui-inline-height-s: 28px;
7
+ --aui-inline-height-xs: 24px;
8
+ --aui-inline-padding-l: 19px;
9
+ --aui-inline-padding-m: 15px;
10
+ --aui-inline-padding-s: 11px;
11
+ --aui-inline-padding-xs: 7px;
12
+ --aui-inline-padding-xxs: 5px;
13
+ --aui-spacing-xxxxxl: 40px;
14
+ --aui-spacing-xxxxl: 32px;
15
+ --aui-spacing-xxxl: 24px;
16
+ --aui-spacing-xxl: 20px;
17
+ --aui-spacing-xl: 16px;
18
+ --aui-spacing-l: 12px;
19
+ --aui-spacing-m: 8px;
20
+ --aui-spacing-s: 4px;
21
+ --aui-spacing-xs: 2px;
22
+ --aui-font-weight-bold: 500;
23
+ --aui-font-weight-normal: 400;
24
+ --aui-font-size-xxl: 20px;
25
+ --aui-font-size-xl: 18px;
26
+ --aui-font-size-l: 16px;
27
+ --aui-font-size-m: 14px;
28
+ --aui-font-size-s: 12px;
29
+ --aui-line-height-xxxl: 32px;
30
+ --aui-line-height-xxl: 28px;
31
+ --aui-line-height-xl: 24px;
32
+ --aui-line-height-l: 22px;
33
+ --aui-line-height-m: 20px;
34
+ --aui-line-height-s: 16px;
35
+ --aui-icon-size-xxl: 24px;
36
+ --aui-icon-size-xl: 24px;
37
+ --aui-icon-size-l: 16px;
38
+ --aui-icon-size-m: 16px;
39
+ --aui-icon-size-s: 12px;
40
+ --aui-border-radius-l: 4px;
41
+ --aui-border-radius-m: 2px;
42
+ --aui-form-item-width-l: 732px;
43
+ --aui-form-item-width-m: 436px;
44
+ --aui-form-item-width-s: 140px;
45
+ }
46
+
47
+ @function rgb-string($color) {
48
+ @return color.red($color), color.green($color), color.blue($color);
49
+ }
50
+
51
+ @mixin light-mode {
52
+ --aui-color-blue: #{rgb-string(#007af5)};
53
+ --aui-color-b-0: #{rgb-string(#0067d0)};
54
+ --aui-color-b-1: #{rgb-string(#268df6)};
55
+ --aui-color-b-2: #{rgb-string(#4da2f8)};
56
+ --aui-color-b-3: #{rgb-string(#66aff9)};
57
+ --aui-color-b-4: #{rgb-string(#b3d7fc)};
58
+ --aui-color-b-5: #{rgb-string(#cce4fd)};
59
+ --aui-color-b-6: #{rgb-string(#e5f1fe)};
60
+ --aui-color-b-7: #{rgb-string(#f2f8fe)};
61
+ --aui-color-green: #{rgb-string(#00c261)};
62
+ --aui-color-g-0: #{rgb-string(#00a552)};
63
+ --aui-color-g-1: #{rgb-string(#26cb78)};
64
+ --aui-color-g-2: #{rgb-string(#4cd490)};
65
+ --aui-color-g-4: #{rgb-string(#b3eccf)};
66
+ --aui-color-g-6: #{rgb-string(#e6f9ef)};
67
+ --aui-color-g-7: #{rgb-string(#f2fbf6)};
68
+ --aui-color-yellow: #{rgb-string(#f5a300)};
69
+ --aui-color-y-0: #{rgb-string(#dc9200)};
70
+ --aui-color-y-1: #{rgb-string(#f6b026)};
71
+ --aui-color-y-2: #{rgb-string(#f8be4d)};
72
+ --aui-color-y-4: #{rgb-string(#fce3b3)};
73
+ --aui-color-y-6: #{rgb-string(#fef5e6)};
74
+ --aui-color-y-7: #{rgb-string(#fefaf3)};
75
+ --aui-color-red: #{rgb-string(#eb0027)};
76
+ --aui-color-r-0: #{rgb-string(#c70021)};
77
+ --aui-color-r-1: #{rgb-string(#ed2647)};
78
+ --aui-color-r-2: #{rgb-string(#f14c67)};
79
+ --aui-color-r-4: #{rgb-string(#f9b3be)};
80
+ --aui-color-r-6: #{rgb-string(#fde6e9)};
81
+ --aui-color-r-7: #{rgb-string(#fef3f4)};
82
+ --aui-color-n-1: #{rgb-string(#323437)};
83
+ --aui-color-n-2: #{rgb-string(#646669)};
84
+ --aui-color-n-3: #{rgb-string(#7c7e81)};
85
+ --aui-color-n-4: #{rgb-string(#96989b)};
86
+ --aui-color-n-5: #{rgb-string(#aeb0b3)};
87
+ --aui-color-n-6: #{rgb-string(#c8cacd)};
88
+ --aui-color-n-7: #{rgb-string(#d4d6d9)};
89
+ --aui-color-n-8: #{rgb-string(#edeff2)};
90
+ --aui-color-n-9: #{rgb-string(#f7f9fc)};
91
+ --aui-color-n-10: #{rgb-string(#fff)};
92
+ --aui-color-origin-shadow: var(--aui-color-n-1);
93
+ --aui-color-popper-bg: var(--aui-color-n-10);
94
+ --aui-color-button-bg: var(--aui-color-n-9);
95
+ --aui-color-main-bg: var(--aui-color-n-9);
96
+ --aui-color-divider: var(--aui-color-n-8);
97
+ --aui-color-border: var(--aui-color-n-7);
98
+ --aui-color-main-text: var(--aui-color-n-1);
99
+ --aui-color-secondary-text: var(--aui-color-n-2);
100
+ --aui-color-help-text: var(--aui-color-n-4);
101
+ --aui-color-disabled-text: var(--aui-color-n-6);
102
+ --aui-color-placeholder-text: var(--aui-color-n-6);
103
+ }
104
+
105
+ @mixin dark-mode {
106
+ --aui-color-blue: #{rgb-string(#3d8eff)};
107
+ --aui-color-b-0: #{rgb-string(#3674cc)};
108
+ --aui-color-b-1: #{rgb-string(#6daaff)};
109
+ --aui-color-b-2: #{rgb-string(#356fc1)};
110
+ --aui-color-b-3: #{rgb-string(#3265ad)};
111
+ --aui-color-b-4: #{rgb-string(#2f558f)};
112
+ --aui-color-b-5: #{rgb-string(#283651)};
113
+ --aui-color-b-6: #{rgb-string(#2a4066)};
114
+ --aui-color-b-7: #{rgb-string(#2c4a7a)};
115
+ --aui-color-green: #{rgb-string(#11b671)};
116
+ --aui-color-g-0: #{rgb-string(#159261)};
117
+ --aui-color-g-1: #{rgb-string(#4cc894)};
118
+ --aui-color-g-2: #{rgb-string(#168b5d)};
119
+ --aui-color-g-4: #{rgb-string(#1b674e)};
120
+ --aui-color-g-6: #{rgb-string(#1f4a42)};
121
+ --aui-color-g-7: #{rgb-string(#1c5848)};
122
+ --aui-color-yellow: #{rgb-string(#edac2c)};
123
+ --aui-color-y-0: #{rgb-string(#ba8a2d)};
124
+ --aui-color-y-1: #{rgb-string(#f1c060)};
125
+ --aui-color-y-2: #{rgb-string(#b0842d)};
126
+ --aui-color-y-4: #{rgb-string(#7e622f)};
127
+ --aui-color-y-6: #{rgb-string(#564831)};
128
+ --aui-color-y-7: #{rgb-string(#695530)};
129
+ --aui-color-red: #{rgb-string(#e2324f)};
130
+ --aui-color-r-0: #{rgb-string(#b22f48)};
131
+ --aui-color-r-1: #{rgb-string(#e9657b)};
132
+ --aui-color-r-2: #{rgb-string(#a82e46)};
133
+ --aui-color-r-4: #{rgb-string(#792b3f)};
134
+ --aui-color-r-6: #{rgb-string(#532939)};
135
+ --aui-color-r-7: #{rgb-string(#652a3c)};
136
+ --aui-color-n-1: #{rgb-string(#eeeff3)};
137
+ --aui-color-n-2: #{rgb-string(#c8c9cd)};
138
+ --aui-color-n-3: #{rgb-string(#b8bac2)};
139
+ --aui-color-n-4: #{rgb-string(#989aa2)};
140
+ --aui-color-n-5: #{rgb-string(#90939f)};
141
+ --aui-color-n-6: #{rgb-string(#787b87)};
142
+ --aui-color-n-7: #{rgb-string(#5c5f6b)};
143
+ --aui-color-n-8: #{rgb-string(#434652)};
144
+ --aui-color-n-9: #{rgb-string(#181b27)};
145
+ --aui-color-n-10: #{rgb-string(#242733)};
146
+ --aui-color-origin-shadow: var(--aui-color-n-9);
147
+ --aui-color-popper-bg: #{rgb-string(#383b47)};
148
+ --aui-color-button-bg: #{rgb-string(#383b47)};
149
+ --aui-color-main-bg: var(--aui-color-n-9);
150
+ --aui-color-divider: var(--aui-color-n-8);
151
+ --aui-color-border: var(--aui-color-n-7);
152
+ --aui-color-main-text: var(--aui-color-n-1);
153
+ --aui-color-secondary-text: var(--aui-color-n-2);
154
+ --aui-color-help-text: var(--aui-color-n-4);
155
+ --aui-color-disabled-text: var(--aui-color-n-6);
156
+ --aui-color-placeholder-text: var(--aui-color-n-6);
157
+ }