@trionesdev/antd-taro-react 0.0.2-beta.18 → 0.0.2-beta.19

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.
@@ -1,282 +1,282 @@
1
- @use "../style/variable" as variable;
2
-
3
- $inputCls: 'triones-antm-input';
4
- $inputAffixWrapperCls: 'triones-antm-input-affix-wrapper';
5
- $inputGroupWrapperCls: 'triones-antm-input-group-wrapper';
6
- $inputPotCls: 'triones-antm-pot';
7
-
8
- $inputSm: 24Px;
9
- $inputMd: 32Px;
10
- $inputLg: 40Px;
11
-
12
- $placeholderColor: variable.$trionesColorTextPlaceholder;
13
-
14
- input {
15
- height: auto;
16
- font-size: variable.$trionesInputInputFontSize;
17
-
18
-
19
- &::placeholder {
20
- font-size: variable.$trionesInputInputFontSize;
21
- color: $placeholderColor
22
- }
23
- }
24
-
25
- wx-input {
26
- &::placeholder {
27
- font-size: variable.$trionesInputInputFontSize;
28
- color: $placeholderColor
29
- }
30
- }
31
-
32
- .#{$inputCls} {
33
- box-sizing: border-box;
34
- display: inline-block;
35
- position: relative;
36
- width: 100%;
37
- min-width: 0;
38
- transition: all .2s;
39
- outline: none;
40
- box-shadow: none;
41
- border: none;
42
- border-radius: variable.$trionesBorderRadius;
43
- font-size: variable.$trionesInputInputFontSize;
44
-
45
- &-small {
46
- padding: variable.$trionesInputPaddingBlockSm 0;
47
- font-size: variable.$trionesInputInputFontSizeSm;
48
- }
49
-
50
- &-large {
51
- padding: variable.$trionesInputPaddingBlockLg 0;
52
- font-size: variable.$trionesInputInputFontSizeLg;
53
- }
54
-
55
- &::placeholder {
56
- font-size: variable.$trionesInputInputFontSize;
57
- color: $placeholderColor
58
- }
59
-
60
- .weui-input {
61
- &::placeholder {
62
- font-size: variable.$trionesInputInputFontSize;
63
- color: $placeholderColor
64
- }
65
- }
66
- }
67
-
68
-
69
- .#{$inputAffixWrapperCls} {
70
- box-sizing: border-box;
71
- position: relative;
72
- display: inline-flex;
73
- align-items: center;
74
- width: 100%;
75
- min-width: 0;
76
- flex-shrink: 1;
77
- //line-height: variable.$trionesLineHeight;
78
- //padding: variable.$trionesInputPaddingBlock 0;
79
- gap: 4Px;
80
-
81
-
82
- &-small {
83
- padding: variable.$trionesInputPaddingBlockSm 0;
84
- font-size: variable.$trionesInputInputFontSizeSm;
85
- }
86
-
87
- &-large {
88
- padding: variable.$trionesInputPaddingBlockLg 0;
89
- font-size: variable.$trionesInputInputFontSizeLg;
90
- }
91
-
92
-
93
-
94
- .#{$inputCls} {
95
- padding: 0;
96
- background-color: transparent;
97
- height: 100%;
98
-
99
-
100
- &-prifix {}
101
-
102
- &-suffix {
103
- display: inline-flex;
104
- align-items: center;
105
- vertical-align: middle;
106
- flex-shrink: 0;
107
- row-gap: 4Px;
108
- // padding-inline: 4Px;
109
- line-height: normal;
110
-
111
- .clear-icon {
112
- color: rgba(0, 0, 0, 0.25);
113
-
114
-
115
- &:hover {
116
- color: rgba(0, 0, 0, 0.45);
117
- }
118
- }
119
-
120
- .triones-antm-icon {
121
- cursor: pointer;
122
- padding-inline: 4Px;
123
- }
124
- }
125
- }
126
-
127
- taro-input-core {
128
- &::placeholder {
129
- font-size: variable.$trionesInputInputFontSize;
130
- color: $placeholderColor
131
- }
132
-
133
-
134
- .weui-input {
135
- &::placeholder {
136
- font-size: variable.$trionesInputInputFontSize;
137
- color: $placeholderColor
138
- }
139
- }
140
- }
141
-
142
-
143
- .triones-antm-icon {
144
- font-size: 14Px;
145
- }
146
-
147
- }
148
-
149
- .#{$inputCls} {
150
- &-outlined {
151
- border-radius: variable.$trionesBorderRadius;
152
- border: 1Px solid variable.$trionesBorderColor;
153
- padding-block: variable.$trionesInputPaddingBlock;
154
- padding-inline: variable.$trionesInputPaddingBlock;
155
- }
156
-
157
- &-filled {
158
- border-radius: variable.$trionesBorderRadius;
159
- background-color: variable.$trionesColorFillTertiary;
160
- padding-block: variable.$trionesInputPaddingBlock;
161
- padding-inline: variable.$trionesInputPaddingBlock;
162
- }
163
-
164
- &-underlined {
165
- border-bottom: 1Px solid variable.$trionesBorderColor;
166
- padding-block: variable.$trionesInputPaddingBlock;
167
- }
168
- }
169
-
170
- .#{$inputGroupWrapperCls} {}
171
-
172
-
173
- .#{$inputPotCls} {
174
- position: relative;
175
- display: inline-flex;
176
- vertical-align: middle;
177
-
178
- &-wrapper {
179
- position: relative;
180
- display: inline-flex;
181
- align-items: center;
182
- flex-wrap: nowrap;
183
- column-gap: 8Px;
184
- }
185
-
186
- &-input {
187
- position: absolute;
188
- background-color: transparent;
189
- z-index: -1;
190
- left: 0;
191
- top: 0;
192
- right: 0;
193
- bottom: 0;
194
- opacity: 0;
195
- -moz-appearance: textfield;
196
-
197
- &::-webkit-outer-spin-button,
198
- &::-webkit-inner-spin-button {
199
- -webkit-appearance: none;
200
- margin: 0;
201
- }
202
- }
203
-
204
- &-item {
205
- text-align: center;
206
- font-size: variable.$trionesInputInputFontSize;
207
- height: variable.$trionesControlHeight;
208
- width: variable.$trionesControlHeight;
209
- display: inline-flex;
210
- align-items: center;
211
- justify-content: center;
212
-
213
- &-sm {
214
- width: variable.$trionesControlHeightSm;
215
- height: variable.$trionesControlHeightSm;
216
- }
217
-
218
- &-lg {
219
- width: variable.$trionesControlHeightLg;
220
- height: variable.$trionesControlHeightLg;
221
- }
222
-
223
- &::placeholder {
224
- font-size: variable.$trionesInputInputFontSize;
225
- color: $placeholderColor
226
- }
227
-
228
- &-focus {
229
- &::after {
230
- content: ' ';
231
- height: 100%;
232
- width: 0.5Px;
233
- background-color: #0a0a0a;
234
- transition: transform 0.1s ease;
235
- animation: blink 1s step-end infinite;
236
- }
237
- }
238
-
239
- }
240
-
241
- .#{$inputCls}-outlined {
242
- font-size: variable.$trionesInputInputFontSize;
243
- color: rgba(0, 0, 0, 0.88);
244
- background: #ffffff;
245
- border-width: 1Px;
246
- border-style: solid;
247
- border-color: #d9d9d9;
248
- -webkit-appearance: none;
249
- -moz-appearance: none;
250
- appearance: none;
251
- }
252
- }
253
-
254
-
255
- .#{$inputCls}-textarea {
256
- box-sizing: border-box;
257
- width: 100%;
258
- outline: 0;
259
- font-size: variable.$trionesInputInputFontSize;
260
-
261
- taro-textarea-core {
262
- width: 100%;
263
- }
264
- .taro-textarea{
265
- background-color: transparent;
266
- }
267
- textarea {
268
- padding-block: 2Px;
269
- background-color: transparent;
270
- &::placeholder {
271
- font-size: variable.$trionesInputInputFontSize;
272
- color: $placeholderColor
273
- }
274
- }
275
-
276
- }
277
-
278
- @keyframes blink {
279
- 50% {
280
- background-color: transparent;
281
- }
282
- }
1
+ @use "../style/variable" as variable;
2
+
3
+ $inputCls: 'triones-antm-input';
4
+ $inputAffixWrapperCls: 'triones-antm-input-affix-wrapper';
5
+ $inputGroupWrapperCls: 'triones-antm-input-group-wrapper';
6
+ $inputPotCls: 'triones-antm-pot';
7
+
8
+ $inputSm: 24Px;
9
+ $inputMd: 32Px;
10
+ $inputLg: 40Px;
11
+
12
+ $placeholderColor: variable.$trionesColorTextPlaceholder;
13
+
14
+ input {
15
+ height: auto;
16
+ font-size: variable.$trionesInputInputFontSize;
17
+
18
+
19
+ &::placeholder {
20
+ font-size: variable.$trionesInputInputFontSize;
21
+ color: $placeholderColor
22
+ }
23
+ }
24
+
25
+ wx-input {
26
+ &::placeholder {
27
+ font-size: variable.$trionesInputInputFontSize;
28
+ color: $placeholderColor
29
+ }
30
+ }
31
+
32
+ .#{$inputCls} {
33
+ box-sizing: border-box;
34
+ display: inline-block;
35
+ position: relative;
36
+ width: 100%;
37
+ min-width: 0;
38
+ transition: all .2s;
39
+ outline: none;
40
+ box-shadow: none;
41
+ border: none;
42
+ border-radius: variable.$trionesBorderRadius;
43
+ font-size: variable.$trionesInputInputFontSize;
44
+
45
+ &-small {
46
+ padding: variable.$trionesInputPaddingBlockSm 0;
47
+ font-size: variable.$trionesInputInputFontSizeSm;
48
+ }
49
+
50
+ &-large {
51
+ padding: variable.$trionesInputPaddingBlockLg 0;
52
+ font-size: variable.$trionesInputInputFontSizeLg;
53
+ }
54
+
55
+ &::placeholder {
56
+ font-size: variable.$trionesInputInputFontSize;
57
+ color: $placeholderColor
58
+ }
59
+
60
+ .weui-input {
61
+ &::placeholder {
62
+ font-size: variable.$trionesInputInputFontSize;
63
+ color: $placeholderColor
64
+ }
65
+ }
66
+ }
67
+
68
+
69
+ .#{$inputAffixWrapperCls} {
70
+ box-sizing: border-box;
71
+ position: relative;
72
+ display: inline-flex;
73
+ align-items: center;
74
+ width: 100%;
75
+ min-width: 0;
76
+ flex-shrink: 1;
77
+ //line-height: variable.$trionesLineHeight;
78
+ //padding: variable.$trionesInputPaddingBlock 0;
79
+ gap: 4Px;
80
+
81
+
82
+ &-small {
83
+ padding: variable.$trionesInputPaddingBlockSm 0;
84
+ font-size: variable.$trionesInputInputFontSizeSm;
85
+ }
86
+
87
+ &-large {
88
+ padding: variable.$trionesInputPaddingBlockLg 0;
89
+ font-size: variable.$trionesInputInputFontSizeLg;
90
+ }
91
+
92
+
93
+
94
+ .#{$inputCls} {
95
+ padding: 0;
96
+ background-color: transparent;
97
+ height: 100%;
98
+
99
+
100
+ &-prifix {}
101
+
102
+ &-suffix {
103
+ display: inline-flex;
104
+ align-items: center;
105
+ vertical-align: middle;
106
+ flex-shrink: 0;
107
+ row-gap: 4Px;
108
+ // padding-inline: 4Px;
109
+ line-height: normal;
110
+
111
+ .clear-icon {
112
+ color: rgba(0, 0, 0, 0.25);
113
+
114
+
115
+ &:hover {
116
+ color: rgba(0, 0, 0, 0.45);
117
+ }
118
+ }
119
+
120
+ .triones-antm-icon {
121
+ cursor: pointer;
122
+ padding-inline: 4Px;
123
+ }
124
+ }
125
+ }
126
+
127
+ taro-input-core {
128
+ &::placeholder {
129
+ font-size: variable.$trionesInputInputFontSize;
130
+ color: $placeholderColor
131
+ }
132
+
133
+
134
+ .weui-input {
135
+ &::placeholder {
136
+ font-size: variable.$trionesInputInputFontSize;
137
+ color: $placeholderColor
138
+ }
139
+ }
140
+ }
141
+
142
+
143
+ .triones-antm-icon {
144
+ font-size: 14Px;
145
+ }
146
+
147
+ }
148
+
149
+ .#{$inputCls} {
150
+ &-outlined {
151
+ border-radius: variable.$trionesBorderRadius;
152
+ border: 1Px solid variable.$trionesBorderColor;
153
+ padding-block: variable.$trionesInputPaddingBlock;
154
+ padding-inline: variable.$trionesInputPaddingBlock;
155
+ }
156
+
157
+ &-filled {
158
+ border-radius: variable.$trionesBorderRadius;
159
+ background-color: variable.$trionesColorFillTertiary;
160
+ padding-block: variable.$trionesInputPaddingBlock;
161
+ padding-inline: variable.$trionesInputPaddingBlock;
162
+ }
163
+
164
+ &-underlined {
165
+ border-bottom: 1Px solid variable.$trionesBorderColor;
166
+ padding-block: variable.$trionesInputPaddingBlock;
167
+ }
168
+ }
169
+
170
+ .#{$inputGroupWrapperCls} {}
171
+
172
+
173
+ .#{$inputPotCls} {
174
+ position: relative;
175
+ display: inline-flex;
176
+ vertical-align: middle;
177
+
178
+ &-wrapper {
179
+ position: relative;
180
+ display: inline-flex;
181
+ align-items: center;
182
+ flex-wrap: nowrap;
183
+ column-gap: 8Px;
184
+ }
185
+
186
+ &-input {
187
+ position: absolute;
188
+ background-color: transparent;
189
+ z-index: -1;
190
+ left: 0;
191
+ top: 0;
192
+ right: 0;
193
+ bottom: 0;
194
+ opacity: 0;
195
+ -moz-appearance: textfield;
196
+
197
+ &::-webkit-outer-spin-button,
198
+ &::-webkit-inner-spin-button {
199
+ -webkit-appearance: none;
200
+ margin: 0;
201
+ }
202
+ }
203
+
204
+ &-item {
205
+ text-align: center;
206
+ font-size: variable.$trionesInputInputFontSize;
207
+ height: variable.$trionesControlHeight;
208
+ width: variable.$trionesControlHeight;
209
+ display: inline-flex;
210
+ align-items: center;
211
+ justify-content: center;
212
+
213
+ &-sm {
214
+ width: variable.$trionesControlHeightSm;
215
+ height: variable.$trionesControlHeightSm;
216
+ }
217
+
218
+ &-lg {
219
+ width: variable.$trionesControlHeightLg;
220
+ height: variable.$trionesControlHeightLg;
221
+ }
222
+
223
+ &::placeholder {
224
+ font-size: variable.$trionesInputInputFontSize;
225
+ color: $placeholderColor
226
+ }
227
+
228
+ &-focus {
229
+ &::after {
230
+ content: ' ';
231
+ height: 100%;
232
+ width: 0.5Px;
233
+ background-color: #0a0a0a;
234
+ transition: transform 0.1s ease;
235
+ animation: blink 1s step-end infinite;
236
+ }
237
+ }
238
+
239
+ }
240
+
241
+ .#{$inputCls}-outlined {
242
+ font-size: variable.$trionesInputInputFontSize;
243
+ color: rgba(0, 0, 0, 0.88);
244
+ background: #ffffff;
245
+ border-width: 1Px;
246
+ border-style: solid;
247
+ border-color: #d9d9d9;
248
+ -webkit-appearance: none;
249
+ -moz-appearance: none;
250
+ appearance: none;
251
+ }
252
+ }
253
+
254
+
255
+ .#{$inputCls}-textarea {
256
+ box-sizing: border-box;
257
+ width: 100%;
258
+ outline: 0;
259
+ font-size: variable.$trionesInputInputFontSize;
260
+
261
+ taro-textarea-core {
262
+ width: 100%;
263
+ }
264
+ .taro-textarea{
265
+ background-color: transparent;
266
+ }
267
+ textarea {
268
+ padding-block: 2Px;
269
+ background-color: transparent;
270
+ &::placeholder {
271
+ font-size: variable.$trionesInputInputFontSize;
272
+ color: $placeholderColor
273
+ }
274
+ }
275
+
276
+ }
277
+
278
+ @keyframes blink {
279
+ 50% {
280
+ background-color: transparent;
281
+ }
282
+ }
@@ -1,20 +1,20 @@
1
- @use "../style/variable" as variable;
2
-
3
- $trionesOverlayCls: 'triones-antm-overlay';
4
-
5
- .#{$trionesOverlayCls} {
6
- position: fixed;
7
- top: 0;
8
- left: 0;
9
- right: 0;
10
- bottom: 0;
11
- background-color: rgba(0, 0, 0, .55);
12
- opacity: 0;
13
- transition: opacity 0.3s ease;
14
- pointer-events: none; // 初始状态不可点击
15
-
16
- &-active {
17
- opacity: 1;
18
- pointer-events: auto;
19
- }
20
- }
1
+ @use "../style/variable" as variable;
2
+
3
+ $trionesOverlayCls: 'triones-antm-overlay';
4
+
5
+ .#{$trionesOverlayCls} {
6
+ position: fixed;
7
+ top: 0;
8
+ left: 0;
9
+ right: 0;
10
+ bottom: 0;
11
+ background-color: rgba(0, 0, 0, .55);
12
+ opacity: 0;
13
+ transition: opacity 0.3s ease;
14
+ pointer-events: none; // 初始状态不可点击
15
+
16
+ &-active {
17
+ opacity: 1;
18
+ pointer-events: auto;
19
+ }
20
+ }
@@ -1,41 +1,41 @@
1
- @use "../style/variable" as variable;
2
- $pickerCls: 'triones-antm-picker';
3
-
4
- .#{$pickerCls} {
5
- width: 100%;
6
- height: 300Px;
7
- overflow: hidden;
8
- position: relative;
9
- display: flex;
10
- flex-direction: column;
11
-
12
- &-header {
13
- display: flex;
14
- justify-content: space-between;
15
- align-items: center;
16
- border-bottom: 1Px solid #eee;
17
- padding: 4Px;
18
-
19
- &-button {
20
- padding: 8Px;
21
- font-size: 12Px;
22
- &-cancel{
23
- color: variable.$trionesColorTextSecondary;
24
- }
25
- &-ok{
26
- color: variable.$trionesColorPrimary;
27
- }
28
- }
29
-
30
- &-title {
31
- }
32
- }
33
-
34
- &-body {
35
- flex: 1 1;
36
- width: 100%;
37
- height: 100%;
38
- pointer-events: unset;
39
- }
40
-
41
- }
1
+ @use "../style/variable" as variable;
2
+ $pickerCls: 'triones-antm-picker';
3
+
4
+ .#{$pickerCls} {
5
+ width: 100%;
6
+ height: 300Px;
7
+ overflow: hidden;
8
+ position: relative;
9
+ display: flex;
10
+ flex-direction: column;
11
+
12
+ &-header {
13
+ display: flex;
14
+ justify-content: space-between;
15
+ align-items: center;
16
+ border-bottom: 1Px solid #eee;
17
+ padding: 4Px;
18
+
19
+ &-button {
20
+ padding: 8Px;
21
+ font-size: 12Px;
22
+ &-cancel{
23
+ color: variable.$trionesColorTextSecondary;
24
+ }
25
+ &-ok{
26
+ color: variable.$trionesColorPrimary;
27
+ }
28
+ }
29
+
30
+ &-title {
31
+ }
32
+ }
33
+
34
+ &-body {
35
+ flex: 1 1;
36
+ width: 100%;
37
+ height: 100%;
38
+ pointer-events: unset;
39
+ }
40
+
41
+ }