@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,118 +1,118 @@
1
- @use "../style/variable" as variable;
2
-
3
- $cls: 'triones-antm-fetch-picker';
4
-
5
- .#{$cls} {
6
- height: 100%;
7
- display: flex;
8
- flex-direction: column;
9
- background-color: #f5f5f5;
10
-
11
- &-head {
12
- padding: variable.$trionesPaddingXxs;
13
- background-color: white;
14
- display: flex;
15
- flex-direction: row;
16
- justify-content: space-between;
17
- border-bottom: 1Px solid variable.$trionesBorderColor;
18
-
19
- &-icon {
20
- padding: 8Px;
21
- }
22
-
23
- &-title {
24
- flex: 1 auto;
25
- display: flex;
26
- justify-content: center;
27
- align-items: center;
28
- }
29
-
30
- &-button {
31
- color: variable.$trionesColorPrimaryText;
32
- display: inline-block;
33
- padding: 8Px;
34
- }
35
-
36
- }
37
-
38
- &-search-bar {
39
- padding: variable.$trionesPaddingXxs;
40
- background-color: white;
41
-
42
- &-input {
43
- background-color: #f5f5f5;
44
- }
45
- }
46
-
47
- &-empty {
48
- height: 100%;
49
- display: flex;
50
- justify-content: center;
51
- align-items: center;
52
- min-height: 100Px;
53
- }
54
-
55
- &-loading {
56
- height: 100%;
57
- display: flex;
58
- justify-content: center;
59
- align-items: center;
60
-
61
- &-content {
62
- display: flex;
63
- flex-direction: column;
64
- justify-content: center;
65
- align-items: center;
66
- gap: 8Px;
67
- font-size: 12Px;
68
- color: #8c8c8c;
69
- }
70
- }
71
-
72
- &-loading-more {
73
- padding: variable.$trionesPaddingXxs;
74
- display: flex;
75
- justify-content: center;
76
- align-items: center;
77
- color: #8c8c8c;
78
- font-size: 12Px;
79
- }
80
-
81
- &-body {
82
- flex: 1 auto;
83
-
84
- .#{$cls} {
85
- &-item {
86
- padding-block: variable.$trionesPaddingSm;
87
- padding-inline: variable.$trionesPadding;
88
- background-color: white;
89
- border-bottom: 1Px solid #f0f0f0;
90
- &-option{
91
- display: flex;
92
- &-selected{
93
- background-color: #e6f4ff;
94
- }
95
- &-content{
96
- flex: auto;
97
- overflow: hidden;
98
- white-space: nowrap;
99
- text-overflow: ellipsis;
100
- }
101
- &-state{
102
- .triones-antm-icon{
103
- color: variable.$trionesColorPrimaryText;
104
- font-size: variable.$trionesFontSize;
105
- }
106
- }
107
- }
108
- }
109
- }
110
- }
111
-
112
- &-footer {
113
- flex-shrink: 0;
114
- border-top: 1Px solid variable.$trionesBorderColor;
115
- padding: variable.$trionesPaddingXxs;
116
- background-color: white;
117
- }
118
- }
1
+ @use "../style/variable" as variable;
2
+
3
+ $cls: 'triones-antm-fetch-picker';
4
+
5
+ .#{$cls} {
6
+ height: 100%;
7
+ display: flex;
8
+ flex-direction: column;
9
+ background-color: #f5f5f5;
10
+
11
+ &-head {
12
+ padding: variable.$trionesPaddingXxs;
13
+ background-color: white;
14
+ display: flex;
15
+ flex-direction: row;
16
+ justify-content: space-between;
17
+ border-bottom: 1Px solid variable.$trionesBorderColor;
18
+
19
+ &-icon {
20
+ padding: 8Px;
21
+ }
22
+
23
+ &-title {
24
+ flex: 1 auto;
25
+ display: flex;
26
+ justify-content: center;
27
+ align-items: center;
28
+ }
29
+
30
+ &-button {
31
+ color: variable.$trionesColorPrimaryText;
32
+ display: inline-block;
33
+ padding: 8Px;
34
+ }
35
+
36
+ }
37
+
38
+ &-search-bar {
39
+ padding: variable.$trionesPaddingXxs;
40
+ background-color: white;
41
+
42
+ &-input {
43
+ background-color: #f5f5f5;
44
+ }
45
+ }
46
+
47
+ &-empty {
48
+ height: 100%;
49
+ display: flex;
50
+ justify-content: center;
51
+ align-items: center;
52
+ min-height: 100Px;
53
+ }
54
+
55
+ &-loading {
56
+ height: 100%;
57
+ display: flex;
58
+ justify-content: center;
59
+ align-items: center;
60
+
61
+ &-content {
62
+ display: flex;
63
+ flex-direction: column;
64
+ justify-content: center;
65
+ align-items: center;
66
+ gap: 8Px;
67
+ font-size: 12Px;
68
+ color: #8c8c8c;
69
+ }
70
+ }
71
+
72
+ &-loading-more {
73
+ padding: variable.$trionesPaddingXxs;
74
+ display: flex;
75
+ justify-content: center;
76
+ align-items: center;
77
+ color: #8c8c8c;
78
+ font-size: 12Px;
79
+ }
80
+
81
+ &-body {
82
+ flex: 1 auto;
83
+
84
+ .#{$cls} {
85
+ &-item {
86
+ padding-block: variable.$trionesPaddingSm;
87
+ padding-inline: variable.$trionesPadding;
88
+ background-color: white;
89
+ border-bottom: 1Px solid #f0f0f0;
90
+ &-option{
91
+ display: flex;
92
+ &-selected{
93
+ background-color: #e6f4ff;
94
+ }
95
+ &-content{
96
+ flex: auto;
97
+ overflow: hidden;
98
+ white-space: nowrap;
99
+ text-overflow: ellipsis;
100
+ }
101
+ &-state{
102
+ .triones-antm-icon{
103
+ color: variable.$trionesColorPrimaryText;
104
+ font-size: variable.$trionesFontSize;
105
+ }
106
+ }
107
+ }
108
+ }
109
+ }
110
+ }
111
+
112
+ &-footer {
113
+ flex-shrink: 0;
114
+ border-top: 1Px solid variable.$trionesBorderColor;
115
+ padding: variable.$trionesPaddingXxs;
116
+ background-color: white;
117
+ }
118
+ }
@@ -1,126 +1,126 @@
1
- @use "../style/variable" as variable;
2
-
3
- $floatButtonCls: "triones-antm-float-button";
4
- $floatButtonGroupCls: "triones-antm-float-button-group";
5
-
6
- $floatButtonSize: 48Px;
7
- $floatButtonShadow: 0 6Px 16Px 0 rgba(0, 0, 0, 0.08),
8
- 0 3Px 6Px -4Px rgba(0, 0, 0, 0.12), 0 9Px 28Px 8Px rgba(0, 0, 0, 0.05);
9
-
10
- .#{$floatButtonCls} {
11
- position: fixed;
12
- display: inline-flex;
13
- flex-shrink: 0;
14
- box-sizing: border-box;
15
-
16
- &--embedded {
17
- position: relative;
18
- right: auto;
19
- bottom: auto;
20
- z-index: auto;
21
- }
22
-
23
- &-body {
24
- box-sizing: border-box;
25
- margin: 0;
26
- padding: 0;
27
- display: inline-flex;
28
- align-items: center;
29
- justify-content: center;
30
- gap: 8Px;
31
- min-width: $floatButtonSize;
32
- min-height: $floatButtonSize;
33
- border: none;
34
- border-radius: 50%;
35
- cursor: pointer;
36
- font-size: 20Px;
37
- line-height: 1;
38
- color: rgba(0, 0, 0, 0.88);
39
- background: #fff;
40
- box-shadow: $floatButtonShadow;
41
- transition: color 0.2s, background 0.2s, box-shadow 0.2s;
42
- -webkit-tap-highlight-color: transparent;
43
- text-decoration: none;
44
-
45
- &:active {
46
- filter: brightness(0.95);
47
- }
48
- }
49
-
50
- &--shape-square &-body {
51
- border-radius: variable.$trionesBorderRadius;
52
- }
53
-
54
- &--has-content &-body {
55
- min-height: $floatButtonSize;
56
- display: inline-flex;
57
- flex-direction: column;
58
- align-items: center;
59
- justify-content: center;
60
- }
61
-
62
- &--type-primary &-body {
63
- color: #fff;
64
- background: variable.$trionesColorPrimary;
65
- }
66
-
67
- &-icon {
68
- display: inline-flex;
69
- align-items: center;
70
- justify-content: center;
71
- }
72
-
73
- &-content {
74
- font-size: variable.$trionesFontSizeSm;
75
- font-weight: 500;
76
- white-space: nowrap;
77
- }
78
- }
79
-
80
- .#{$floatButtonGroupCls} {
81
- position: fixed;
82
- display: flex;
83
- gap: 12Px;
84
- align-items: flex-end;
85
- box-sizing: border-box;
86
-
87
- &--placement {
88
- &-top {
89
- flex-direction: column;
90
- }
91
- &-bottom {
92
- flex-direction: column;
93
- }
94
- &-left {
95
- flex-direction: row;
96
- }
97
- &-right {
98
- flex-direction: row;
99
- }
100
- }
101
-
102
- &--menu {
103
- align-items: center;
104
- }
105
-
106
- &-list {
107
- display: flex;
108
- flex-direction: column;
109
- gap: 12Px;
110
- align-items: flex-end;
111
-
112
- &--hidden {
113
- display: none;
114
- }
115
- }
116
-
117
- &--placement-left &-list,
118
- &--placement-right &-list {
119
- flex-direction: column;
120
- }
121
-
122
- /** 小程序点击外部关闭:全屏遮罩;极淡背景避免部分机型不响应 tap */
123
- &-weapp-outside-mask {
124
- background: rgba(0, 0, 0, 0.001);
125
- }
126
- }
1
+ @use "../style/variable" as variable;
2
+
3
+ $floatButtonCls: "triones-antm-float-button";
4
+ $floatButtonGroupCls: "triones-antm-float-button-group";
5
+
6
+ $floatButtonSize: 48Px;
7
+ $floatButtonShadow: 0 6Px 16Px 0 rgba(0, 0, 0, 0.08),
8
+ 0 3Px 6Px -4Px rgba(0, 0, 0, 0.12), 0 9Px 28Px 8Px rgba(0, 0, 0, 0.05);
9
+
10
+ .#{$floatButtonCls} {
11
+ position: fixed;
12
+ display: inline-flex;
13
+ flex-shrink: 0;
14
+ box-sizing: border-box;
15
+
16
+ &--embedded {
17
+ position: relative;
18
+ right: auto;
19
+ bottom: auto;
20
+ z-index: auto;
21
+ }
22
+
23
+ &-body {
24
+ box-sizing: border-box;
25
+ margin: 0;
26
+ padding: 0;
27
+ display: inline-flex;
28
+ align-items: center;
29
+ justify-content: center;
30
+ gap: 8Px;
31
+ min-width: $floatButtonSize;
32
+ min-height: $floatButtonSize;
33
+ border: none;
34
+ border-radius: 50%;
35
+ cursor: pointer;
36
+ font-size: 20Px;
37
+ line-height: 1;
38
+ color: rgba(0, 0, 0, 0.88);
39
+ background: #fff;
40
+ box-shadow: $floatButtonShadow;
41
+ transition: color 0.2s, background 0.2s, box-shadow 0.2s;
42
+ -webkit-tap-highlight-color: transparent;
43
+ text-decoration: none;
44
+
45
+ &:active {
46
+ filter: brightness(0.95);
47
+ }
48
+ }
49
+
50
+ &--shape-square &-body {
51
+ border-radius: variable.$trionesBorderRadius;
52
+ }
53
+
54
+ &--has-content &-body {
55
+ min-height: $floatButtonSize;
56
+ display: inline-flex;
57
+ flex-direction: column;
58
+ align-items: center;
59
+ justify-content: center;
60
+ }
61
+
62
+ &--type-primary &-body {
63
+ color: #fff;
64
+ background: variable.$trionesColorPrimary;
65
+ }
66
+
67
+ &-icon {
68
+ display: inline-flex;
69
+ align-items: center;
70
+ justify-content: center;
71
+ }
72
+
73
+ &-content {
74
+ font-size: variable.$trionesFontSizeSm;
75
+ font-weight: 500;
76
+ white-space: nowrap;
77
+ }
78
+ }
79
+
80
+ .#{$floatButtonGroupCls} {
81
+ position: fixed;
82
+ display: flex;
83
+ gap: 12Px;
84
+ align-items: flex-end;
85
+ box-sizing: border-box;
86
+
87
+ &--placement {
88
+ &-top {
89
+ flex-direction: column;
90
+ }
91
+ &-bottom {
92
+ flex-direction: column;
93
+ }
94
+ &-left {
95
+ flex-direction: row;
96
+ }
97
+ &-right {
98
+ flex-direction: row;
99
+ }
100
+ }
101
+
102
+ &--menu {
103
+ align-items: center;
104
+ }
105
+
106
+ &-list {
107
+ display: flex;
108
+ flex-direction: column;
109
+ gap: 12Px;
110
+ align-items: flex-end;
111
+
112
+ &--hidden {
113
+ display: none;
114
+ }
115
+ }
116
+
117
+ &--placement-left &-list,
118
+ &--placement-right &-list {
119
+ flex-direction: column;
120
+ }
121
+
122
+ /** 小程序点击外部关闭:全屏遮罩;极淡背景避免部分机型不响应 tap */
123
+ &-weapp-outside-mask {
124
+ background: rgba(0, 0, 0, 0.001);
125
+ }
126
+ }
@@ -1,100 +1,100 @@
1
- @use "../style/variable" as variable;
2
-
3
-
4
- $cls-prefix-form-item: 'triones-antm-form-item';
5
-
6
-
7
- .#{$cls-prefix-form-item} {
8
- &.h5 {
9
- @include variable.h5-line-height;
10
- }
11
-
12
- &.wx {
13
- @include variable.wx-input-size;
14
- }
15
-
16
- &-label {
17
- font-size: variable.$trionesFontSize;
18
- color: #6F6F6F;
19
-
20
-
21
- &-wrapper {
22
- //display: flex;
23
- //align-items: center;
24
- height: 100%;
25
- }
26
-
27
- &-required-mark {
28
- display: inline-block;
29
- color: variable.$trionesColorError;
30
- width: 8Px;
31
- margin-left: -8Px;
32
- }
33
-
34
- }
35
-
36
- &-content {
37
-
38
- &-end {
39
- text-align: end;
40
- }
41
-
42
- .#{$cls-prefix-form-item} {
43
- &-error {
44
- font-size: variable.$trionesFontSizeSm;
45
- color: variable.$trionesColorError;
46
- line-height: normal;
47
- }
48
- }
49
- }
50
-
51
- &-horizontal {
52
- display: flex;
53
-
54
- .#{$cls-prefix-form-item} {
55
- &-label {
56
- padding-block: 12Px;
57
- flex-shrink: 1;
58
- min-width: 0;
59
- }
60
-
61
- &-content {
62
- padding-block: 12Px;
63
- flex: 1;
64
- flex-shrink: 1;
65
- min-width: 0;
66
-
67
- &-end {
68
- text-align: end;
69
- }
70
- }
71
- }
72
-
73
- &.#{$cls-prefix-form-item} {
74
- &-start {
75
- align-items: flex-start;
76
- }
77
-
78
- &-center {
79
- //align-items: center;
80
- }
81
- }
82
- }
83
-
84
- &-vertical {
85
- .#{$cls-prefix-form-item} {
86
- &-label {
87
- margin-bottom: 4Px;
88
- }
89
-
90
- &-content {
91
- padding-block-end: 8Px;
92
- }
93
- }
94
-
95
- }
96
-
97
- &-hidden {
98
- display: none;
99
- }
100
- }
1
+ @use "../style/variable" as variable;
2
+
3
+
4
+ $cls-prefix-form-item: 'triones-antm-form-item';
5
+
6
+
7
+ .#{$cls-prefix-form-item} {
8
+ &.h5 {
9
+ @include variable.h5-line-height;
10
+ }
11
+
12
+ &.wx {
13
+ @include variable.wx-input-size;
14
+ }
15
+
16
+ &-label {
17
+ font-size: variable.$trionesFontSize;
18
+ color: #6F6F6F;
19
+
20
+
21
+ &-wrapper {
22
+ //display: flex;
23
+ //align-items: center;
24
+ height: 100%;
25
+ }
26
+
27
+ &-required-mark {
28
+ display: inline-block;
29
+ color: variable.$trionesColorError;
30
+ width: 8Px;
31
+ margin-left: -8Px;
32
+ }
33
+
34
+ }
35
+
36
+ &-content {
37
+
38
+ &-end {
39
+ text-align: end;
40
+ }
41
+
42
+ .#{$cls-prefix-form-item} {
43
+ &-error {
44
+ font-size: variable.$trionesFontSizeSm;
45
+ color: variable.$trionesColorError;
46
+ line-height: normal;
47
+ }
48
+ }
49
+ }
50
+
51
+ &-horizontal {
52
+ display: flex;
53
+
54
+ .#{$cls-prefix-form-item} {
55
+ &-label {
56
+ padding-block: 12Px;
57
+ flex-shrink: 1;
58
+ min-width: 0;
59
+ }
60
+
61
+ &-content {
62
+ padding-block: 12Px;
63
+ flex: 1;
64
+ flex-shrink: 1;
65
+ min-width: 0;
66
+
67
+ &-end {
68
+ text-align: end;
69
+ }
70
+ }
71
+ }
72
+
73
+ &.#{$cls-prefix-form-item} {
74
+ &-start {
75
+ align-items: flex-start;
76
+ }
77
+
78
+ &-center {
79
+ //align-items: center;
80
+ }
81
+ }
82
+ }
83
+
84
+ &-vertical {
85
+ .#{$cls-prefix-form-item} {
86
+ &-label {
87
+ margin-bottom: 4Px;
88
+ }
89
+
90
+ &-content {
91
+ padding-block-end: 8Px;
92
+ }
93
+ }
94
+
95
+ }
96
+
97
+ &-hidden {
98
+ display: none;
99
+ }
100
+ }