bri-components 1.2.15 → 1.2.16

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.
@@ -12,9 +12,9 @@
12
12
  }
13
13
 
14
14
  &-default,
15
+ &-small,
15
16
  &-middle,
16
- &-large,
17
- &-small {
17
+ &-large {
18
18
  .ivu-modal-wrap {
19
19
  .ivu-modal {
20
20
  margin: auto;
@@ -23,28 +23,34 @@
23
23
  bottom: 0px;
24
24
  left: 0px;
25
25
  right: 0px;
26
- .ivu-modal-content {
26
+
27
+ &-content {
27
28
  width: 100%;
28
29
  height: 100%;
29
30
  display: flex;
30
31
  flex-direction: column;
31
- .ivu-modal-close {}
32
32
 
33
- .ivu-modal-header {
34
- width: 100%;
35
- height: 44px;
36
- padding: 10px 40px 10px 16px;
37
- }
38
- .ivu-modal-body {
39
- width: 100%;
40
- flex: 1;
41
- min-height: 200px;
42
- padding: 0px;
43
- overflow: auto;
44
- }
45
- .ivu-modal-footer {
46
- width: 100%;
47
- height: 50px;
33
+ .ivu-modal {
34
+ &-close {}
35
+
36
+ &-header {
37
+ width: 100%;
38
+ height: 44px;
39
+ padding: 10px 40px 10px 16px;
40
+ }
41
+
42
+ &-body {
43
+ width: 100%;
44
+ flex: 1;
45
+ min-height: 200px;
46
+ padding: 0px;
47
+ overflow: auto;
48
+ }
49
+
50
+ &-footer {
51
+ width: 100%;
52
+ height: 50px;
53
+ }
48
54
  }
49
55
  }
50
56
  }
@@ -53,6 +59,8 @@
53
59
 
54
60
  &-default {
55
61
  .ivu-modal-wrap {
62
+ margin: 24px;
63
+
56
64
  .ivu-modal {
57
65
  width: 750px !important;
58
66
  height: 550px !important;
@@ -61,14 +69,15 @@
61
69
  }
62
70
  }
63
71
  }
72
+
64
73
  &-small {
65
- .ivu-modal-wrap {
66
- .ivu-modal {
67
- // width: 500px !important;
74
+ .ivu-modal-wrap {
75
+ .ivu-modal {
68
76
  height: 400px !important;
69
77
  max-height: 100%;
70
78
  max-width: 100%;
71
- .ivu-modal-content{
79
+
80
+ &-content {
72
81
  .DshModal-close {
73
82
  top: 20px;
74
83
  right: 24px;
@@ -76,53 +85,70 @@
76
85
  font-size: 16px!important;
77
86
  }
78
87
 
79
- .ivu-modal-header {
80
- width: 100%;
81
- height: 44px;
82
- padding: 20px 24px 0px 24px;
83
- border-bottom: none;
84
- &-inner {
85
- color: rgba(0,0,0,0.9);
86
- font-size: 16px;
87
- font-weight: 500;
88
- line-height: 24px;
89
- height: 24px;
88
+ .ivu-modal {
89
+ &-header {
90
+ width: 100%;
91
+ height: 44px;
92
+ padding: 20px 24px 0px 24px;
93
+ border-bottom: none;
94
+
95
+ &-inner {
96
+ color: rgba(0,0,0,0.9);
97
+ font-size: 16px;
98
+ font-weight: 500;
99
+ line-height: 24px;
100
+ height: 24px;
101
+ }
102
+ }
103
+
104
+ &-body {
105
+ padding: 10px;
90
106
  }
91
- }
92
- .ivu-modal-body {
93
- padding: 10px;
94
107
  }
95
108
  }
96
109
  }
97
110
  }
98
111
  }
112
+
99
113
  &-middle {
100
- .ivu-modal-wrap {
101
- .ivu-modal {
102
- width: 1000px !important;
103
- height: 800px !important;
104
- max-height: 100%;
105
- max-width: 100%;
114
+ .ivu-modal-wrap {
115
+ margin: 24px;
116
+
117
+ .ivu-modal {
118
+ // width: 1000px !important;
119
+ // height: 800px !important;
120
+ width: 65% !important;
121
+ height: 80% !important;
122
+ min-width: 500px;
123
+ min-height: 400px;
124
+ // max-width: 900px;
125
+ // max-height: 800px;
106
126
  }
107
127
  }
108
128
  }
129
+
109
130
  &-large {
110
- .ivu-modal-wrap {
111
- .ivu-modal {
131
+ .ivu-modal-wrap {
132
+ margin: 20px;
133
+
134
+ .ivu-modal {
112
135
  width: 80% !important;
113
136
  height: 90% !important;
114
- min-width: 1000px !important;
115
- max-height: 100%;
116
- max-width: 100%;
137
+ min-width: 700px;
138
+ min-height: 600px;
139
+ // max-width: 1300px;
140
+ // max-height: 1000px;
117
141
  }
118
142
  }
119
143
  }
144
+
120
145
  &-auto {
121
- .ivu-modal-wrap {
146
+ .ivu-modal-wrap {
122
147
  display: flex;
123
148
  align-items: center;
124
149
  justify-content: center;
125
- .ivu-modal {
150
+
151
+ .ivu-modal {
126
152
  top: 0px;
127
153
  max-height: 100%;
128
154
  }
@@ -130,56 +156,75 @@
130
156
  }
131
157
  }
132
158
 
133
- .bri-modal-flex {
134
- display: flex;
135
- align-items: center;
136
- justify-content: center;
137
159
 
138
- .ivu-modal {
139
- top: 0px
160
+ // 默认模态框brimodal
161
+ // 通用样式
162
+ .bri-modal {
163
+ .ivu-modal-wrap {
164
+ .ivu-modal {
165
+ &-content {
166
+ height: 100%;
167
+ display: flex;
168
+ flex-direction: column;
169
+
170
+ .DshModal-close,
171
+ .ivu-modal-close {
172
+ top: 20px;
173
+ right: 24px;
174
+ color: @contentColor;
175
+ font-size: @smallTitleSize;
176
+
177
+ .ivu-icon-ios-close {
178
+ font-size: 22px;
179
+ color: @contentColor;
180
+ }
181
+ }
182
+
183
+ .ivu-modal-header {
184
+ width: 100%;
185
+ height: 44px;
186
+ padding: 20px 24px 0px 24px;
187
+ border-bottom: none;
188
+
189
+ &-inner {
190
+ color: rgba(0, 0, 0, 0.9);
191
+ font-size: 16px;
192
+ font-weight: 500;
193
+ line-height: 24px;
194
+ height: 24px;
195
+ }
196
+ }
197
+
198
+ .ivu-modal-body {
199
+ flex: 1;
200
+ overflow: auto;
201
+ padding: 16px 24px 20px;
202
+ }
203
+ }
204
+ }
140
205
  }
206
+ }
207
+
208
+ // 小框 无固定高度,上下居中
209
+ .bri-modal-center {
210
+ .bri-modal();
141
211
 
142
- .ivu-modal-content {
212
+ .ivu-modal-wrap {
213
+ width: 100%;
143
214
  height: 100%;
144
215
  display: flex;
145
216
  flex-direction: column;
146
- }
217
+ align-items: center;
218
+ justify-content: center;
147
219
 
148
- .ivu-modal-body {
149
- flex: 1;
150
- overflow: auto;
151
- padding: 0px;
152
- }
153
- }
154
-
155
- // 默认模态框brimodal
156
- .bri-modal {
157
- .DshModal-close {
158
- top: 20px;
159
- right: 24px;
160
- color: rgba(0,0,0,0.6);
161
- font-size: 16px;
162
- }
163
-
164
- .ivu-modal-header {
165
- width: 100%;
166
- height: 44px;
167
- padding: 20px 24px 0px 24px;
168
- border-bottom: none;
169
- &-inner {
170
- color: rgba(0,0,0,0.9);
171
- font-size: 16px;
172
- font-weight: 500;
173
- line-height: 24px;
174
- height: 24px;
220
+ .ivu-modal {
221
+ top: 0px;
175
222
  }
176
223
  }
177
- .ivu-modal-body {
178
- padding: 16px 24px 20px;
179
- }
224
+ }
180
225
 
181
- &-footer {
182
- text-align: right;
183
- margin-top: 16px;
184
- }
226
+ // modal内部公用样式
227
+ .bri-modal-footer {
228
+ text-align: right;
229
+ margin-top: 16px;
185
230
  }