@neatui/css 2.0.10 → 3.0.0-beta.0

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 (48) hide show
  1. package/components/btns/base.scss +1 -3
  2. package/components/btns/btns@a.scss +1 -1
  3. package/components/btns/mcui@btns.scss +0 -2
  4. package/components/chat/chat@a.scss +22 -24
  5. package/components/cite/cite@a.scss +5 -3
  6. package/components/demo/demo@a.scss +2 -2
  7. package/components/form/README.md +2 -2
  8. package/components/form/base.scss +2 -2
  9. package/components/form/form@b/input.scss +4 -4
  10. package/components/form/form@c/checkbox.scss +1 -1
  11. package/components/form/form@c/input.scss +2 -2
  12. package/components/form/form@d/base.scss +6 -6
  13. package/components/form/form@d/checkbox.scss +1 -1
  14. package/components/form/form@d/date.scss +3 -3
  15. package/components/form/form@d/input.scss +12 -12
  16. package/components/form/form@d/radio.scss +1 -1
  17. package/components/form/form@d/select.scss +4 -4
  18. package/components/form/form@d/switch.scss +4 -4
  19. package/components/form/form@d/textarea.scss +5 -5
  20. package/components/form/form@d/upload.scss +4 -4
  21. package/components/grid/grid@a.scss +1 -1
  22. package/components/imgs/imgs@b.scss +8 -8
  23. package/components/list/list@c.scss +5 -4
  24. package/components/load/load@i.scss +3 -3
  25. package/components/opts/opts@a.scss +1 -1
  26. package/components/path/README.md +2 -2
  27. package/components/table/base.scss +2 -2
  28. package/components/table/table@a.scss +1 -1
  29. package/components/table/table@b.scss +1 -1
  30. package/components/tips/base.scss +12 -12
  31. package/components/tips/tips@a.scss +1 -1
  32. package/core/README.md +2 -2
  33. package/core/color.scss +111 -121
  34. package/core/cols.scss +6 -3
  35. package/core/media.scss +30 -28
  36. package/core/neatui@core.scss +5 -5
  37. package/core/scale.scss +27 -22
  38. package/core/scroll.scss +5 -5
  39. package/core/shadow.scss +17 -9
  40. package/core/size.scss +3 -1
  41. package/core/theme.scss +102 -99
  42. package/core/ux.scss +2 -2
  43. package/core/var.scss +2 -0
  44. package/package.json +1 -1
  45. package/components/btns/btns@b.scss +0 -190
  46. package/components/btns/btns@c.scss +0 -172
  47. package/core/neatui@core.lite.scss +0 -30
  48. package/core/neatui@mobile.scss +0 -37
@@ -1,172 +0,0 @@
1
- @import './base.scss';
2
-
3
- @use 'sass:math';
4
- $size: 'xs', 's', 'm', 'l', 'xl';
5
- $type: 'none', 'main', 'text', 'read', 'weak', 'back', 'info', 'well', 'warn', 'risk';
6
-
7
- // 按钮
8
- [ui-btn~='@c'] {
9
- // 基础样式
10
- & {
11
- position: relative;
12
- display: inline-table;
13
- height: 2.5em;
14
- line-height: 2.5em;
15
- padding: 0 1em;
16
- border-radius: 0.25em;
17
- cursor: pointer;
18
- transition: all 50ms;
19
- text-align: center;
20
- vertical-align: middle;
21
- border: 0;
22
- user-select: none;
23
- white-space: nowrap;
24
- @include theme {
25
- color: co(text);
26
- background: co(weak);
27
- box-shadow: inset 0 0 0 1pxvar (--co-line);
28
- }
29
- }
30
-
31
- & > * {
32
- &.icon {
33
- display: inline-block;
34
- & + * {
35
- margin-left: 0.2em;
36
- }
37
- }
38
- }
39
-
40
- // 绝对尺寸
41
- &[ui-btn~=':abs'] {
42
- height: 2.5rem;
43
- line-height: 2.5rem;
44
- padding: 0 1rem;
45
- border-radius: 0.25rem;
46
- }
47
- // 圆弧按钮
48
- &[ui-btn~=':round'] {
49
- border-radius: 100em;
50
- }
51
-
52
- // 移入状态
53
- &:hover {
54
- @include theme {
55
- box-shadow:
56
- inset 0 0 0 1px co(line),
57
- inset 0 0 0 100em rgba(co(text), 0.04);
58
- }
59
- }
60
-
61
- // 按下状态
62
- &:active {
63
- transform: scale(0.98, 0.95);
64
- }
65
-
66
- // 正方形按钮
67
- &[ui-btn~=':square'] {
68
- width: 2.5em;
69
- padding: 0;
70
- }
71
-
72
- // 禁用按钮
73
- &[ui-btn~=':disabled'] {
74
- pointer-events: none;
75
- &,
76
- &:hover {
77
- opacity: 0.65;
78
- box-shadow:
79
- inset 0 0 0 1px transparent,
80
- inset 0 0 0 100em rgba(0, 0, 0, 0);
81
- cursor: not-allowed;
82
- }
83
- &:active {
84
- transform: scale(1, 1);
85
- cursor: not-allowed;
86
- }
87
- }
88
-
89
- // 按钮尺寸
90
- $base: 1.5;
91
- @each $i in $size {
92
- &[ui-btn~='#{$i}'] {
93
- height: #{$base}em;
94
- line-height: #{$base}em;
95
- padding: 0 #{calc(($base - 1) / 2)}em;
96
-
97
- // 方形按钮
98
- &[ui-btn~=':square'] {
99
- width: #{$base}em;
100
- padding: 0;
101
- }
102
-
103
- &[ui-btn~=':block'] {
104
- width: 100%;
105
- }
106
-
107
- &[ui-btn~=':abs'] {
108
- height: #{$base}rem;
109
- line-height: #{$base}rem;
110
- padding: 0 #{calc(($base - 1) / 2)}rem;
111
- }
112
- }
113
- $base: $base + 0.5;
114
- }
115
-
116
- // 按钮颜色
117
- @each $name in $type {
118
- &[ui-btn~='#{$name}'] {
119
- @if ($name == 'none' or $name == 'weak' or $name == 'back') {
120
- @include theme {
121
- background: co($name);
122
- }
123
- color: inherit;
124
- } @else {
125
- @include theme {
126
- color: co(back);
127
- background-image: linear-gradient(90deg, mix(co($name), #fff, 70%) 0%, co($name) 100%);
128
- }
129
- }
130
- box-shadow: inset 0 0 0 1px transparent;
131
-
132
- &:hover {
133
- @include theme {
134
- box-shadow:
135
- inset 0 0 0 1px transparent,
136
- inset 0 0 0 100em rgba(co(text), 0.04);
137
- }
138
- }
139
-
140
- // 边框式
141
- &[ui-btn~=':border'] {
142
- background: transparent;
143
- @include theme {
144
- color: co($name);
145
- box-shadow: inset 0 0 0 1px co($name);
146
- }
147
-
148
- &:hover {
149
- @include theme {
150
- box-shadow:
151
- inset 0 0 0 1px co($name),
152
- inset 0 0 0 100em rgba(co($name), 0.08);
153
- }
154
- }
155
- }
156
-
157
- // 下划线
158
- &[ui-btn~=':underline'] {
159
- @include theme {
160
- color: co($name);
161
- }
162
- background: transparent;
163
- box-shadow: inset 0 0 0 1px transparent;
164
-
165
- &:hover {
166
- box-shadow: inset 0 0 0 1px transparent;
167
- text-decoration: underline;
168
- }
169
- }
170
- }
171
- }
172
- }
@@ -1,30 +0,0 @@
1
- @charset "utf-8";
2
- @use 'sass:math';
3
- // 主题
4
- @import './theme.scss';
5
- // 媒体查询
6
- @import './media.scss';
7
- // 重置
8
- // @import './reset.scss';
9
- // 基础
10
- @import './base.scss';
11
- // 字号
12
- @import './size.scss';
13
- // 色号
14
- // @import './color.scss';
15
- // 栅格
16
- @import './cols.scss';
17
- // 微调
18
- @import './trim.scss';
19
- // 边框
20
- // @import './border.scss';
21
- // 弹性布局
22
- @import './flex.scss';
23
- // 缩小
24
- // @import './scale.scss';
25
- // 滚动条
26
- // @import './scroll.scss';
27
- // 封面
28
- @import './cover.scss';
29
- // 交互
30
- // @import './ux.scss';
@@ -1,37 +0,0 @@
1
- @charset "utf-8";
2
- @use 'sass:math';
3
- // 主题
4
- @import './theme.scss';
5
- // 媒体查询
6
- @import './media.scss';
7
- // 重置
8
- @import './reset.scss';
9
- // 基础
10
- @import './base.scss';
11
- // 对齐
12
- @import './pos.scss';
13
- // 字号
14
- @import './size.mobile.scss';
15
-
16
- // 色号
17
- @import './color.scss';
18
- // 栅格
19
- @import './cols.scss';
20
- // 微调
21
- @import './trim.mobile.scss';
22
- // 边距
23
- @import './padding.scss';
24
- // 外边距
25
- @import './margin.scss';
26
- // 边框
27
- @import './border.scss';
28
- // 弹性布局
29
- @import './flex.scss';
30
- // 缩小
31
- // @import './scale.scss';
32
- // 滚动条
33
- @import './scroll.scss';
34
- // 封面
35
- @import './cover.scss';
36
- // 交互
37
- @import './ux.scss';