cc-core-cli 1.0.56 → 1.0.58

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,2454 +1,2410 @@
1
1
  @import "custom-antd.less";
2
2
 
3
3
  .timeline-title {
4
- font-weight: bold;
4
+ font-weight: bold;
5
5
 
6
- .time {
7
- font-weight: normal;
8
- color: #c4c4c4;
9
- }
6
+ .time {
7
+ font-weight: normal;
8
+ color: #c4c4c4;
9
+ }
10
10
  }
11
11
 
12
12
  .mix-button-dropdown-container {
13
- margin: 0 0 0 9px;
14
- border: 1px solid @primary-color;
15
- padding: 6px 10px;
16
- border-radius: 5px;
13
+ margin: 0 0 0 9px;
14
+ border: 1px solid @primary-color;
15
+ padding: 6px 10px;
16
+ border-radius: 5px;
17
17
  }
18
18
 
19
19
  .mix-button-text {
20
- color: @primary-color;
20
+ color: @primary-color;
21
21
  }
22
22
 
23
23
  .related-one2one-select {
24
- .ant-select-selector {
25
- border-top-right-radius: 0 !important;
26
- border-bottom-right-radius: 0 !important;
27
- }
24
+ .ant-select-selector {
25
+ border-top-right-radius: 0 !important;
26
+ border-bottom-right-radius: 0 !important;
27
+ }
28
28
  }
29
29
 
30
30
  .form-item-related-one2one-select.ant-form-item-has-feedback.ant-form-item-has-error {
31
- .ant-form-item-children-icon {
32
- right: 46px;
33
- }
31
+ .ant-form-item-children-icon {
32
+ right: 46px;
33
+ }
34
34
  }
35
35
 
36
36
  // components layout
37
37
  .detail-component-layout {
38
- padding-left: 8px;
39
- padding-right: 8px;
40
-
41
- .component-layout-detail {
42
- .component-layout-detail-dnd {
43
- margin: 0px;
44
- margin-bottom: 24px;
45
-
46
- .layout-container {
47
-
48
- .position-top,
49
- .position-bottom {
50
- min-height: 50px;
51
- border: 1px solid @border-color-base;
52
- }
53
-
54
- .position-top {
55
- border-top-left-radius: @border-radius-base;
56
- border-top-right-radius: @border-radius-base;
57
- }
58
-
59
- .position-bottom {
60
- border-bottom-left-radius: @border-radius-base;
61
- border-bottom-right-radius: @border-radius-base;
62
- }
63
-
64
- .position-middle-top {
65
- min-height: 50px;
66
- border-bottom: 1px solid @border-color-base;
67
- }
68
-
69
- .position-middle-bottom {
70
- min-height: 50px;
71
- border-top: 1px solid @border-color-base;
72
- }
73
-
74
- .position-middle-middle {
75
- height: 100px;
76
- background-color: @background-color;
77
- }
78
-
79
- .position-left,
80
- .position-right {
81
- min-height: 150px;
82
- border: 1px solid @border-color-base;
83
- border-top: none;
84
- border-bottom: none;
85
- }
86
-
87
- .layout-block {
88
- height: 100%;
89
- min-height: 50px;
38
+ padding-left: 8px;
39
+ padding-right: 8px;
40
+
41
+ .component-layout-detail {
42
+ .component-layout-detail-dnd {
43
+ margin: 0px;
44
+ margin-bottom: 24px;
45
+
46
+ .layout-container {
47
+ .position-top,
48
+ .position-bottom {
49
+ min-height: 50px;
50
+ border: 1px solid @border-color-base;
51
+ }
90
52
 
91
- .layout-block-item {
92
- position: relative;
93
- margin: 8px;
94
- display: flex;
95
- flex-direction: column;
53
+ .position-top {
54
+ border-top-left-radius: @border-radius-base;
55
+ border-top-right-radius: @border-radius-base;
56
+ }
96
57
 
97
- .block-item {
98
- display: flex;
99
- border: 1px dashed #f2f2f2;
58
+ .position-bottom {
59
+ border-bottom-left-radius: @border-radius-base;
60
+ border-bottom-right-radius: @border-radius-base;
61
+ }
100
62
 
101
- .item {
102
- width: 100%;
103
- padding: 5px 8px;
104
- }
63
+ .position-middle-top {
64
+ min-height: 50px;
65
+ border-bottom: 1px solid @border-color-base;
66
+ }
105
67
 
106
- .icon-edit {
107
- cursor: pointer;
108
- padding-right: 24px;
109
- padding-top: 5px;
110
- color: @border-color-base;
68
+ .position-middle-bottom {
69
+ min-height: 50px;
70
+ border-top: 1px solid @border-color-base;
71
+ }
111
72
 
112
- &:hover {
113
- color: @text-color;
73
+ .position-middle-middle {
74
+ height: 100px;
75
+ background-color: @background-color;
114
76
  }
115
- }
116
77
 
117
- .icon-remove {
118
- display: flex;
119
- cursor: pointer;
120
- position: absolute;
121
- right: 6px;
122
- top: 9px;
123
- z-index: 2;
124
- color: @border-color-base;
78
+ .position-left,
79
+ .position-right {
80
+ min-height: 150px;
81
+ border: 1px solid @border-color-base;
82
+ border-top: none;
83
+ border-bottom: none;
84
+ }
125
85
 
126
- &:hover {
127
- color: @text-color;
86
+ .layout-block {
87
+ height: 100%;
88
+ min-height: 50px;
89
+
90
+ .layout-block-item {
91
+ position: relative;
92
+ margin: 8px;
93
+ display: flex;
94
+ flex-direction: column;
95
+
96
+ .block-item {
97
+ display: flex;
98
+ border: 1px dashed #f2f2f2;
99
+
100
+ .item {
101
+ width: 100%;
102
+ padding: 5px 8px;
103
+ }
104
+
105
+ .icon-edit {
106
+ cursor: pointer;
107
+ padding-right: 24px;
108
+ padding-top: 5px;
109
+ color: @border-color-base;
110
+
111
+ &:hover {
112
+ color: @text-color;
113
+ }
114
+ }
115
+
116
+ .icon-remove {
117
+ display: flex;
118
+ cursor: pointer;
119
+ position: absolute;
120
+ right: 6px;
121
+ top: 9px;
122
+ z-index: 2;
123
+ color: @border-color-base;
124
+
125
+ &:hover {
126
+ color: @text-color;
127
+ }
128
+ }
129
+ }
130
+ }
128
131
  }
129
- }
130
132
  }
131
- }
132
- }
133
- }
134
133
 
135
- .widget-container {
136
- .widget {
137
- cursor: pointer;
138
- background-color: @background-color;
139
- margin-bottom: 5px;
140
- border-radius: 5px;
141
- padding: 5px 15px;
142
- white-space: nowrap;
143
- overflow: hidden;
144
- text-overflow: ellipsis;
134
+ .widget-container {
135
+ .widget {
136
+ cursor: pointer;
137
+ background-color: @background-color;
138
+ margin-bottom: 5px;
139
+ border-radius: 5px;
140
+ padding: 5px 15px;
141
+ white-space: nowrap;
142
+ overflow: hidden;
143
+ text-overflow: ellipsis;
144
+ }
145
+ }
145
146
  }
146
- }
147
147
  }
148
- }
149
148
  }
150
149
 
151
150
  // Component Mapping Data mapping-tree
152
151
  .component-mapping-data {
153
- padding-top: 10px;
154
- .mapping-data-dnd {
155
-
156
- .field-container,
157
- .functions-container {
158
-
159
- .field-container-body,
160
- .functions-container-body {
161
- max-height: 40vh;
162
- overflow-y: auto;
163
- }
164
-
165
- .field,
166
- .functions {
167
- cursor: pointer;
168
- background-color: @background-color;
169
- margin-bottom: 5px;
170
- border-radius: 5px;
171
- padding: 5px 15px;
172
- white-space: nowrap;
173
- overflow: hidden;
174
- text-overflow: ellipsis;
175
- }
176
- }
177
-
178
-
179
- .ant-select.source-field {
152
+ padding-top: 10px;
153
+ .mapping-data-dnd {
154
+ .field-container,
155
+ .functions-container {
156
+ .field-container-body,
157
+ .functions-container-body {
158
+ max-height: 40vh;
159
+ overflow-y: auto;
160
+ }
180
161
 
181
- .ant-select-single:not(.ant-select-customize-input),
182
- .ant-select-selector {
183
- padding-left: 40px;
184
- }
185
- }
162
+ .field,
163
+ .functions {
164
+ cursor: pointer;
165
+ background-color: @background-color;
166
+ margin-bottom: 5px;
167
+ border-radius: 5px;
168
+ padding: 5px 15px;
169
+ white-space: nowrap;
170
+ overflow: hidden;
171
+ text-overflow: ellipsis;
172
+ }
173
+ }
186
174
 
187
- .mapping-data-dnd-card {
175
+ .ant-select.source-field {
176
+ .ant-select-single:not(.ant-select-customize-input),
177
+ .ant-select-selector {
178
+ padding-left: 40px;
179
+ }
180
+ }
188
181
 
189
- // max-height: 60vh;
190
- // overflow-y: auto;
191
- }
182
+ .mapping-data-dnd-card {
183
+ // max-height: 60vh;
184
+ // overflow-y: auto;
185
+ }
192
186
 
193
- .ant-tree.mapping-tree {
187
+ .ant-tree.mapping-tree {
188
+ .ant-tree-treenode,
189
+ .ant-tree-node-content-wrapper {
190
+ width: 100%;
191
+ cursor: default;
192
+ }
194
193
 
195
- .ant-tree-treenode,
196
- .ant-tree-node-content-wrapper {
197
- width: 100%;
198
- cursor: default;
199
- }
194
+ .ant-tree-node-content-wrapper:hover,
195
+ .ant-tree-node-content-wrapper.ant-tree-node-selected {
196
+ background-color: unset;
197
+ }
198
+ }
200
199
 
201
- .ant-tree-node-content-wrapper:hover,
202
- .ant-tree-node-content-wrapper.ant-tree-node-selected {
203
- background-color: unset;
204
- }
205
- }
200
+ .mapping-dnd {
201
+ border-radius: @border-radius-base;
206
202
 
207
- .mapping-dnd {
208
- border-radius: @border-radius-base;
203
+ .mapping-item {
204
+ line-height: 30px;
205
+ height: 32px;
206
+ border: 1px dashed @border-color-base;
207
+ border-radius: @border-radius-base;
208
+ padding: 0 30px 0 11px;
209
209
 
210
- .mapping-item {
211
- line-height: 30px;
212
- height: 32px;
213
- border: 1px dashed @border-color-base;
214
- border-radius: @border-radius-base;
215
- padding: 0 30px 0 11px;
210
+ .mapping-item-text {
211
+ overflow: hidden;
212
+ text-overflow: ellipsis;
213
+ }
214
+ }
216
215
 
217
- .mapping-item-text {
218
- overflow: hidden;
219
- text-overflow: ellipsis;
216
+ .icon-remove {
217
+ cursor: pointer;
218
+ }
220
219
  }
221
- }
222
-
223
- .icon-remove {
224
- cursor: pointer;
225
- }
226
- }
227
220
 
228
- .ant-tabs-tab {
229
- border: 0px solid @list-layouts-border !important;
230
- border-bottom: unset !important;
231
- background-color: transparent !important;
221
+ .ant-tabs-tab {
222
+ border: 0px solid @list-layouts-border !important;
223
+ border-bottom: unset !important;
224
+ background-color: transparent !important;
232
225
 
233
- &.ant-tabs-tab-active {
234
- background-color: transparent;
235
- }
236
- }
226
+ &.ant-tabs-tab-active {
227
+ background-color: transparent;
228
+ }
229
+ }
237
230
 
238
- .ant-tabs-nav {
239
- border-bottom: 0px solid @list-layouts-border;
240
- }
231
+ .ant-tabs-nav {
232
+ border-bottom: 0px solid @list-layouts-border;
233
+ }
241
234
 
242
- .ant-card-bordered {
243
- border: 1px solid @border-color-split !important;
244
- border-radius: 6px;
235
+ .ant-card-bordered {
236
+ border: 1px solid @border-color-split !important;
237
+ border-radius: 6px;
238
+ }
245
239
  }
246
-
247
- }
248
240
  }
249
241
 
250
242
  .component-tree {
251
- .ant-tree {
252
- .ant-tree-node-content-wrapper.ant-tree-node-selected {
253
- background-color: unset;
254
- }
243
+ .ant-tree {
244
+ .ant-tree-node-content-wrapper.ant-tree-node-selected {
245
+ background-color: unset;
246
+ }
255
247
 
256
- .ant-tree-list-holder {
257
- overflow-x: hidden;
258
- }
248
+ .ant-tree-list-holder {
249
+ overflow-x: hidden;
250
+ }
259
251
 
260
- .ant-tree-node-content-wrapper {
261
- display: flex;
262
- cursor: default;
252
+ .ant-tree-node-content-wrapper {
253
+ display: flex;
254
+ cursor: default;
263
255
 
264
- .ant-tree-title {
265
- width: 100%;
256
+ .ant-tree-title {
257
+ width: 100%;
266
258
 
267
- .title-render {
268
- .move {
269
- width: 30px;
270
- cursor: move;
271
- text-align: center;
272
- }
273
- }
259
+ .title-render {
260
+ .move {
261
+ width: 30px;
262
+ cursor: move;
263
+ text-align: center;
264
+ }
265
+ }
274
266
 
275
- .title {
276
- cursor: pointer;
277
- }
267
+ .title {
268
+ cursor: pointer;
269
+ }
278
270
 
279
- .remove {
280
- cursor: pointer;
271
+ .remove {
272
+ cursor: pointer;
281
273
 
282
- &:hover {
283
- color: red;
284
- }
274
+ &:hover {
275
+ color: red;
276
+ }
277
+ }
278
+ }
285
279
  }
286
- }
287
280
  }
288
- }
289
281
  }
290
282
 
291
283
  .component-custom-field {
292
- .ant-tree.mapping-tree {
293
-
294
- .ant-tree-node-content-wrapper:hover,
295
- .ant-tree-node-content-wrapper.ant-tree-node-selected {
296
- background-color: unset;
284
+ .ant-tree.mapping-tree {
285
+ .ant-tree-node-content-wrapper:hover,
286
+ .ant-tree-node-content-wrapper.ant-tree-node-selected {
287
+ background-color: unset;
288
+ }
297
289
  }
298
- }
299
290
  }
300
291
 
301
292
  .detail-action-menu {
302
- min-width: 180px;
293
+ min-width: 180px;
303
294
  }
304
295
 
305
296
  .detail-tab-title,
306
297
  .detail-collapse-title {
307
- line-height: unset;
298
+ line-height: unset;
308
299
 
309
- .ant-badge-dot {
310
- display: none;
311
- }
312
-
313
- &.show-badge {
314
300
  .ant-badge-dot {
315
- display: initial;
301
+ display: none;
302
+ }
303
+
304
+ &.show-badge {
305
+ .ant-badge-dot {
306
+ display: initial;
307
+ }
316
308
  }
317
- }
318
309
  }
319
310
 
320
311
  .redio-compare {
321
- .ant-radio-button-wrapper-disabled.ant-radio-button-wrapper-checked {
322
- color: white;
323
- background-color: red;
324
- border-color: red;
325
- }
312
+ .ant-radio-button-wrapper-disabled.ant-radio-button-wrapper-checked {
313
+ color: white;
314
+ background-color: red;
315
+ border-color: red;
316
+ }
326
317
 
327
- .ant-radio-checked.ant-radio-disabled {
328
- .ant-radio-inner {
329
- border-color: red !important;
318
+ .ant-radio-checked.ant-radio-disabled {
319
+ .ant-radio-inner {
320
+ border-color: red !important;
330
321
 
331
- &::after {
332
- background-color: red;
333
- }
322
+ &::after {
323
+ background-color: red;
324
+ }
325
+ }
334
326
  }
335
- }
336
327
  }
337
328
 
338
329
  .select-with-advance-fx {
339
- .standard-select {
340
- .ant-select-selector {
341
- border-top-right-radius: 0px !important;
342
- border-bottom-right-radius: 0px !important;
330
+ .standard-select {
331
+ .ant-select-selector {
332
+ border-top-right-radius: 0px !important;
333
+ border-bottom-right-radius: 0px !important;
334
+ }
343
335
  }
344
- }
345
336
 
346
- .button-toggle {
347
- display: flex;
348
- justify-content: center;
349
- align-items: center;
337
+ .button-toggle {
338
+ display: flex;
339
+ justify-content: center;
340
+ align-items: center;
350
341
 
351
- &.on-toggle {
352
- background-color: @primary-color !important;
353
- color: white !important;
354
- }
342
+ &.on-toggle {
343
+ background-color: @primary-color !important;
344
+ color: white !important;
345
+ }
355
346
 
356
- span {
357
- font-size: 10px;
347
+ span {
348
+ font-size: 10px;
349
+ }
358
350
  }
359
- }
360
351
  }
361
352
 
362
353
  //----- Custom Botton ------//
363
354
  .ant-btn {
364
- &.ant-btn-secondary {
365
-
366
- &:focus,
367
- &:hover {
368
- color: white;
369
- background: @primary-color;
370
- border-color: @primary-color;
371
- }
355
+ &.ant-btn-secondary {
356
+ &:focus,
357
+ &:hover {
358
+ color: white;
359
+ background: @primary-color;
360
+ border-color: @primary-color;
361
+ }
372
362
 
373
- &:active {
374
- color: @text-color;
375
- background: white;
376
- border-color: @border-color-base;
363
+ &:active {
364
+ color: @text-color;
365
+ background: white;
366
+ border-color: @border-color-base;
367
+ }
377
368
  }
378
- }
379
369
 
380
- &.ant-btn-primary {
381
- background: white;
382
- border-color: @primary-color;
383
- color: @primary-color;
370
+ &.ant-btn-primary {
371
+ background: white;
372
+ border-color: @primary-color;
373
+ color: @primary-color;
384
374
 
385
- &:hover,
386
- &:focus,
387
- &:active {
388
- background: @primary-color;
389
- border-color: @primary-color;
390
- color: white;
375
+ &:hover,
376
+ &:focus,
377
+ &:active {
378
+ background: @primary-color;
379
+ border-color: @primary-color;
380
+ color: white;
381
+ }
391
382
  }
392
- }
393
383
 
394
- &.ant-btn-primary[disabled] {
395
- color: rgba(0, 0, 0, 0.25);
396
- background: #f5f5f5;
397
- border-color: #d9d9d9;
398
- box-shadow: none;
384
+ &.ant-btn-primary[disabled] {
385
+ color: rgba(0, 0, 0, 0.25);
386
+ background: #f5f5f5;
387
+ border-color: #d9d9d9;
388
+ box-shadow: none;
399
389
 
400
- &:hover,
401
- &:focus,
402
- &:active {
403
- color: rgba(0, 0, 0, 0.25);
404
- background: #f5f5f5;
405
- border-color: #d9d9d9;
406
- box-shadow: none;
390
+ &:hover,
391
+ &:focus,
392
+ &:active {
393
+ color: rgba(0, 0, 0, 0.25);
394
+ background: #f5f5f5;
395
+ border-color: #d9d9d9;
396
+ box-shadow: none;
397
+ }
407
398
  }
408
- }
409
399
 
410
- &.ant-btn-secondary[disabled] {
411
-
412
- &:hover,
413
- &:focus,
414
- &:active {
415
- color: rgba(0, 0, 0, 0.25);
416
- background: #f5f5f5;
417
- border-color: #d9d9d9;
418
- box-shadow: none;
400
+ &.ant-btn-secondary[disabled] {
401
+ &:hover,
402
+ &:focus,
403
+ &:active {
404
+ color: rgba(0, 0, 0, 0.25);
405
+ background: #f5f5f5;
406
+ border-color: #d9d9d9;
407
+ box-shadow: none;
408
+ }
419
409
  }
420
- }
421
410
 
422
- &.ant-btn-third {
423
- background: @primary-color;
424
- border-color: @primary-color;
425
- color: white;
411
+ &.ant-btn-third {
412
+ background: @primary-color;
413
+ border-color: @primary-color;
414
+ color: white;
426
415
 
427
- &:hover,
428
- &:focus {
429
- color: white;
430
- background: @primary-color;
431
- border-color: @primary-color;
432
- opacity: 0.8;
433
- }
416
+ &:hover,
417
+ &:focus {
418
+ color: white;
419
+ background: @primary-color;
420
+ border-color: @primary-color;
421
+ opacity: 0.8;
422
+ }
434
423
 
435
- &:active {
436
- background: @primary-color;
437
- border-color: @primary-color;
438
- border-color: @primary-color;
439
- color: white;
424
+ &:active {
425
+ background: @primary-color;
426
+ border-color: @primary-color;
427
+ border-color: @primary-color;
428
+ color: white;
429
+ }
440
430
  }
441
- }
442
431
 
443
- &.ant-btn-add {
444
- color: @secondary-color;
445
- border: 1px solid @secondary-color;
446
- background-color: transparent;
432
+ &.ant-btn-add {
433
+ color: @secondary-color;
434
+ border: 1px solid @secondary-color;
435
+ background-color: transparent;
447
436
 
448
- &:hover,
449
- &:focus,
450
- &:active {
451
- color: @secondary-color;
452
- border: 1px solid @secondary-color;
453
- background-color: transparent;
454
- }
437
+ &:hover,
438
+ &:focus,
439
+ &:active {
440
+ color: @secondary-color;
441
+ border: 1px solid @secondary-color;
442
+ background-color: transparent;
443
+ }
455
444
 
456
- &.full-width {
457
- width: 100%;
445
+ &.full-width {
446
+ width: 100%;
447
+ }
458
448
  }
459
- }
460
449
  }
461
450
 
462
451
  //----- common-blink-effect ------//
463
452
  @keyframes blink {
464
- 0% {
465
- box-shadow: none;
466
- }
453
+ 0% {
454
+ box-shadow: none;
455
+ }
467
456
 
468
- 50% {
469
- box-shadow: 0px 0px 6px @primary-color;
470
- }
457
+ 50% {
458
+ box-shadow: 0px 0px 6px @primary-color;
459
+ }
471
460
 
472
- 100% {
473
- box-shadow: none;
474
- }
461
+ 100% {
462
+ box-shadow: none;
463
+ }
475
464
  }
476
465
 
477
466
  //----- Custom Text ------//
478
467
  .primary-text {
479
- color: @primary-color;
468
+ color: @primary-color;
480
469
  }
481
470
 
482
471
  .error-text {
483
- color: @error-color;
472
+ color: @error-color;
484
473
  }
485
474
 
486
475
  .success-text {
487
- color: @success-color;
476
+ color: @success-color;
488
477
  }
489
478
 
490
479
  .ant-typography {
491
- &.action-color {
492
- color: @action-color;
493
- }
480
+ &.action-color {
481
+ color: @action-color;
482
+ }
494
483
  }
495
484
 
496
485
  //----- Custom Table ------//
497
486
  .table-card {
498
- .ant-table-column-sorters {
499
- padding: 0px;
500
- }
501
-
502
- .table-action {
503
-
504
- .table-action-button {
505
- color: @action-color;
487
+ .ant-table-column-sorters {
488
+ padding: 0px;
506
489
  }
507
490
 
508
- .ant-btn {
509
- margin-top: -6px;
510
- margin-left: 0px;
491
+ .table-action {
492
+ .table-action-button {
493
+ color: @action-color;
494
+ }
511
495
 
512
- &.ant-btn-text {
496
+ .ant-btn {
497
+ margin-top: -6px;
498
+ margin-left: 0px;
513
499
 
514
- &:hover,
515
- &:focus {
516
- background-color: none;
517
- background: none;
518
- }
519
- }
500
+ &.ant-btn-text {
501
+ &:hover,
502
+ &:focus {
503
+ background-color: none;
504
+ background: none;
505
+ }
506
+ }
520
507
 
521
- &.ant-btn-icon-only {
522
- width: 20px;
523
- height: 20px;
524
- }
508
+ &.ant-btn-icon-only {
509
+ width: 20px;
510
+ height: 20px;
511
+ }
525
512
 
526
- svg {
527
- width: 18px;
528
- height: 18px;
529
- }
513
+ svg {
514
+ width: 18px;
515
+ height: 18px;
516
+ }
517
+ }
530
518
  }
531
- }
532
-
533
- .header-table {
534
- .ant-table-container table>thead>tr:first-child {
535
519
 
536
- th:first-child,
537
- th:last-child {
538
- border-top-left-radius: 0px
539
- }
520
+ .header-table {
521
+ .ant-table-container table > thead > tr:first-child {
522
+ th:first-child,
523
+ th:last-child {
524
+ border-top-left-radius: 0px;
525
+ }
526
+ }
540
527
  }
541
- }
542
528
  }
543
529
 
544
530
  .table-row-selected {
545
- .delete-selected {
546
- color: @action-color;
547
- cursor: pointer;
548
- }
531
+ .delete-selected {
532
+ color: @action-color;
533
+ cursor: pointer;
534
+ }
549
535
  }
550
536
 
551
- .ant-table>.ant-table-tbody>tr.ant-table-row:hover>td {
552
- background: @hover-color;
537
+ .ant-table > .ant-table-tbody > tr.ant-table-row:hover > td {
538
+ background: @hover-color;
553
539
  }
554
540
 
555
541
  //----- Custom Message ------//
556
542
  .ant-message {
557
-
558
- &.collapsed {
559
- .ant-message-notice-content {
560
- min-width: calc(100% - 106px);
561
- margin-left: 70px;
543
+ &.collapsed {
544
+ .ant-message-notice-content {
545
+ min-width: calc(100% - 106px);
546
+ margin-left: 70px;
547
+ }
562
548
  }
563
- }
564
549
 
565
- .ant-message-notice-content {
566
- padding: 0px;
567
- min-width: calc(100% - 286px);
568
- margin-left: 250px;
550
+ .ant-message-notice-content {
551
+ padding: 0px;
552
+ min-width: calc(100% - 286px);
553
+ margin-left: 250px;
569
554
 
570
- span.anticon {
571
- display: none;
572
- }
555
+ span.anticon {
556
+ display: none;
557
+ }
573
558
 
574
- .ant-message-custom-content {
575
- border-radius: @border-radius-base;
559
+ .ant-message-custom-content {
560
+ border-radius: @border-radius-base;
576
561
 
577
- &.ant-message-success {
578
- border: 1px solid @success-color;
579
- background-color: @success-color;
562
+ &.ant-message-success {
563
+ border: 1px solid @success-color;
564
+ background-color: @success-color;
580
565
 
581
- .success-icon {
582
- padding: 6px 0px;
583
- text-align: center;
566
+ .success-icon {
567
+ padding: 6px 0px;
568
+ text-align: center;
584
569
 
585
- span.anticon {
586
- display: inline;
587
- margin-right: 0px;
588
- color: @white-color;
589
- }
590
- }
570
+ span.anticon {
571
+ display: inline;
572
+ margin-right: 0px;
573
+ color: @white-color;
574
+ }
575
+ }
591
576
 
592
- .success-content {
593
- padding: 6px 12px;
594
- background-color: @alert-success-bg-color;
595
- border-top-right-radius: @border-radius-base;
596
- border-bottom-right-radius: @border-radius-base;
577
+ .success-content {
578
+ padding: 6px 12px;
579
+ background-color: @alert-success-bg-color;
580
+ border-top-right-radius: @border-radius-base;
581
+ border-bottom-right-radius: @border-radius-base;
597
582
 
598
- .ant-col {
599
- text-align: start;
600
- }
601
- }
602
- }
583
+ .ant-col {
584
+ text-align: start;
585
+ }
586
+ }
587
+ }
603
588
 
604
- &.ant-message-warning {
605
- border: 1px solid @warning-color;
606
- background-color: @warning-color;
589
+ &.ant-message-warning {
590
+ border: 1px solid @warning-color;
591
+ background-color: @warning-color;
607
592
 
608
- .warning-icon {
609
- padding: 6px 0px;
610
- text-align: center;
593
+ .warning-icon {
594
+ padding: 6px 0px;
595
+ text-align: center;
611
596
 
612
- span.anticon {
613
- display: inline;
614
- margin-right: 0px;
615
- color: @white-color;
616
- }
617
- }
597
+ span.anticon {
598
+ display: inline;
599
+ margin-right: 0px;
600
+ color: @white-color;
601
+ }
602
+ }
618
603
 
619
- .warning-content {
620
- padding: 6px 12px;
621
- background-color: @alert-warning-bg-color;
622
- border-top-right-radius: @border-radius-base;
623
- border-bottom-right-radius: @border-radius-base;
604
+ .warning-content {
605
+ padding: 6px 12px;
606
+ background-color: @alert-warning-bg-color;
607
+ border-top-right-radius: @border-radius-base;
608
+ border-bottom-right-radius: @border-radius-base;
624
609
 
625
- .ant-col {
626
- text-align: start;
627
- }
628
- }
629
- }
610
+ .ant-col {
611
+ text-align: start;
612
+ }
613
+ }
614
+ }
630
615
 
631
- &.ant-message-error {
632
- border: 1px solid @error-color;
633
- background-color: @error-color;
616
+ &.ant-message-error {
617
+ border: 1px solid @error-color;
618
+ background-color: @error-color;
634
619
 
635
- .error-icon {
636
- padding: 6px 0px;
637
- text-align: center;
620
+ .error-icon {
621
+ padding: 6px 0px;
622
+ text-align: center;
638
623
 
639
- span.anticon {
640
- display: inline;
641
- margin-right: 0px;
642
- color: @white-color;
643
- }
644
- }
624
+ span.anticon {
625
+ display: inline;
626
+ margin-right: 0px;
627
+ color: @white-color;
628
+ }
629
+ }
645
630
 
646
- .error-content {
647
- padding: 6px 12px;
648
- background-color: @alert-error-bg-color;
649
- border-top-right-radius: @border-radius-base;
650
- border-bottom-right-radius: @border-radius-base;
631
+ .error-content {
632
+ padding: 6px 12px;
633
+ background-color: @alert-error-bg-color;
634
+ border-top-right-radius: @border-radius-base;
635
+ border-bottom-right-radius: @border-radius-base;
651
636
 
652
- .ant-col {
653
- text-align: start;
654
- }
637
+ .ant-col {
638
+ text-align: start;
639
+ }
640
+ }
641
+ }
655
642
  }
656
- }
657
- }
658
643
 
659
- .close-message {
660
- position: absolute;
661
- right: 6px;
662
- top: 4px;
663
- z-index: 100;
644
+ .close-message {
645
+ position: absolute;
646
+ right: 6px;
647
+ top: 4px;
648
+ z-index: 100;
664
649
 
665
- .close-message-icon {
666
- width: 20px;
667
- height: 20px;
668
- cursor: pointer;
669
- color: #00000073;
670
- }
650
+ .close-message-icon {
651
+ width: 20px;
652
+ height: 20px;
653
+ cursor: pointer;
654
+ color: #00000073;
655
+ }
656
+ }
671
657
  }
672
- }
673
658
  }
674
659
 
675
660
  //----- Custom tabs ------//
676
661
  .ant-tabs-tab.ant-tabs-tab-active {
677
- .ant-tabs-tab-btn {
678
- .ant-badge {
679
- color: @primary-color;
662
+ .ant-tabs-tab-btn {
663
+ .ant-badge {
664
+ color: @primary-color;
665
+ }
680
666
  }
681
- }
682
667
  }
683
668
 
684
669
  //----- Custom Ant InputNumber------//
685
670
  .input-number-container {
671
+ &.ant-input-affix-wrapper {
672
+ padding: 0 0 0 11px;
673
+
674
+ .ant-input-number,
675
+ .ant-input-number:focus,
676
+ .ant-input-number-focused {
677
+ border: none;
678
+ box-shadow: none;
679
+ }
686
680
 
687
- &.ant-input-affix-wrapper {
688
- padding: 0 0 0 11px;
689
-
690
- .ant-input-number,
691
- .ant-input-number:focus,
692
- .ant-input-number-focused {
693
- border: none;
694
- box-shadow: none;
695
- }
681
+ &.ant-input-number-without-prefix {
682
+ background: #f5f5f5;
683
+ }
696
684
 
697
- &.ant-input-number-without-prefix {
698
- background: #f5f5f5;
699
- }
685
+ .ant-input-number-input {
686
+ padding: 0px;
687
+ }
700
688
 
701
- .ant-input-number-input {
702
- padding: 0px;
703
- }
689
+ &.suffix {
690
+ .ant-input-number {
691
+ .ant-input-number-handler-up {
692
+ border-top-right-radius: 0px;
693
+ border-right: 1px solid #d9d9d9;
694
+ }
704
695
 
705
- &.suffix {
706
- .ant-input-number {
707
- .ant-input-number-handler-up {
708
- border-top-right-radius: 0px;
709
- border-right: 1px solid #d9d9d9;
710
- }
696
+ .ant-input-number-handler-down {
697
+ border-right: 1px solid #d9d9d9;
698
+ border-bottom-right-radius: 0px;
699
+ }
700
+ }
711
701
 
712
- .ant-input-number-handler-down {
713
- border-right: 1px solid #d9d9d9;
714
- border-bottom-right-radius: 0px;
702
+ .ant-input-suffix {
703
+ padding-right: 11px;
704
+ }
715
705
  }
716
- }
717
-
718
- .ant-input-suffix {
719
- padding-right: 11px;
720
- }
721
706
  }
722
- }
723
707
 
724
- &.ant-input-affix-wrapper:focus-within {
725
- box-shadow: 0 0 0 2px fade(@primary-color, 20%);
726
- border-color: @primary-color;
727
- }
708
+ &.ant-input-affix-wrapper:focus-within {
709
+ box-shadow: 0 0 0 2px fade(@primary-color, 20%);
710
+ border-color: @primary-color;
711
+ }
728
712
  }
729
713
 
730
714
  //------ custom upload container of image -------
731
715
  .mutiple-upload-files-container,
732
716
  .mutiple-upload-images-container {
733
- .multiple-image-container {
734
- background: #fafafa;
735
- padding: 8px;
736
- border: 1px dashed #d9d9d9;
737
- border-radius: 5px;
738
-
739
- .ant-divider-horizontal {
740
- margin: 0px;
741
- margin-top: 8px;
742
- }
743
-
744
- .empty-image {
745
- line-height: 81px;
746
- margin-bottom: -18px;
747
- }
748
-
749
- .scrollable {
750
- width: 100%;
751
- display: flex;
752
- overflow-x: auto;
753
- overflow-y: hidden;
754
- padding: 5px 0px;
755
-
756
- .list-image {
757
- position: relative;
758
- border: 1px solid #d9d9d9;
759
- border-radius: 5px;
717
+ .multiple-image-container {
718
+ background: #fafafa;
760
719
  padding: 8px;
761
- margin: 4px;
762
- }
763
- }
720
+ border: 1px dashed #d9d9d9;
721
+ border-radius: 5px;
764
722
 
765
- .list-image {
766
- display: flex;
723
+ .ant-divider-horizontal {
724
+ margin: 0px;
725
+ margin-top: 8px;
726
+ }
767
727
 
768
- .image {
769
- .no-preview {
770
- .ant-avatar-string {
771
- line-height: 32px !important;
772
- }
728
+ .empty-image {
729
+ line-height: 81px;
730
+ margin-bottom: -18px;
773
731
  }
774
732
 
775
- position: relative;
776
- width : 100%;
777
-
778
- .multiple-upload-actions {
779
- margin: 0 !important;
780
- display: none;
781
- flex-direction: row;
782
- justify-content: center;
783
- position: absolute;
784
- top: 50%;
785
- left: 50%;
786
- z-index: 6;
787
- -webkit-transform: translate(-50%, -50%);
788
- transition: all .3s;
789
-
790
- svg {
791
- cursor: pointer;
792
- color: white;
793
- }
733
+ .scrollable {
734
+ width: 100%;
735
+ display: flex;
736
+ overflow-x: auto;
737
+ overflow-y: hidden;
738
+ padding: 5px 0px;
739
+
740
+ .list-image {
741
+ position: relative;
742
+ border: 1px solid #d9d9d9;
743
+ border-radius: 5px;
744
+ padding: 8px;
745
+ margin: 4px;
746
+ }
794
747
  }
795
748
 
796
- &:hover {
797
- .multiple-upload-actions {
749
+ .list-image {
798
750
  display: flex;
799
- }
800
751
 
801
- .ant-avatar::before {
802
- position: absolute;
803
- z-index: 1;
804
- width: 100%;
805
- height: 100%;
806
- left: 0;
807
- background-color: rgba(0, 0, 0, 0.5);
808
- opacity: 0.9;
809
- transition: all 0.3s;
810
- content: ' ';
752
+ .image {
753
+ .no-preview {
754
+ .ant-avatar-string {
755
+ line-height: 32px !important;
756
+ }
757
+ }
811
758
 
812
- }
759
+ position: relative;
760
+ width: 100%;
813
761
 
814
- &::before {
815
- position: absolute;
816
- width: 100%;
817
- height: 100%;
818
- left: 0;
819
- // background-color: rgba(164, 160, 160, 0.5);
820
- opacity: 0.9;
821
- transition: all 0.3s;
822
- content: ' ';
823
- z-index: 5;
824
- }
825
-
826
- img {
827
- opacity: 0.8;
828
- }
829
- }
830
- }
762
+ .multiple-upload-actions {
763
+ margin: 0 !important;
764
+ display: none;
765
+ flex-direction: row;
766
+ justify-content: center;
767
+ position: absolute;
768
+ top: 50%;
769
+ left: 50%;
770
+ z-index: 6;
771
+ -webkit-transform: translate(-50%, -50%);
772
+ transition: all 0.3s;
773
+
774
+ svg {
775
+ cursor: pointer;
776
+ color: white;
777
+ }
778
+ }
831
779
 
832
- .move-image {
833
- margin-left: -8px;
834
- cursor: move;
835
- align-self: center;
836
- }
837
- }
838
-
839
- .main-image {
840
- .list-image {
841
- .image {
842
- .ant-avatar {
843
- width: 150px !important;
844
- height: 150px !important;
845
- line-height: 150px !important;
846
-
847
- .ant-avatar-string {
848
- line-height: 150px !important;
849
- font-size: 40px;
780
+ &:hover {
781
+ .multiple-upload-actions {
782
+ display: flex;
783
+ }
784
+
785
+ .ant-avatar::before {
786
+ position: absolute;
787
+ z-index: 1;
788
+ width: 100%;
789
+ height: 100%;
790
+ left: 0;
791
+ background-color: rgba(0, 0, 0, 0.5);
792
+ opacity: 0.9;
793
+ transition: all 0.3s;
794
+ content: " ";
795
+ }
796
+
797
+ &::before {
798
+ position: absolute;
799
+ width: 100%;
800
+ height: 100%;
801
+ left: 0;
802
+ // background-color: rgba(164, 160, 160, 0.5);
803
+ opacity: 0.9;
804
+ transition: all 0.3s;
805
+ content: " ";
806
+ z-index: 5;
807
+ }
808
+
809
+ img {
810
+ opacity: 0.8;
811
+ }
812
+ }
850
813
  }
851
- }
852
814
 
853
- .no-preview {
854
- .ant-avatar-string {
855
- line-height: 46px !important;
856
- padding-top: 38px;
815
+ .move-image {
816
+ margin-left: -8px;
817
+ cursor: move;
818
+ align-self: center;
857
819
  }
858
- }
859
820
  }
860
- }
861
821
 
862
- .image {
863
- border: 1px solid #d9d9d9;
864
- border-radius: 5px;
865
- padding: 8px;
866
- }
822
+ .main-image {
823
+ .list-image {
824
+ .image {
825
+ .ant-avatar {
826
+ width: 150px !important;
827
+ height: 150px !important;
828
+ line-height: 150px !important;
829
+
830
+ .ant-avatar-string {
831
+ line-height: 150px !important;
832
+ font-size: 40px;
833
+ }
834
+ }
835
+
836
+ .no-preview {
837
+ .ant-avatar-string {
838
+ line-height: 46px !important;
839
+ padding-top: 38px;
840
+ }
841
+ }
842
+ }
843
+ }
867
844
 
868
- }
845
+ .image {
846
+ border: 1px solid #d9d9d9;
847
+ border-radius: 5px;
848
+ padding: 8px;
849
+ }
850
+ }
869
851
 
870
- &.external_url {
871
- .ant-upload-picture-card-wrapper {
872
- .ant-upload.ant-upload-select-picture-card:hover {
873
- border-color: @hover-color;
852
+ &.external_url {
853
+ .ant-upload-picture-card-wrapper {
854
+ .ant-upload.ant-upload-select-picture-card:hover {
855
+ border-color: @hover-color;
856
+ }
857
+ }
874
858
  }
875
- }
876
859
  }
877
- }
878
860
 
879
- .ant-upload-picture-card-wrapper {
880
- margin: 4px;
861
+ .ant-upload-picture-card-wrapper {
862
+ margin: 4px;
881
863
 
882
- .ant-upload.ant-upload-select-picture-card {
883
- margin-right: 0px;
884
- margin-bottom: 0px;
885
- width: 81px;
886
- height: 81px;
864
+ .ant-upload.ant-upload-select-picture-card {
865
+ margin-right: 0px;
866
+ margin-bottom: 0px;
867
+ width: 81px;
868
+ height: 81px;
869
+ }
887
870
  }
888
- }
889
871
  }
890
872
 
891
873
  .ant-dropdown-trigger {
892
- &.languages {
893
- img {
894
- margin-right: 5px;
895
- }
874
+ &.languages {
875
+ img {
876
+ margin-right: 5px;
877
+ }
896
878
 
897
- .anticon-down {
898
- font-size: 14px;
899
- color: @text-color;
900
- margin-left: 5px;
879
+ .anticon-down {
880
+ font-size: 14px;
881
+ color: @text-color;
882
+ margin-left: 5px;
901
883
 
902
- svg {
903
- margin-bottom: -2px;
904
- }
884
+ svg {
885
+ margin-bottom: -2px;
886
+ }
887
+ }
905
888
  }
906
- }
907
889
  }
908
890
 
909
891
  .autocomplete-menu {
910
- .ant-dropdown-menu-item-group-title {
911
- background-color: @background-color;
912
- }
892
+ .ant-dropdown-menu-item-group-title {
893
+ background-color: @background-color;
894
+ }
913
895
  }
914
896
 
915
897
  .text-color {
916
- color: @text-color !important;
898
+ color: @text-color !important;
917
899
  }
918
900
 
919
901
  .field-container-accordion {
920
- margin-top: 10px;
921
- border: 1px solid rgb(228, 224, 224);
922
- border-radius: 10px;
923
- padding: 5px;
902
+ margin-top: 10px;
903
+ border: 1px solid rgb(228, 224, 224);
904
+ border-radius: 10px;
905
+ padding: 5px;
924
906
 
925
- .title-is-expanded {
926
- padding: 10px;
927
- cursor: pointer;
928
- }
907
+ .title-is-expanded {
908
+ padding: 10px;
909
+ cursor: pointer;
910
+ }
929
911
 
930
- .title-accordion {
931
- padding: 10px;
932
- cursor: pointer;
933
- }
912
+ .title-accordion {
913
+ padding: 10px;
914
+ cursor: pointer;
915
+ }
934
916
 
935
- .content-accordion {
936
- overflow: hidden;
937
- max-height: 0;
938
- }
917
+ .content-accordion {
918
+ overflow: hidden;
919
+ max-height: 0;
920
+ }
939
921
 
940
- .content-is-expanded {
941
- height: 100%;
942
- }
922
+ .content-is-expanded {
923
+ height: 100%;
924
+ }
943
925
  }
944
926
 
945
927
  .select-internal {
946
- width: 100%;
928
+ width: 100%;
947
929
 
948
- .ant-select-selector {
949
- border-radius: 0px !important;
950
- margin-left: -7px;
951
- }
930
+ .ant-select-selector {
931
+ border-radius: 0px !important;
932
+ margin-left: -7px;
933
+ }
952
934
  }
953
935
 
954
936
  .addon-after {
955
- display: flex;
937
+ display: flex;
956
938
  }
957
939
 
958
940
  .select-queue {
959
- width: 100%;
941
+ width: 100%;
960
942
  }
961
943
 
962
944
  .box-select-resf {
963
- padding-right: 6px;
945
+ padding-right: 6px;
964
946
  }
965
947
 
966
948
  .input-external {
967
- width: 100%;
968
- border-radius: 0px !important;
969
- margin-left: -7px;
970
-
949
+ width: 100%;
950
+ border-radius: 0px !important;
951
+ margin-left: -7px;
971
952
  }
972
953
 
973
954
  .restful-addon-before-new {
974
- width: 180px !important;
955
+ width: 180px !important;
975
956
 
976
- .ant-select-selector {
977
- text-align: center;
978
- }
957
+ .ant-select-selector {
958
+ text-align: center;
959
+ }
979
960
  }
980
961
 
981
962
  .custom-toast-main {
982
- align-items: center;
963
+ align-items: center;
983
964
 
984
- .custom-toast-icon {
985
- width: 1.2em;
986
- height: 1.2em;
987
- color: #FFF;
988
- margin-right: 10px;
989
- margin: 10px;
990
- }
965
+ .custom-toast-icon {
966
+ width: 1.2em;
967
+ height: 1.2em;
968
+ color: #fff;
969
+ margin-right: 10px;
970
+ margin: 10px;
971
+ }
991
972
 
992
- .custom-toast-content {
993
- padding: 10px;
994
- background-color: #FFF;
995
- border-bottom-right-radius: 2px;
996
- border-top-right-radius: 2px;
997
- }
973
+ .custom-toast-content {
974
+ padding: 10px;
975
+ background-color: #fff;
976
+ border-bottom-right-radius: 2px;
977
+ border-top-right-radius: 2px;
978
+ }
998
979
  }
999
980
 
1000
981
  .Toastify__toast-body {
1001
- padding: unset !important;
982
+ padding: unset !important;
1002
983
  }
1003
984
 
1004
-
1005
985
  .toast-close-message {
1006
- background-color: #FFF;
1007
- padding-right: 10px;
1008
- padding-top: 5px;
1009
- z-index: 100;
1010
-
1011
- .toast-close-message-icon {
1012
- width: 10px;
1013
- height: 10px;
1014
- cursor: pointer;
1015
- color: #cecbcb73;
1016
- }
1017
- }
986
+ background-color: #fff;
987
+ padding-right: 10px;
988
+ padding-top: 5px;
989
+ z-index: 100;
1018
990
 
991
+ .toast-close-message-icon {
992
+ width: 10px;
993
+ height: 10px;
994
+ cursor: pointer;
995
+ color: #cecbcb73;
996
+ }
997
+ }
1019
998
 
1020
999
  .custom-toast-full {
1021
- min-width: calc(100% - 286px);
1022
- margin-left: 250px;
1000
+ min-width: calc(100% - 286px);
1001
+ margin-left: 250px;
1023
1002
  }
1024
1003
 
1025
-
1026
1004
  .ant-form-item-has-error {
1027
- .params-custom-actions-required {
1028
- border-color: #ff4d4f !important;
1029
- background: white !important;
1030
- border-right: 1 !important;
1031
- color: #ff4d4f !important;
1032
- }
1005
+ .params-custom-actions-required {
1006
+ border-color: #ff4d4f !important;
1007
+ background: white !important;
1008
+ border-right: 1 !important;
1009
+ color: #ff4d4f !important;
1010
+ }
1033
1011
  }
1034
1012
 
1035
1013
  .button-params-no-border-right {
1036
- border-right: none;
1014
+ border-right: none;
1037
1015
  }
1038
1016
 
1039
1017
  .component-layout-detail-dnd {
1018
+ .tab-layout-detail {
1019
+ overflow: scroll;
1020
+ min-width: 100%;
1021
+ min-height: 500px;
1022
+ max-height: 600px;
1023
+
1024
+ .layout-main {
1025
+ overflow: scroll;
1026
+
1027
+ table,
1028
+ th,
1029
+ td {
1030
+ border: 1px solid #eceaea;
1031
+ border-collapse: collapse;
1032
+ }
1040
1033
 
1041
- .tab-layout-detail {
1042
- overflow: scroll;
1043
- min-width: 100%;
1044
- min-height: 500px;
1045
- max-height: 600px;
1046
-
1047
- .layout-main {
1048
- overflow: scroll;
1049
-
1050
- table,
1051
- th,
1052
- td {
1053
- border: 1px solid #eceaea;
1054
- border-collapse: collapse;
1055
- }
1056
-
1057
- .full-width {
1058
- width: 100%;
1059
- }
1060
-
1061
- .layout-main-position {
1062
- width: 100%;
1063
- }
1064
-
1065
- .position-top {
1066
- min-height: 50px;
1067
- display: table;
1068
- height: 100%;
1069
- width: 100%;
1070
- }
1071
-
1072
-
1073
- .position-bottom {
1074
- min-height: 50px;
1075
- display: table;
1076
- height: 100%;
1077
- width: 100%;
1078
- }
1079
-
1080
- .disabled {
1081
- background-color: @background-color;
1082
- }
1083
-
1084
- .layout-position-row-middle {
1085
- width: 100%;
1086
- }
1087
-
1088
- .layout-row-two {
1089
- display: flex;
1090
- }
1091
-
1092
- .border-top {
1093
- border-top: 1px solid #eceaea;
1094
- }
1095
-
1096
- .border-left {
1097
- border-left: 1px solid #eceaea;
1098
- }
1099
-
1100
- .border-bottom {
1101
- border-bottom: 1px solid #eceaea;
1102
- }
1103
-
1104
- .border-right {
1105
- border-right: 1px solid #eceaea;
1106
- }
1107
-
1108
- .layout-position-box-left {
1109
- min-width: 255px;
1110
- vertical-align: top;
1111
- position: relative;
1112
- }
1113
-
1114
- .position-left {
1115
- min-height: 250px;
1116
- display: table;
1117
- height: 100%;
1118
- width: 100%;
1119
- }
1120
-
1121
- .position-middle {
1122
- min-width: 300px;
1123
- vertical-align: top;
1124
- display: grid;
1125
- }
1126
-
1127
- .position-middle-box-center {
1128
- min-height: 60%;
1129
- display: grid;
1130
- }
1034
+ .full-width {
1035
+ width: 100%;
1036
+ }
1131
1037
 
1132
- .position-middle-center {
1133
- min-height: 150px;
1134
- display: table;
1135
- width: 100%;
1136
- height: 100%;
1137
- }
1038
+ .layout-main-position {
1039
+ width: 100%;
1040
+ }
1138
1041
 
1139
- .position-middle-box-top {
1140
- min-height: 20%;
1141
- display: grid;
1142
- }
1042
+ .position-top {
1043
+ min-height: 50px;
1044
+ display: table;
1045
+ height: 100%;
1046
+ width: 100%;
1047
+ }
1143
1048
 
1144
- .position-middle-top {
1145
- min-height: 50px;
1146
- display: table;
1147
- width: 100%;
1148
- height: 100%;
1149
- }
1049
+ .position-bottom {
1050
+ min-height: 50px;
1051
+ display: table;
1052
+ height: 100%;
1053
+ width: 100%;
1054
+ }
1150
1055
 
1151
- .position-middle-box-bottom {
1152
- min-height: 20%;
1153
- display: grid;
1154
- }
1056
+ .disabled {
1057
+ background-color: @background-color;
1058
+ }
1155
1059
 
1156
- .position-middle-bottom {
1157
- min-height: 50px;
1158
- display: table;
1159
- width: 100%;
1160
- height: 100%;
1161
- }
1060
+ .layout-position-row-middle {
1061
+ width: 100%;
1062
+ }
1162
1063
 
1163
- .position-box-right {
1164
- min-width: 255px;
1165
- vertical-align: top;
1166
- position: relative;
1167
- }
1064
+ .layout-row-two {
1065
+ display: flex;
1066
+ }
1168
1067
 
1169
- .position-right {
1170
- min-height: 250px;
1171
- display: table;
1172
- height: 100%;
1173
- width: 100%;
1174
- }
1068
+ .border-top {
1069
+ border-top: 1px solid #eceaea;
1070
+ }
1175
1071
 
1176
- .layout-block {
1177
- height: 100%;
1178
- min-height: 50px;
1179
- display: table-cell;
1072
+ .border-left {
1073
+ border-left: 1px solid #eceaea;
1074
+ }
1180
1075
 
1181
- .dnd-move {
1182
- cursor: move;
1183
- border-right: 1px dashed #d9d9d9;
1184
- width: 25px;
1185
- display: flex;
1186
- justify-content: center;
1187
- align-items: center;
1188
- }
1076
+ .border-bottom {
1077
+ border-bottom: 1px solid #eceaea;
1078
+ }
1189
1079
 
1190
- .layout-block-item {
1191
- position: relative;
1192
- margin: 8px;
1193
- display: flex;
1194
- flex-direction: column;
1080
+ .border-right {
1081
+ border-right: 1px solid #eceaea;
1082
+ }
1195
1083
 
1196
- .block-item {
1197
- display: flex;
1198
- border: 1px dashed #f2f2f2;
1084
+ .layout-position-box-left {
1085
+ min-width: 255px;
1086
+ vertical-align: top;
1087
+ position: relative;
1088
+ }
1199
1089
 
1200
- .item {
1201
- width: 100%;
1202
- padding: 5px 8px;
1203
- display: grid;
1090
+ .position-left {
1091
+ min-height: 250px;
1092
+ display: table;
1093
+ height: 100%;
1094
+ width: 100%;
1204
1095
  }
1205
1096
 
1206
- .item-rows {
1207
- width: 100%;
1208
- padding: 5px 8px;
1097
+ .position-middle {
1098
+ min-width: 300px;
1099
+ vertical-align: top;
1100
+ display: grid;
1209
1101
  }
1210
1102
 
1211
- .icon-edit {
1212
- cursor: pointer;
1213
- padding-right: 5px;
1214
- padding-top: 5px;
1215
- color: @border-color-base;
1103
+ .position-middle-box-center {
1104
+ min-height: 60%;
1105
+ display: grid;
1106
+ }
1216
1107
 
1217
- &:hover {
1218
- color: @text-color;
1219
- }
1108
+ .position-middle-center {
1109
+ min-height: 150px;
1110
+ display: table;
1111
+ width: 100%;
1112
+ height: 100%;
1220
1113
  }
1221
1114
 
1222
- .icon-remove {
1223
- cursor: pointer;
1224
- padding-right: 5px;
1225
- padding-top: 5px;
1226
- color: @border-color-base;
1115
+ .position-middle-box-top {
1116
+ min-height: 20%;
1117
+ display: grid;
1118
+ }
1227
1119
 
1228
- &:hover {
1229
- color: @text-color;
1230
- }
1120
+ .position-middle-top {
1121
+ min-height: 50px;
1122
+ display: table;
1123
+ width: 100%;
1124
+ height: 100%;
1231
1125
  }
1232
- }
1233
1126
 
1234
- .block-columns {
1235
- display: flex;
1236
- border: 1px dashed #f2f2f2;
1127
+ .position-middle-box-bottom {
1128
+ min-height: 20%;
1129
+ display: grid;
1130
+ }
1237
1131
 
1238
- .item-columns {
1239
- width: 100%;
1132
+ .position-middle-bottom {
1133
+ min-height: 50px;
1134
+ display: table;
1135
+ width: 100%;
1136
+ height: 100%;
1240
1137
  }
1241
1138
 
1242
- .icon-edit {
1243
- cursor: pointer;
1244
- padding-right: 5px;
1245
- padding-top: 5px;
1246
- color: @border-color-base;
1139
+ .position-box-right {
1140
+ min-width: 255px;
1141
+ vertical-align: top;
1142
+ position: relative;
1143
+ }
1247
1144
 
1248
- &:hover {
1249
- color: @text-color;
1250
- }
1145
+ .position-right {
1146
+ min-height: 250px;
1147
+ display: table;
1148
+ height: 100%;
1149
+ width: 100%;
1251
1150
  }
1252
1151
 
1253
- .icon-remove {
1254
- cursor: pointer;
1255
- padding-right: 5px;
1256
- padding-top: 5px;
1257
- color: @border-color-base;
1152
+ .layout-block {
1153
+ height: 100%;
1154
+ min-height: 50px;
1155
+ display: table-cell;
1156
+
1157
+ .dnd-move {
1158
+ cursor: move;
1159
+ border-right: 1px dashed #d9d9d9;
1160
+ width: 25px;
1161
+ display: flex;
1162
+ justify-content: center;
1163
+ align-items: center;
1164
+ }
1258
1165
 
1259
- &:hover {
1260
- color: @text-color;
1261
- }
1262
- }
1263
- }
1264
- }
1265
-
1266
- // .layout-block-item-columns {
1267
- // position: relative;
1268
- // height: 100%;
1269
- // display: flex;
1270
- // flex-direction: column;
1271
- // padding: 5px 8px;
1272
-
1273
- // .block-item {
1274
- // flex: 1;
1275
- // border: 1px dashed #f2f2f2;
1276
-
1277
- // .item {
1278
- // width: 100%;
1279
- // padding: 5px 8px;
1280
-
1281
- // > div {
1282
- // height: 100%;
1283
- // }
1284
-
1285
- // .wigeta-columns-layout-main {
1286
- // height: 100%;
1287
- // > div {
1288
- // width: 100%;
1289
- // }
1290
- // }
1291
- // }
1292
-
1293
- // .icon-edit {
1294
- // cursor: pointer;
1295
- // padding-right: 5px;
1296
- // padding-top: 5px;
1297
- // color: @border-color-base;
1298
-
1299
- // &:hover {
1300
- // color: @text-color;
1301
- // }
1302
- // }
1303
-
1304
- // .icon-remove {
1305
- // cursor: pointer;
1306
- // padding-right: 5px;
1307
- // padding-top: 5px;
1308
- // color: @border-color-base;
1309
-
1310
- // &:hover {
1311
- // color: @text-color;
1312
- // }
1313
- // }
1314
- // }
1315
-
1316
- // .block-columns {
1317
- // display: flex;
1318
- // border: 1px dashed #f2f2f2;
1319
-
1320
- // .item-columns {
1321
- // width: 100%;
1322
- // }
1323
-
1324
- // .icon-edit {
1325
- // cursor: pointer;
1326
- // padding-right: 5px;
1327
- // padding-top: 5px;
1328
- // color: @border-color-base;
1329
-
1330
- // &:hover {
1331
- // color: @text-color;
1332
- // }
1333
- // }
1334
-
1335
- // .icon-remove {
1336
- // cursor: pointer;
1337
- // padding-right: 5px;
1338
- // padding-top: 5px;
1339
- // color: @border-color-base;
1340
-
1341
- // &:hover {
1342
- // color: @text-color;
1343
- // }
1344
- // }
1345
- // }
1346
- // }
1347
- }
1348
- }
1349
- }
1166
+ .layout-block-item {
1167
+ position: relative;
1168
+ margin: 8px;
1169
+ display: flex;
1170
+ flex-direction: column;
1171
+
1172
+ .block-item {
1173
+ display: flex;
1174
+ border: 1px dashed #f2f2f2;
1175
+
1176
+ .item {
1177
+ width: 100%;
1178
+ padding: 5px 8px;
1179
+ display: grid;
1180
+ }
1181
+
1182
+ .item-rows {
1183
+ width: 100%;
1184
+ padding: 5px 8px;
1185
+ }
1186
+
1187
+ .icon-edit {
1188
+ cursor: pointer;
1189
+ padding-right: 5px;
1190
+ padding-top: 5px;
1191
+ color: @border-color-base;
1192
+
1193
+ &:hover {
1194
+ color: @text-color;
1195
+ }
1196
+ }
1197
+
1198
+ .icon-remove {
1199
+ cursor: pointer;
1200
+ padding-right: 5px;
1201
+ padding-top: 5px;
1202
+ color: @border-color-base;
1203
+
1204
+ &:hover {
1205
+ color: @text-color;
1206
+ }
1207
+ }
1208
+ }
1209
+
1210
+ .block-columns {
1211
+ display: flex;
1212
+ border: 1px dashed #f2f2f2;
1213
+
1214
+ .item-columns {
1215
+ width: 100%;
1216
+ }
1217
+
1218
+ .icon-edit {
1219
+ cursor: pointer;
1220
+ padding-right: 5px;
1221
+ padding-top: 5px;
1222
+ color: @border-color-base;
1223
+
1224
+ &:hover {
1225
+ color: @text-color;
1226
+ }
1227
+ }
1228
+
1229
+ .icon-remove {
1230
+ cursor: pointer;
1231
+ padding-right: 5px;
1232
+ padding-top: 5px;
1233
+ color: @border-color-base;
1234
+
1235
+ &:hover {
1236
+ color: @text-color;
1237
+ }
1238
+ }
1239
+ }
1240
+ }
1241
+
1242
+ // .layout-block-item-columns {
1243
+ // position: relative;
1244
+ // height: 100%;
1245
+ // display: flex;
1246
+ // flex-direction: column;
1247
+ // padding: 5px 8px;
1248
+
1249
+ // .block-item {
1250
+ // flex: 1;
1251
+ // border: 1px dashed #f2f2f2;
1252
+
1253
+ // .item {
1254
+ // width: 100%;
1255
+ // padding: 5px 8px;
1256
+
1257
+ // > div {
1258
+ // height: 100%;
1259
+ // }
1260
+
1261
+ // .wigeta-columns-layout-main {
1262
+ // height: 100%;
1263
+ // > div {
1264
+ // width: 100%;
1265
+ // }
1266
+ // }
1267
+ // }
1268
+
1269
+ // .icon-edit {
1270
+ // cursor: pointer;
1271
+ // padding-right: 5px;
1272
+ // padding-top: 5px;
1273
+ // color: @border-color-base;
1274
+
1275
+ // &:hover {
1276
+ // color: @text-color;
1277
+ // }
1278
+ // }
1279
+
1280
+ // .icon-remove {
1281
+ // cursor: pointer;
1282
+ // padding-right: 5px;
1283
+ // padding-top: 5px;
1284
+ // color: @border-color-base;
1285
+
1286
+ // &:hover {
1287
+ // color: @text-color;
1288
+ // }
1289
+ // }
1290
+ // }
1291
+
1292
+ // .block-columns {
1293
+ // display: flex;
1294
+ // border: 1px dashed #f2f2f2;
1295
+
1296
+ // .item-columns {
1297
+ // width: 100%;
1298
+ // }
1299
+
1300
+ // .icon-edit {
1301
+ // cursor: pointer;
1302
+ // padding-right: 5px;
1303
+ // padding-top: 5px;
1304
+ // color: @border-color-base;
1305
+
1306
+ // &:hover {
1307
+ // color: @text-color;
1308
+ // }
1309
+ // }
1310
+
1311
+ // .icon-remove {
1312
+ // cursor: pointer;
1313
+ // padding-right: 5px;
1314
+ // padding-top: 5px;
1315
+ // color: @border-color-base;
1316
+
1317
+ // &:hover {
1318
+ // color: @text-color;
1319
+ // }
1320
+ // }
1321
+ // }
1322
+ // }
1323
+ }
1324
+ }
1325
+ }
1350
1326
  }
1351
1327
 
1352
1328
  .modal-component-layout-edit-widget {
1353
- .draggable-row {
1354
- cursor: default !important;
1355
- margin-bottom: 10px !important;
1356
- border: 1px dashed #d9d9d9 !important;
1357
- border-radius: 5px;
1358
- display: flex;
1359
- align-items: center;
1360
- background-color: #fff;
1361
- }
1329
+ .draggable-row {
1330
+ cursor: default !important;
1331
+ margin-bottom: 10px !important;
1332
+ border: 1px dashed #d9d9d9 !important;
1333
+ border-radius: 5px;
1334
+ display: flex;
1335
+ align-items: center;
1336
+ background-color: #fff;
1337
+ }
1362
1338
 
1363
- .modal-component-layout-body-collapse {
1364
- padding: 20px;
1365
- }
1339
+ .modal-component-layout-body-collapse {
1340
+ padding: 20px;
1341
+ }
1366
1342
  }
1367
1343
 
1368
1344
  .layout-collapse {
1369
-
1370
- .layout-collapse-main {
1371
- min-width: 200px;
1372
- width: 100%;
1373
- // margin: 10px;
1374
- margin-top: 10px;
1375
- margin-bottom: 10px;
1376
- margin-left: 5px;
1377
- margin-right: 5px;
1378
-
1379
-
1380
- .layout-collapse-body {
1381
- min-height: 100px;
1382
- display: table;
1383
- width: 100%;
1345
+ .layout-collapse-main {
1346
+ min-width: 200px;
1347
+ width: 100%;
1348
+ // margin: 10px;
1349
+ margin-top: 10px;
1350
+ margin-bottom: 10px;
1351
+ margin-left: 5px;
1352
+ margin-right: 5px;
1353
+
1354
+ .layout-collapse-body {
1355
+ min-height: 100px;
1356
+ display: table;
1357
+ width: 100%;
1358
+ }
1384
1359
  }
1385
- }
1386
1360
 
1387
- .ant-collapse-content-box {
1388
- padding: 5px;
1389
- }
1361
+ .ant-collapse-content-box {
1362
+ padding: 5px;
1363
+ }
1390
1364
  }
1391
1365
 
1392
1366
  .block-keep {
1393
- display: flex;
1394
- justify-content: space-between;
1367
+ display: flex;
1368
+ justify-content: space-between;
1395
1369
 
1396
- .icon-remove {
1397
- cursor: pointer;
1398
- z-index: 2;
1399
- color: @border-color-base;
1370
+ .icon-remove {
1371
+ cursor: pointer;
1372
+ z-index: 2;
1373
+ color: @border-color-base;
1400
1374
 
1401
- &:hover {
1402
- color: @text-color;
1375
+ &:hover {
1376
+ color: @text-color;
1377
+ }
1403
1378
  }
1404
- }
1405
1379
  }
1406
1380
 
1407
1381
  .image-collapse-item {
1408
- min-height: 11rem;
1382
+ min-height: 11rem;
1409
1383
 
1410
- .z-index {
1411
- z-index: 30;
1412
- }
1384
+ .z-index {
1385
+ z-index: 30;
1386
+ }
1413
1387
  }
1414
1388
 
1415
1389
  .image-collapse-main {
1416
- min-width: 500px;
1390
+ min-width: 500px;
1417
1391
 
1418
- .image-collapse {
1419
- .overlay {
1420
- height: 100%;
1421
- width: 100%;
1422
- z-index: 10;
1423
- position: absolute;
1392
+ .image-collapse {
1393
+ .overlay {
1394
+ height: 100%;
1395
+ width: 100%;
1396
+ z-index: 10;
1397
+ position: absolute;
1398
+ }
1424
1399
  }
1425
- }
1426
1400
 
1427
- .image-collapse-image {
1428
- height: 10rem;
1429
- width: 100%;
1430
- object-fit: cover;
1431
- }
1401
+ .image-collapse-image {
1402
+ height: 10rem;
1403
+ width: 100%;
1404
+ object-fit: cover;
1405
+ }
1432
1406
 
1433
- .image-collapse-not-image {
1434
- height: 10rem;
1435
- width: 100%;
1436
- background-color: #ededf25e;
1437
- }
1407
+ .image-collapse-not-image {
1408
+ height: 10rem;
1409
+ width: 100%;
1410
+ background-color: #ededf25e;
1411
+ }
1438
1412
 
1439
- .image-collapse-icon {
1440
- margin-top: -30px;
1441
- margin-right: 10px;
1442
- display: flex;
1443
- justify-content: flex-end;
1413
+ .image-collapse-icon {
1414
+ margin-top: -30px;
1415
+ margin-right: 10px;
1416
+ display: flex;
1417
+ justify-content: flex-end;
1444
1418
 
1445
- .icon-box {
1446
- z-index: 20;
1447
- font-weight: 700;
1448
- height: 16px;
1449
- width: 16px;
1450
- cursor: pointer;
1419
+ .icon-box {
1420
+ z-index: 20;
1421
+ font-weight: 700;
1422
+ height: 16px;
1423
+ width: 16px;
1424
+ cursor: pointer;
1451
1425
 
1452
- .anticon-up {
1453
- color: #FFF;
1454
- }
1426
+ .anticon-up {
1427
+ color: #fff;
1428
+ }
1455
1429
 
1456
- .anticon-down {
1457
- color: #FFF;
1458
- }
1430
+ .anticon-down {
1431
+ color: #fff;
1432
+ }
1433
+ }
1459
1434
  }
1460
- }
1461
1435
 
1462
- .image-collapse-content {
1463
- min-height: 10rem;
1436
+ .image-collapse-content {
1437
+ min-height: 10rem;
1464
1438
 
1465
- .image-collapse-content-box {
1466
- padding: 1rem;
1467
- margin: 0.25rem;
1439
+ .image-collapse-content-box {
1440
+ padding: 1rem;
1441
+ margin: 0.25rem;
1468
1442
 
1469
- .title {
1470
- margin-bottom: 0.5rem;
1471
- }
1443
+ .title {
1444
+ margin-bottom: 0.5rem;
1445
+ }
1472
1446
 
1473
- .description {
1474
- margin-bottom: 0.5rem;
1475
- }
1447
+ .description {
1448
+ margin-bottom: 0.5rem;
1449
+ }
1450
+ }
1476
1451
  }
1477
1452
 
1478
- }
1479
-
1480
- .hidden {
1481
- display: none;
1482
- }
1453
+ .hidden {
1454
+ display: none;
1455
+ }
1483
1456
 
1484
- .flex {
1485
- display: flex;
1486
- }
1457
+ .flex {
1458
+ display: flex;
1459
+ }
1487
1460
 
1488
- .brightness-95 {
1489
- filter: brightness(.95);
1490
- }
1461
+ .brightness-95 {
1462
+ filter: brightness(0.95);
1463
+ }
1491
1464
 
1492
- .brightness-50 {
1493
- filter: brightness(.5);
1494
- }
1465
+ .brightness-50 {
1466
+ filter: brightness(0.5);
1467
+ }
1495
1468
 
1496
- .rounded-lg {
1497
- border-radius: 0.5rem;
1498
- }
1469
+ .rounded-lg {
1470
+ border-radius: 0.5rem;
1471
+ }
1499
1472
 
1500
- .rounded-t-lg {
1501
- border-top-left-radius: 0.5rem;
1502
- border-top-right-radius: 0.5rem;
1503
- }
1473
+ .rounded-t-lg {
1474
+ border-top-left-radius: 0.5rem;
1475
+ border-top-right-radius: 0.5rem;
1476
+ }
1504
1477
  }
1505
1478
 
1506
1479
  .form-widget-edit {
1480
+ .tree-lines {
1481
+ display: block;
1482
+ border: 1px dashed #d9d9d9;
1483
+ padding: 10px;
1484
+ margin-bottom: 15px;
1485
+
1486
+ .form-item-show-label-only {
1487
+ margin-bottom: 0px !important;
1488
+ }
1507
1489
 
1508
- .tree-lines {
1509
- display: block;
1510
- border: 1px dashed #d9d9d9;
1511
- padding: 10px;
1512
- margin-bottom: 15px;
1490
+ .tree-box-line {
1491
+ padding: 15px;
1492
+ }
1493
+ }
1513
1494
 
1514
- .form-item-show-label-only {
1515
- margin-bottom: 0px !important;
1495
+ .tree-box-name {
1496
+ display: block;
1497
+ margin-top: 20px;
1498
+ margin-bottom: 20px;
1516
1499
  }
1517
1500
 
1518
- .tree-box-line {
1519
- padding: 15px;
1501
+ .tree-box-icon {
1502
+ display: block;
1503
+ margin-top: 20px;
1504
+ margin-bottom: 20px;
1520
1505
  }
1521
- }
1522
1506
 
1523
- .tree-box-name {
1524
- display: block;
1525
- margin-top: 20px;
1526
- margin-bottom: 20px;
1527
- }
1507
+ .label-icon {
1508
+ margin-bottom: 5px;
1509
+ }
1528
1510
 
1529
- .tree-box-icon {
1530
- display: block;
1531
- margin-top: 20px;
1532
- margin-bottom: 20px;
1533
- }
1511
+ .tree-icon-item {
1512
+ display: block;
1513
+ border: 1px dashed #d9d9d9;
1514
+ padding: 10px;
1515
+ margin-bottom: 15px;
1516
+
1517
+ .form-item-show-label-only {
1518
+ margin-bottom: 0px !important;
1519
+ }
1520
+ }
1534
1521
 
1535
- .label-icon {
1536
- margin-bottom: 5px;
1537
- }
1522
+ .map-box {
1523
+ display: block;
1524
+ border: 1px dashed #d9d9d9;
1525
+ padding: 10px;
1526
+ margin-bottom: 15px;
1527
+ // margin-left: 10px;
1528
+ // margin-right: 10px;
1538
1529
 
1539
- .tree-icon-item {
1540
- display: block;
1541
- border: 1px dashed #d9d9d9;
1542
- padding: 10px;
1543
- margin-bottom: 15px;
1530
+ .form-item-show-label-only {
1531
+ margin-bottom: 0px !important;
1532
+ }
1544
1533
 
1545
- .form-item-show-label-only {
1546
- margin-bottom: 0px !important;
1534
+ .tree-box-line {
1535
+ padding: 15px;
1536
+ }
1547
1537
  }
1548
- }
1538
+ }
1549
1539
 
1550
- .map-box {
1551
- display: block;
1552
- border: 1px dashed #d9d9d9;
1553
- padding: 10px;
1554
- margin-bottom: 15px;
1555
- // margin-left: 10px;
1556
- // margin-right: 10px;
1540
+ .navigate-tree-item {
1541
+ .item {
1542
+ display: flex;
1543
+ justify-content: center;
1544
+ }
1557
1545
 
1558
- .form-item-show-label-only {
1559
- margin-bottom: 0px !important;
1546
+ // min-height: 200px;
1547
+ .slick-navigate-main {
1548
+ width: 450px;
1549
+ padding: 1rem;
1550
+ align-items: center;
1551
+ justify-content: center;
1552
+ display: flex;
1553
+ // padding-left: 4rem;
1554
+ // padding-right: 4rem;
1555
+ max-width: 450px;
1560
1556
  }
1561
1557
 
1562
- .tree-box-line {
1563
- padding: 15px;
1558
+ .item-action {
1559
+ padding: 0.5rem;
1560
+ border-radius: 9999px;
1561
+ height: 3.5rem;
1562
+ width: 3.5rem;
1563
+ background-color: darkgreen;
1564
1564
  }
1565
- }
1566
- }
1567
1565
 
1568
- .navigate-tree-item {
1569
- .item {
1570
- display: flex;
1571
- justify-content: center;
1572
- }
1566
+ .item-radius-two {
1567
+ padding: 0.5rem;
1568
+ border-radius: 9999px;
1569
+ height: 4rem;
1570
+ width: 4rem;
1571
+ background-color: rgb(156, 243, 156);
1572
+ }
1573
1573
 
1574
- // min-height: 200px;
1575
- .slick-navigate-main {
1576
- width: 450px;
1577
- padding: 1rem;
1578
- align-items: center;
1579
- justify-content: center;
1580
- display: flex;
1581
- // padding-left: 4rem;
1582
- // padding-right: 4rem;
1583
- max-width: 450px;
1584
- }
1585
-
1586
- .item-action {
1587
- padding: 0.5rem;
1588
- border-radius: 9999px;
1589
- height: 3.5rem;
1590
- width: 3.5rem;
1591
- background-color: darkgreen;
1592
- }
1593
-
1594
- .item-radius-two {
1595
- padding: 0.5rem;
1596
- border-radius: 9999px;
1597
- height: 4rem;
1598
- width: 4rem;
1599
- background-color: rgb(156, 243, 156);
1600
- }
1601
-
1602
- .item-radius-three {
1603
- padding: 0.5rem;
1604
- border-radius: 9999px;
1605
- height: 3rem;
1606
- width: 3rem;
1607
- background-color: rgb(156, 243, 156);
1608
- }
1609
-
1610
- .item-box {
1611
- display: flex;
1612
- justify-content: center;
1574
+ .item-radius-three {
1575
+ padding: 0.5rem;
1576
+ border-radius: 9999px;
1577
+ height: 3rem;
1578
+ width: 3rem;
1579
+ background-color: rgb(156, 243, 156);
1580
+ }
1613
1581
 
1614
- .leading-relaxed {
1615
- width: 100%;
1616
- height: 100%;
1617
- align-items: center;
1618
- display: flex;
1619
- justify-content: center;
1620
- font-size: 1rem;
1621
- color: #FFF;
1582
+ .item-box {
1583
+ display: flex;
1584
+ justify-content: center;
1622
1585
 
1586
+ .leading-relaxed {
1587
+ width: 100%;
1588
+ height: 100%;
1589
+ align-items: center;
1590
+ display: flex;
1591
+ justify-content: center;
1592
+ font-size: 1rem;
1593
+ color: #fff;
1594
+ }
1623
1595
  }
1624
- }
1625
1596
 
1626
- .cursor-item {
1627
- cursor: pointer;
1628
- }
1597
+ .cursor-item {
1598
+ cursor: pointer;
1599
+ }
1629
1600
 
1630
- .text-base {
1631
- font-size: 1rem;
1632
- line-height: 1.5rem;
1633
- margin-top: 1rem;
1634
- }
1601
+ .text-base {
1602
+ font-size: 1rem;
1603
+ line-height: 1.5rem;
1604
+ margin-top: 1rem;
1605
+ }
1635
1606
  }
1636
1607
 
1637
1608
  .carousel-item {
1638
- .box-content {
1639
- width: 100%;
1640
- position: relative
1641
- }
1642
-
1643
- .image {
1644
- width: 100%;
1645
- height: 66%;
1646
- object-fit: cover;
1647
- }
1648
-
1649
- .label-image {
1650
- bottom: 0.25rem;
1651
- left: 15px;
1652
- position: absolute;
1653
- z-index: 30;
1654
- margin-top: -30px
1655
- }
1609
+ .box-content {
1610
+ width: 100%;
1611
+ position: relative;
1612
+ }
1656
1613
 
1657
- // min-height: 300px;
1658
- // min-height: 300px;
1614
+ .image {
1615
+ width: 100%;
1616
+ height: 66%;
1617
+ object-fit: cover;
1618
+ }
1659
1619
 
1620
+ .label-image {
1621
+ bottom: 0.25rem;
1622
+ left: 15px;
1623
+ position: absolute;
1624
+ z-index: 30;
1625
+ margin-top: -30px;
1626
+ }
1660
1627
 
1628
+ // min-height: 300px;
1629
+ // min-height: 300px;
1661
1630
  }
1662
1631
 
1663
1632
  .googl-map-item {
1664
- min-height: 200px;
1665
-
1666
- .map-mode-one-box {
1667
- width: 100%;
1668
- height: 30vh;
1669
- }
1633
+ min-height: 200px;
1670
1634
 
1671
- .map-mode-two-box {
1672
- min-width: 500px;
1673
- width: 100%;
1674
- height: 30vh;
1675
- }
1676
-
1677
- .map-mode-two-main {
1678
- width: 100%;
1679
- display: flex;
1680
- align-items: center;
1681
- align-self: center;
1682
- text-align: center;
1683
- justify-content: center;
1684
-
1685
- .text-location {
1686
- font-weight: 900;
1687
- line-height: 1.75rem;
1688
- font-size: 20px;
1689
- color: #000;
1635
+ .map-mode-one-box {
1636
+ width: 100%;
1637
+ height: 30vh;
1690
1638
  }
1691
1639
 
1692
- .text-address {
1693
- font-weight: 600;
1694
- line-height: 1.75rem;
1695
- font-size: 20px;
1640
+ .map-mode-two-box {
1641
+ min-width: 500px;
1642
+ width: 100%;
1643
+ height: 30vh;
1696
1644
  }
1697
1645
 
1698
- }
1646
+ .map-mode-two-main {
1647
+ width: 100%;
1648
+ display: flex;
1649
+ align-items: center;
1650
+ align-self: center;
1651
+ text-align: center;
1652
+ justify-content: center;
1653
+
1654
+ .text-location {
1655
+ font-weight: 900;
1656
+ line-height: 1.75rem;
1657
+ font-size: 20px;
1658
+ color: #000;
1659
+ }
1699
1660
 
1661
+ .text-address {
1662
+ font-weight: 600;
1663
+ line-height: 1.75rem;
1664
+ font-size: 20px;
1665
+ }
1666
+ }
1700
1667
  }
1701
1668
 
1702
-
1703
1669
  .render-tabs-component {
1704
- .component-layout-detail {
1705
- .ant-tabs-tab {
1706
- border: unset !important;
1707
- border-bottom: unset !important;
1708
- background-color: unset !important;
1670
+ .component-layout-detail {
1671
+ .ant-tabs-tab {
1672
+ border: unset !important;
1673
+ border-bottom: unset !important;
1674
+ background-color: unset !important;
1675
+ }
1709
1676
  }
1710
- }
1711
1677
  }
1712
1678
 
1713
1679
  .slick-list {
1714
- width: 100%;
1680
+ width: 100%;
1715
1681
  }
1716
1682
 
1717
1683
  .customCenterCarousels .slick-slide:not(.slick-active) {
1718
- opacity: 30%;
1684
+ opacity: 30%;
1719
1685
  }
1720
1686
 
1721
1687
  .slider-nextarrow {
1722
- position: absolute;
1723
- top: 50%;
1724
- right: 0px;
1725
- z-index: 40;
1726
- cursor: pointer;
1688
+ position: absolute;
1689
+ top: 50%;
1690
+ right: 0px;
1691
+ z-index: 40;
1692
+ cursor: pointer;
1727
1693
  }
1728
1694
 
1729
1695
  .slider-nextarrow-box {
1730
- height: 40px;
1731
- width: 40px;
1732
- display: flex;
1733
- justify-content: center;
1734
- padding: 8px;
1696
+ height: 40px;
1697
+ width: 40px;
1698
+ display: flex;
1699
+ justify-content: center;
1700
+ padding: 8px;
1735
1701
  }
1736
1702
 
1737
1703
  .slider-prevarrow {
1738
- position: absolute;
1739
- top: 50%;
1740
- left: 0px;
1741
- z-index: 40;
1742
- cursor: pointer;
1704
+ position: absolute;
1705
+ top: 50%;
1706
+ left: 0px;
1707
+ z-index: 40;
1708
+ cursor: pointer;
1743
1709
  }
1744
1710
 
1745
1711
  .slider-prevarrow-box {
1746
- height: 40px;
1747
- width: 40px;
1748
- display: flex;
1749
- justify-content: center;
1750
- padding: 8px;
1712
+ height: 40px;
1713
+ width: 40px;
1714
+ display: flex;
1715
+ justify-content: center;
1716
+ padding: 8px;
1751
1717
  }
1752
1718
 
1753
1719
  .empty-layout-block {
1754
- min-height: 60px;
1720
+ min-height: 60px;
1755
1721
 
1756
- .item-empty {
1757
- background-color: #dfdfe0;
1758
- height: 50px;
1759
- }
1722
+ .item-empty {
1723
+ background-color: #dfdfe0;
1724
+ height: 50px;
1725
+ }
1760
1726
  }
1761
1727
 
1762
1728
  .button-layout-main {
1763
- display: flex;
1764
- justify-content: center;
1765
- padding: 5px;
1729
+ display: flex;
1730
+ justify-content: center;
1731
+ padding: 5px;
1766
1732
  }
1767
1733
 
1768
1734
  .layout-content {
1769
- min-height: 150px;
1770
- width: 100%;
1771
- margin-top: 20px;
1735
+ min-height: 150px;
1736
+ width: 100%;
1737
+ margin-top: 20px;
1772
1738
  }
1773
1739
 
1774
1740
  .layout-content {
1775
- padding: 10px;
1741
+ padding: 10px;
1776
1742
 
1777
- .layout-content-body {
1778
- min-height: 100px;
1779
- display: table;
1780
- width: 100%;
1781
- }
1743
+ .layout-content-body {
1744
+ min-height: 100px;
1745
+ display: table;
1746
+ width: 100%;
1747
+ }
1782
1748
 
1783
- .ant-collapse-content-box {
1784
- padding: 5px;
1785
- }
1749
+ .ant-collapse-content-box {
1750
+ padding: 5px;
1751
+ }
1786
1752
  }
1787
1753
 
1788
1754
  .navigate-tree-main {
1789
- min-height: 100%;
1790
- background-color: #F9F5F1;
1791
- overflow: hidden;
1792
- position: relative;
1793
- width: 100%;
1794
- min-width: 500px;
1795
-
1796
- .navigate-tree-box {
1797
- display: flex;
1798
- flex-direction: row;
1799
- // margin-top: 0px;
1800
- justify-content: space-between;
1801
- }
1802
-
1803
- .transaction-box {
1804
- // width: 100px;
1805
- width: 16%;
1806
- display: flex;
1807
- flex-direction: row;
1808
- justify-content: end;
1809
- align-items: center;
1810
- background: #F5EDE8;
1811
- color: #d9d9d9;
1755
+ min-height: 100%;
1756
+ background-color: #f9f5f1;
1757
+ overflow: hidden;
1758
+ position: relative;
1759
+ width: 100%;
1760
+ min-width: 500px;
1812
1761
 
1813
- .transaction-item {
1814
- display: flex;
1815
- flex-direction: column;
1816
- padding-right: 4px;
1817
- justify-content: center;
1818
- align-items: flex-end;
1819
-
1820
- .text-title {
1821
- font-size: 8px;
1822
- line-height: 10px;
1823
- max-width: 110px;
1824
- float: right;
1825
- font-weight: 500;
1826
- text-align: right
1827
- }
1828
-
1829
- .text-description {
1830
- font-size: 8px;
1831
- line-height: 10px;
1832
- max-width: 110px;
1833
- float: right;
1834
- font-weight: 500;
1835
- }
1836
- }
1837
- }
1838
-
1839
- .icon-transaction {
1840
- border-top-color: transparent;
1841
- border-bottom-color: transparent;
1842
- border-right-color: #c4c4c4;
1843
- border-top-width: 6px;
1844
- border-bottom-width: 6px;
1845
- border-right-width: 8px;
1846
- width: 0;
1847
- height: 0;
1848
- border: 0 solid #e5e7eb;
1849
- }
1762
+ .navigate-tree-box {
1763
+ display: flex;
1764
+ flex-direction: row;
1765
+ // margin-top: 0px;
1766
+ justify-content: space-between;
1767
+ }
1850
1768
 
1851
- .line-item {
1852
- width: 70px;
1853
- margin-left: 10px;
1854
- padding-right: 5px;
1855
- padding-left: 5px;
1856
- padding-top: 0px;
1857
- padding-bottom: 0px;
1858
- align-items: flex-end;
1859
- justify-content: space-between;
1860
- flex-direction: row;
1861
- display: flex;
1862
- // min-width: 130px;
1769
+ .transaction-box {
1770
+ // width: 100px;
1771
+ width: 16%;
1772
+ display: flex;
1773
+ flex-direction: row;
1774
+ justify-content: end;
1775
+ align-items: center;
1776
+ background: #f5ede8;
1777
+ color: #d9d9d9;
1863
1778
 
1779
+ .transaction-item {
1780
+ display: flex;
1781
+ flex-direction: column;
1782
+ padding-right: 4px;
1783
+ justify-content: center;
1784
+ align-items: flex-end;
1785
+
1786
+ .text-title {
1787
+ font-size: 8px;
1788
+ line-height: 10px;
1789
+ max-width: 110px;
1790
+ float: right;
1791
+ font-weight: 500;
1792
+ text-align: right;
1793
+ }
1864
1794
 
1865
- .h-12 {
1866
- background-color: transparent;
1867
- height: 50%;
1868
- position: relative;
1869
- width: 3px;
1795
+ .text-description {
1796
+ font-size: 8px;
1797
+ line-height: 10px;
1798
+ max-width: 110px;
1799
+ float: right;
1800
+ font-weight: 500;
1801
+ }
1802
+ }
1870
1803
  }
1871
1804
 
1872
- .h-full {
1873
- background-color: transparent;
1874
- height: 100%;
1875
- position: relative;
1876
- width: 3px;
1805
+ .icon-transaction {
1806
+ border-top-color: transparent;
1807
+ border-bottom-color: transparent;
1808
+ border-right-color: #c4c4c4;
1809
+ border-top-width: 6px;
1810
+ border-bottom-width: 6px;
1811
+ border-right-width: 8px;
1812
+ width: 0;
1813
+ height: 0;
1814
+ border: 0 solid #e5e7eb;
1877
1815
  }
1878
1816
 
1879
- .eveent-icon-box {
1880
- height: 24px;
1881
- width: 24px;
1882
- position: absolute;
1883
- left: -10.5px;
1884
- border-radius: 15px;
1817
+ .line-item {
1818
+ width: 70px;
1819
+ margin-left: 10px;
1820
+ padding-right: 5px;
1821
+ padding-left: 5px;
1822
+ padding-top: 0px;
1823
+ padding-bottom: 0px;
1824
+ align-items: flex-end;
1825
+ justify-content: space-between;
1826
+ flex-direction: row;
1827
+ display: flex;
1828
+ // min-width: 130px;
1829
+
1830
+ .h-12 {
1831
+ background-color: transparent;
1832
+ height: 50%;
1833
+ position: relative;
1834
+ width: 3px;
1835
+ }
1885
1836
 
1886
- .icon {
1887
- width: 16px;
1888
- height: 16px;
1889
- margin-top: 4px;
1890
- margin-left: 4px;
1891
- }
1892
- }
1837
+ .h-full {
1838
+ background-color: transparent;
1839
+ height: 100%;
1840
+ position: relative;
1841
+ width: 3px;
1842
+ }
1893
1843
 
1894
- .top-12 {
1895
- top: -12px;
1896
- }
1844
+ .eveent-icon-box {
1845
+ height: 24px;
1846
+ width: 24px;
1847
+ position: absolute;
1848
+ left: -10.5px;
1849
+ border-radius: 15px;
1850
+
1851
+ .icon {
1852
+ width: 16px;
1853
+ height: 16px;
1854
+ margin-top: 4px;
1855
+ margin-left: 4px;
1856
+ }
1857
+ }
1858
+
1859
+ .top-12 {
1860
+ top: -12px;
1861
+ }
1897
1862
 
1898
- .top-26 {
1899
- top: 26px;
1863
+ .top-26 {
1864
+ top: 26px;
1865
+ }
1900
1866
  }
1901
1867
 
1902
- }
1868
+ .box-items {
1869
+ display: flex;
1870
+ padding: 10px;
1871
+ flex: 1 1 0%;
1872
+ }
1903
1873
 
1904
- .box-items {
1905
- display: flex;
1906
- padding: 10px;
1907
- flex: 1 1 0%;
1908
- }
1874
+ .drop-shadow-md {
1875
+ width: 100%;
1876
+ height: 100%;
1877
+ background-color: #fff;
1878
+ border-radius: 5px;
1879
+ flex-direction: row;
1909
1880
 
1910
- .drop-shadow-md {
1911
- width: 100%;
1912
- height: 100%;
1913
- background-color: #FFF;
1914
- border-radius: 5px;
1915
- flex-direction: row;
1881
+ .card-item {
1882
+ padding-top: 5px;
1883
+ padding-bottom: 5px;
1884
+ padding-left: 10px;
1885
+ padding-right: 10px;
1886
+ display: flex;
1887
+ flex-direction: column;
1916
1888
 
1917
- .card-item {
1918
- padding-top: 5px;
1919
- padding-bottom: 5px;
1920
- padding-left: 10px;
1921
- padding-right: 10px;
1922
- display: flex;
1923
- flex-direction: column;
1889
+ .font-title {
1890
+ font-size: 14px;
1891
+ font-weight: 700;
1892
+ margin: 0px;
1893
+ }
1924
1894
 
1925
- .font-title {
1926
- font-size: 14px;
1927
- font-weight: 700;
1928
- margin: 0px;
1929
- }
1895
+ .font-description {
1896
+ font-size: 12px;
1897
+ font-weight: 200;
1898
+ margin: 0px;
1899
+ }
1900
+ }
1901
+ }
1930
1902
 
1931
- .font-description {
1932
- font-size: 12px;
1933
- font-weight: 200;
1934
- margin: 0px;
1935
- }
1903
+ .arrow-down-icon-box {
1904
+ height: 100%;
1905
+ width: 60px;
1906
+ border-radius: 5px;
1907
+ display: flex;
1908
+ align-items: center;
1909
+ cursor: pointer;
1910
+ align-items: center;
1911
+ justify-content: center;
1912
+ }
1936
1913
 
1914
+ .arrow-down-icon {
1915
+ color: #fff;
1937
1916
  }
1938
- }
1939
1917
 
1940
- .arrow-down-icon-box {
1941
- height: 100%;
1942
- width: 60px;
1943
- border-radius: 5px;
1944
- display: flex;
1945
- align-items: center;
1946
- cursor: pointer;
1947
- align-items: center;
1948
- justify-content: center;
1949
- }
1918
+ .line-item-end-main {
1919
+ flex: 1 1 0%;
1920
+ flex-direction: row;
1921
+ background: #f9f5f1;
1922
+ display: flex;
1950
1923
 
1951
- .arrow-down-icon {
1952
- color: #FFF;
1953
- }
1924
+ .line-item-end-one {
1925
+ width: 16%;
1926
+ padding-right: 4px;
1927
+ flex-direction: row;
1928
+ justify-content: center;
1929
+ align-items: flex-end;
1930
+ }
1954
1931
 
1932
+ .line-item-end-item {
1933
+ // width: 120px;
1934
+ width: 70px;
1935
+ height: 100px;
1936
+ // margin-left: 10px;
1937
+ display: flex;
1938
+ flex-direction: row;
1939
+ justify-content: space-between;
1940
+ position: relative;
1941
+ margin-left: 10px;
1942
+ position: relative;
1943
+ padding-left: 5px;
1944
+ padding-right: 5px;
1945
+ }
1955
1946
 
1956
- .line-item-end-main {
1957
- flex: 1 1 0%;
1958
- flex-direction: row;
1959
- background: #F9F5F1;
1960
- display: flex;
1947
+ .line-end-1 {
1948
+ height: 2px;
1949
+ width: 3px;
1950
+ position: relative;
1961
1951
 
1962
- .line-item-end-one {
1963
- width: 16%;
1964
- padding-right: 4px;
1965
- flex-direction: row;
1966
- justify-content: center;
1967
- align-items: flex-end;
1968
- }
1969
-
1970
- .line-item-end-item {
1971
- // width: 120px;
1972
- width: 70px;
1973
- height: 100px;
1974
- // margin-left: 10px;
1975
- display: flex;
1976
- flex-direction: row;
1977
- justify-content: space-between;
1978
- position: relative;
1979
- margin-left: 10px;
1980
- position: relative;
1981
- padding-left: 5px;
1982
- padding-right: 5px;
1983
- }
1984
-
1985
- .line-end-1 {
1986
- height: 2px;
1987
- width: 3px;
1988
- position: relative;
1989
-
1990
- .mid {
1991
- height: 15px;
1992
- width: 15px;
1993
- position: absolute;
1994
- top: 2px;
1995
- left: 0px;
1996
- border-left: 3px;
1997
- }
1952
+ .mid {
1953
+ height: 15px;
1954
+ width: 15px;
1955
+ position: absolute;
1956
+ top: 2px;
1957
+ left: 0px;
1958
+ border-left: 3px;
1959
+ }
1998
1960
 
1999
- .left {
2000
- height: 15px;
2001
- width: 15px;
2002
- // width: 40px;
2003
- position: absolute;
2004
- top: 2px;
2005
- left: 0px;
2006
- border-bottom-left-radius: 40px;
2007
- border-left-width: 3px;
2008
- border-left-style: solid;
2009
- border-bottom-width: 3px;
2010
- border-bottom-style: solid;
2011
- }
1961
+ .left {
1962
+ height: 15px;
1963
+ width: 15px;
1964
+ // width: 40px;
1965
+ position: absolute;
1966
+ top: 2px;
1967
+ left: 0px;
1968
+ border-bottom-left-radius: 40px;
1969
+ border-left-width: 3px;
1970
+ border-left-style: solid;
1971
+ border-bottom-width: 3px;
1972
+ border-bottom-style: solid;
1973
+ }
2012
1974
 
2013
- .right {
2014
- height: 15px;
2015
- // width: 40px;
2016
- width: 15px;
1975
+ .right {
1976
+ height: 15px;
1977
+ // width: 40px;
1978
+ width: 15px;
1979
+ position: absolute;
1980
+ top: 2px;
1981
+ right: 0px;
1982
+ border-bottom-right-radius: 40px;
1983
+ border-right-width: 3px;
1984
+ border-right-style: solid;
1985
+
1986
+ border-bottom-width: 3px;
1987
+ border-bottom-style: solid;
1988
+ }
1989
+ }
1990
+ }
1991
+
1992
+ .brand-box-bnd {
2017
1993
  position: absolute;
2018
- top: 2px;
2019
- right: 0px;
2020
- border-bottom-right-radius: 40px;
2021
- border-right-width: 3px;
2022
- border-right-style: solid;
1994
+ height: 40px;
1995
+ width: 40px;
1996
+ top: 0;
1997
+ // left: 35px;
1998
+ left: 15px;
1999
+ z-index: 10;
2000
+ border-radius: 30px;
2001
+ }
2023
2002
 
2024
- border-bottom-width: 3px;
2025
- border-bottom-style: solid;
2026
- }
2003
+ .image-brand {
2004
+ height: 40px;
2005
+ width: 40px;
2006
+ border-radius: 20px;
2027
2007
  }
2028
- }
2029
2008
 
2030
- .brand-box-bnd {
2031
- position: absolute;
2032
- height: 40px;
2033
- width: 40px;
2034
- top: 0;
2035
- // left: 35px;
2036
- left: 15px;
2037
- z-index: 10;
2038
- border-radius: 30px;
2039
- }
2040
-
2041
- .image-brand {
2042
- height: 40px;
2043
- width: 40px;
2044
- border-radius: 20px;
2045
- }
2009
+ .brand_end_line {
2010
+ position: absolute;
2011
+ border-left: 3px;
2012
+ border-bottom: 3px;
2013
+ height: 15px;
2014
+ width: 80px;
2015
+ top: 40px;
2016
+ left: 35px;
2017
+ border-left-width: 3px;
2018
+ border-left-style: solid;
2019
+ border-bottom-width: 3px;
2020
+ border-bottom-style: solid;
2021
+ }
2046
2022
 
2047
- .brand_end_line {
2048
- position: absolute;
2049
- border-left: 3px;
2050
- border-bottom: 3px;
2051
- height: 15px;
2052
- width: 80px;
2053
- top: 40px;
2054
- left: 35px;
2055
- border-left-width: 3px;
2056
- border-left-style: solid;
2057
- border-bottom-width: 3px;
2058
- border-bottom-style: solid;
2059
- }
2060
-
2061
- .shipping {
2062
- position: absolute;
2063
- top: 41.5px;
2064
- left: 100px;
2065
- font-size: 14px;
2066
- padding-left: 30px;
2067
- padding-top: 1px;
2068
- flex-direction: row;
2069
- display: flex;
2070
- }
2023
+ .shipping {
2024
+ position: absolute;
2025
+ top: 41.5px;
2026
+ left: 100px;
2027
+ font-size: 14px;
2028
+ padding-left: 30px;
2029
+ padding-top: 1px;
2030
+ flex-direction: row;
2031
+ display: flex;
2032
+ }
2071
2033
 
2072
- .double-right-outlined {
2073
- position: absolute;
2074
- top: 46px;
2075
- left: 105px;
2076
- width: 1.5rem;
2077
- height: 1.5rem;
2078
- }
2034
+ .double-right-outlined {
2035
+ position: absolute;
2036
+ top: 46px;
2037
+ left: 105px;
2038
+ width: 1.5rem;
2039
+ height: 1.5rem;
2040
+ }
2079
2041
  }
2080
2042
 
2081
2043
  .box-scrollable-list {
2082
- border: 1px dashed #d9d9d9;
2083
- padding: 10px;
2044
+ border: 1px dashed #d9d9d9;
2045
+ padding: 10px;
2084
2046
  }
2085
2047
 
2086
2048
  .scrollable-list {
2087
- display: flex;
2088
- width: 100%;
2089
-
2090
- .list-dnd {
2091
- width: 100%;
2092
2049
  display: flex;
2093
- margin: 8px;
2094
- border: 1px solid #bfbfbf !important;
2095
- border-radius: 6px;
2096
- background-color: #fafafa;
2050
+ width: 100%;
2097
2051
 
2098
- .dnd-move {
2099
- border-right: 1px solid #bfbfbf;
2100
- padding: 8px;
2101
- }
2052
+ .list-dnd {
2053
+ width: 100%;
2054
+ display: flex;
2055
+ margin: 8px;
2056
+ border: 1px solid #bfbfbf !important;
2057
+ border-radius: 6px;
2058
+ background-color: #fafafa;
2102
2059
 
2103
- .dnd-box {
2104
- width: 100%;
2105
- }
2060
+ .dnd-move {
2061
+ border-right: 1px solid #bfbfbf;
2062
+ padding: 8px;
2063
+ }
2106
2064
 
2107
- .content {
2108
- padding: 8px;
2109
- flex: 1 1;
2110
- white-space: nowrap;
2111
- overflow: hidden;
2112
- text-overflow: ellipsis;
2113
- cursor: pointer;
2114
- }
2065
+ .dnd-box {
2066
+ width: 100%;
2067
+ }
2068
+
2069
+ .content {
2070
+ padding: 8px;
2071
+ flex: 1 1;
2072
+ white-space: nowrap;
2073
+ overflow: hidden;
2074
+ text-overflow: ellipsis;
2075
+ cursor: pointer;
2076
+ }
2115
2077
 
2116
- .remove {
2117
- display: block;
2118
- width: 30px;
2119
- padding: 8px;
2120
- cursor: pointer;
2078
+ .remove {
2079
+ display: block;
2080
+ width: 30px;
2081
+ padding: 8px;
2082
+ cursor: pointer;
2083
+ }
2121
2084
  }
2122
- }
2123
2085
  }
2124
2086
 
2125
2087
  .dropdown-list-dnd {
2126
- width: 100%;
2127
- margin: 8px;
2128
- border: 1px solid #c59b7c !important;
2129
- border-radius: 6px;
2130
- padding: 6px;
2131
- display: flex;
2132
- justify-content: center;
2133
- cursor: pointer;
2134
-
2135
- .plus-field {
2136
2088
  width: 100%;
2089
+ margin: 8px;
2090
+ border: 1px solid #c59b7c !important;
2091
+ border-radius: 6px;
2092
+ padding: 6px;
2137
2093
  display: flex;
2138
2094
  justify-content: center;
2139
- color: #c59b7c;
2095
+ cursor: pointer;
2096
+
2097
+ .plus-field {
2098
+ width: 100%;
2099
+ display: flex;
2100
+ justify-content: center;
2101
+ color: #c59b7c;
2140
2102
 
2141
- .anticon {
2142
- align-self: center;
2143
- padding-right: 5px;
2103
+ .anticon {
2104
+ align-self: center;
2105
+ padding-right: 5px;
2106
+ }
2144
2107
  }
2145
- }
2146
2108
 
2147
- .box-button-list {
2148
- background-color: #ff4d4f;
2149
- display: flex;
2150
- background-color: #ff4d4f;
2151
- width: 100%;
2152
- }
2109
+ .box-button-list {
2110
+ background-color: #ff4d4f;
2111
+ display: flex;
2112
+ background-color: #ff4d4f;
2113
+ width: 100%;
2114
+ }
2153
2115
  }
2154
2116
 
2155
-
2156
2117
  .widget-list span {
2157
- margin-left: 0px !important;
2158
- display: flex;
2159
- justify-content: center;
2160
- align-items: center;
2161
- padding-top: 5px;
2162
- padding-bottom: 5px;
2118
+ margin-left: 0px !important;
2119
+ display: flex;
2120
+ justify-content: center;
2121
+ align-items: center;
2122
+ padding-top: 5px;
2123
+ padding-bottom: 5px;
2163
2124
  }
2164
2125
 
2165
2126
  .icon-layout {
2166
- position: relative;
2167
- margin-right: 8px;
2168
- margin-top: 8px;
2169
- display: flex;
2170
- align-items: flex-end;
2171
- justify-content: flex-end;
2127
+ position: relative;
2128
+ margin-right: 8px;
2129
+ margin-top: 8px;
2130
+ display: flex;
2131
+ align-items: flex-end;
2132
+ justify-content: flex-end;
2172
2133
  }
2173
2134
 
2174
2135
  .icon-edit-title {
2175
- margin-bottom: 0px !important;
2136
+ margin-bottom: 0px !important;
2176
2137
  }
2177
2138
 
2178
2139
  .loop-data-title {
2179
- color: #d9d9d9,
2180
-
2140
+ color: #d9d9d9;
2181
2141
  }
2182
2142
 
2183
2143
  .loop-data-content {
2184
- min-height: 150px;
2185
- display: table;
2186
- width: 100%;
2144
+ min-height: 150px;
2145
+ display: table;
2146
+ width: 100%;
2187
2147
  }
2188
2148
 
2189
2149
  .layout-icon-setting-widgets {
2190
- display: none
2150
+ display: none;
2191
2151
  }
2192
2152
 
2193
2153
  .layout-icon-setting-widgets-wysiwyg {
2194
- display: none
2154
+ display: none;
2195
2155
  }
2196
2156
 
2197
2157
  .layout-icon-setting-collapse {
2198
- display: none
2158
+ display: none;
2199
2159
  }
2200
2160
 
2201
2161
  .layout-icon-setting-frame {
2202
- display: none
2162
+ display: none;
2203
2163
  }
2204
2164
 
2205
2165
  .layout-icon-setting-chart {
2206
- display: none
2166
+ display: none;
2207
2167
  }
2208
2168
 
2209
2169
  .layout-block-item-columns {
2210
- &:hover {
2211
- .layout-icon-setting-widgets {
2212
- display: flex;
2213
- position: absolute;
2214
- top: 1px;
2215
- right: 0px;
2216
- z-index: 9;
2170
+ &:hover {
2171
+ .layout-icon-setting-widgets {
2172
+ display: flex;
2173
+ position: absolute;
2174
+ top: 1px;
2175
+ right: 0px;
2176
+ z-index: 9;
2177
+ }
2217
2178
  }
2218
- }
2219
-
2220
2179
  }
2221
2180
  .layout-block-item {
2222
- &:hover {
2223
- .layout-icon-setting-widgets {
2224
- display: flex;
2225
- position: absolute;
2226
- top: 1px;
2227
- right: 0px;
2228
- z-index: 9;
2229
- }
2181
+ &:hover {
2182
+ .layout-icon-setting-widgets {
2183
+ display: flex;
2184
+ position: absolute;
2185
+ top: 1px;
2186
+ right: 0px;
2187
+ z-index: 9;
2188
+ }
2230
2189
 
2231
- .layout-icon-setting-widgets-wysiwyg {
2232
- display: flex;
2233
- position: absolute;
2234
- top: -8px;
2235
- right: 0px;
2236
- z-index: 9;
2237
- }
2190
+ .layout-icon-setting-widgets-wysiwyg {
2191
+ display: flex;
2192
+ position: absolute;
2193
+ top: -8px;
2194
+ right: 0px;
2195
+ z-index: 9;
2196
+ }
2238
2197
 
2239
- .layout-icon-setting-collapse {
2240
- display: flex;
2241
- position: absolute;
2242
- top: 20px;
2243
- right: 12px;
2244
- z-index: 9;
2245
- }
2198
+ .layout-icon-setting-collapse {
2199
+ display: flex;
2200
+ position: absolute;
2201
+ top: 20px;
2202
+ right: 12px;
2203
+ z-index: 9;
2204
+ }
2246
2205
 
2247
- .layout-icon-setting-frame {
2248
- display: flex;
2249
- position: absolute;
2250
- top: 0px;
2251
- right: 5px;
2252
- z-index: 9;
2253
- }
2206
+ .layout-icon-setting-frame {
2207
+ display: flex;
2208
+ position: absolute;
2209
+ top: 0px;
2210
+ right: 5px;
2211
+ z-index: 9;
2212
+ }
2254
2213
 
2255
- .layout-icon-setting-chart {
2256
- display: flex;
2257
- position: absolute;
2258
- top: 5px;
2259
- right: 5px;
2260
- z-index: 9;
2214
+ .layout-icon-setting-chart {
2215
+ display: flex;
2216
+ position: absolute;
2217
+ top: 5px;
2218
+ right: 5px;
2219
+ z-index: 9;
2220
+ }
2261
2221
  }
2262
- }
2263
2222
  }
2264
2223
 
2265
2224
  .frame-layout-main {
2266
- border: 1px dashed #d9d9d9;
2267
- overflow: scroll;
2268
- width: 100%;
2269
- background-color: #f6f7f9;
2270
- border-radius: 5px;
2225
+ border: 1px dashed #d9d9d9;
2226
+ overflow: scroll;
2227
+ width: 100%;
2228
+ background-color: #f6f7f9;
2229
+ border-radius: 5px;
2271
2230
  }
2272
2231
 
2273
2232
  .frame-box-row-one {
2274
- display: flex;
2233
+ display: flex;
2275
2234
  }
2276
2235
 
2277
2236
  .frame-box-row-two {
2278
- display: flex;
2237
+ display: flex;
2279
2238
  }
2280
2239
 
2281
2240
  .border-right {
2282
- border-right: 1px dashed #d9d9d9;
2241
+ border-right: 1px dashed #d9d9d9;
2283
2242
  }
2284
2243
 
2285
2244
  .icon-setting-open-modal-css {
2286
- display: flex;
2287
- align-items: flex-end;
2288
- justify-content: flex-end;
2289
- padding: 5px;
2290
- cursor: pointer;
2245
+ display: flex;
2246
+ align-items: flex-end;
2247
+ justify-content: flex-end;
2248
+ padding: 5px;
2249
+ cursor: pointer;
2291
2250
  }
2292
2251
 
2293
2252
  .style-custom-main-three-one {
2294
- display: flex;
2295
- overflow: scroll;
2296
- width: 100%;
2297
- border: 1px dashed #d9d9d9;
2298
- background-color: #f6f7f9;
2253
+ display: flex;
2254
+ overflow: scroll;
2255
+ width: 100%;
2256
+ border: 1px dashed #d9d9d9;
2257
+ background-color: #f6f7f9;
2299
2258
 
2300
- .style-custom-content-one {
2301
- border-right: 1px dashed #d9d9d9;
2302
- }
2259
+ .style-custom-content-one {
2260
+ border-right: 1px dashed #d9d9d9;
2261
+ }
2303
2262
 
2304
- .style-custom-box-three-two {
2305
- display: flex;
2306
- border-bottom: 1px dashed #d9d9d9;
2307
- }
2263
+ .style-custom-box-three-two {
2264
+ display: flex;
2265
+ border-bottom: 1px dashed #d9d9d9;
2266
+ }
2308
2267
  }
2309
2268
 
2310
2269
  .style-custom-main-three-two {
2311
- display: flex;
2312
- overflow: scroll;
2313
- width: 100%;
2314
- border: 1px dashed #d9d9d9;
2315
- background-color: #f6f7f9;
2270
+ display: flex;
2271
+ overflow: scroll;
2272
+ width: 100%;
2273
+ border: 1px dashed #d9d9d9;
2274
+ background-color: #f6f7f9;
2316
2275
 
2317
- .style-custom-content-one {
2318
- border-right: 1px dashed #d9d9d9;
2319
- }
2276
+ .style-custom-content-one {
2277
+ border-right: 1px dashed #d9d9d9;
2278
+ }
2320
2279
 
2321
- .style-custom-box-three {
2322
- display: flex;
2323
- }
2280
+ .style-custom-box-three {
2281
+ display: flex;
2282
+ }
2324
2283
 
2325
- .style-custom-content-two {
2326
- border-bottom: 1px dashed #d9d9d9;
2327
- }
2284
+ .style-custom-content-two {
2285
+ border-bottom: 1px dashed #d9d9d9;
2286
+ }
2328
2287
 
2329
- .style-custom-content-three {
2330
- border-right: 1px dashed #d9d9d9;
2331
- }
2288
+ .style-custom-content-three {
2289
+ border-right: 1px dashed #d9d9d9;
2290
+ }
2332
2291
  }
2333
2292
 
2334
2293
  .style-custom-main-three-four {
2335
- display: flex;
2336
- overflow: scroll;
2337
- width: 100%;
2338
- border: 1px dashed #d9d9d9;
2339
- background-color: #f6f7f9;
2294
+ display: flex;
2295
+ overflow: scroll;
2296
+ width: 100%;
2297
+ border: 1px dashed #d9d9d9;
2298
+ background-color: #f6f7f9;
2340
2299
 
2341
- .style-custom-box-one {
2342
- border-right: 1px dashed #d9d9d9;
2343
- }
2300
+ .style-custom-box-one {
2301
+ border-right: 1px dashed #d9d9d9;
2302
+ }
2344
2303
 
2345
- .style-custom-content-two {
2346
- border-right: 1px dashed #d9d9d9;
2347
- }
2304
+ .style-custom-content-two {
2305
+ border-right: 1px dashed #d9d9d9;
2306
+ }
2348
2307
 
2349
- .style-custom-content-one {
2350
- border-bottom: 1px dashed #d9d9d9;
2351
- }
2308
+ .style-custom-content-one {
2309
+ border-bottom: 1px dashed #d9d9d9;
2310
+ }
2352
2311
 
2353
- .style-custom-box-two {
2354
- display: flex;
2355
- }
2312
+ .style-custom-box-two {
2313
+ display: flex;
2314
+ }
2356
2315
  }
2357
2316
 
2358
2317
  .style-custom-main-three-three {
2359
- display: flex;
2360
- overflow: scroll;
2361
- width: 100%;
2362
- border: 1px dashed #d9d9d9;
2363
- background-color: #f6f7f9;
2364
-
2365
- .style-custom-content-one {
2366
2318
  display: flex;
2367
- }
2319
+ overflow: scroll;
2320
+ width: 100%;
2321
+ border: 1px dashed #d9d9d9;
2322
+ background-color: #f6f7f9;
2368
2323
 
2369
- .style-custom-box-one {
2370
- border-right: 1px dashed #d9d9d9;
2371
- }
2324
+ .style-custom-content-one {
2325
+ display: flex;
2326
+ }
2372
2327
 
2373
- .style-custom-content-two {
2374
- border-left: 1px dashed #d9d9d9;
2375
- }
2328
+ .style-custom-box-one {
2329
+ border-right: 1px dashed #d9d9d9;
2330
+ }
2376
2331
 
2377
- .style-custom-content-box-one {
2378
- border-bottom: 1px dashed #d9d9d9;
2379
- display: flex;
2380
- }
2332
+ .style-custom-content-two {
2333
+ border-left: 1px dashed #d9d9d9;
2334
+ }
2335
+
2336
+ .style-custom-content-box-one {
2337
+ border-bottom: 1px dashed #d9d9d9;
2338
+ display: flex;
2339
+ }
2381
2340
  }
2382
2341
 
2383
2342
  .frame-box-row-two {
2384
- .frame-content-row-two {
2385
- border-top: 1px dashed #d9d9d9;
2386
- }
2343
+ .frame-content-row-two {
2344
+ border-top: 1px dashed #d9d9d9;
2345
+ }
2387
2346
  }
2388
2347
 
2389
-
2390
2348
  .pipeline-list {
2391
- background-color: #efefef;
2392
- padding: 2px 10px 8px 10px;
2393
- width: 100%;
2349
+ background-color: #efefef;
2350
+ padding: 2px 10px 8px 10px;
2351
+ width: 100%;
2394
2352
  }
2395
2353
 
2396
2354
  .pipeline-list-child {
2397
- background-color: #efefef;
2398
- padding: 2px 10px 8px 10px;
2399
- width: 100%;
2355
+ background-color: #efefef;
2356
+ padding: 2px 10px 8px 10px;
2357
+ width: 100%;
2400
2358
  }
2401
2359
 
2402
2360
  .pipeline-item {
2403
- margin: 10px 0px;
2404
- min-height: 60px;
2405
- background-color: white;
2406
- border-bottom: 1px solid @border-color-split;
2407
- display: flex;
2408
- border-radius: 5px;
2409
- cursor: pointer;
2410
- overflow-x: hidden;
2411
- position: relative;
2361
+ margin: 10px 0px;
2362
+ min-height: 60px;
2363
+ background-color: white;
2364
+ border-bottom: 1px solid @border-color-split;
2365
+ display: flex;
2366
+ border-radius: 5px;
2367
+ cursor: pointer;
2368
+ overflow-x: hidden;
2369
+ position: relative;
2412
2370
 
2413
- &.active {
2414
- background-color: fade(@system-yellow-color, 50%);
2415
- }
2371
+ &.active {
2372
+ background-color: fade(@system-yellow-color, 50%);
2373
+ }
2416
2374
  }
2417
2375
 
2418
2376
  .modal-component-layout-edit-widget {
2419
- .modal-setting-advance-select {
2420
- .ant-form-item-has-success {
2421
- display: contents !important;
2377
+ .modal-setting-advance-select {
2378
+ .ant-form-item-has-success {
2379
+ display: contents !important;
2380
+ }
2422
2381
  }
2423
- }
2424
2382
  }
2425
2383
 
2426
2384
  .component-container-body-share {
2427
- max-height: 280px;
2428
- overflow: scroll;
2385
+ max-height: 280px;
2386
+ overflow: scroll;
2429
2387
  }
2430
2388
 
2431
2389
  .wigeta-content-row {
2432
-
2433
2390
  }
2434
2391
 
2435
2392
  .wigeta-rows-layout-main {
2436
- // border: 1px dashed #d9d9d9;
2437
- overflow: scroll;
2438
- width: 100%;
2439
- background-color: #fff;
2440
- border-radius: 5px;
2393
+ // border: 1px dashed #d9d9d9;
2394
+ overflow: scroll;
2395
+ width: 100%;
2396
+ background-color: #fff;
2397
+ border-radius: 5px;
2441
2398
  }
2442
2399
 
2443
2400
  .wigeta-layout-main {
2444
- display: grid;
2445
- width: 100%;
2446
- min-height: 40px;
2447
- // border-radius: 5px;
2448
- // border: 1px solid #fff;
2401
+ display: grid;
2402
+ width: 100%;
2403
+ min-height: 40px;
2404
+ // border-radius: 5px;
2405
+ // border: 1px solid #fff;
2449
2406
  }
2450
2407
 
2451
-
2452
2408
  .layout-icon-setting-widgets-columns {
2453
2409
  display: flex;
2454
2410
  position: absolute;
@@ -2458,58 +2414,58 @@
2458
2414
  }
2459
2415
 
2460
2416
  .layout-icon-setting-widgets-columns {
2461
- display: none;
2417
+ display: none;
2462
2418
  }
2463
2419
 
2464
2420
  .layout-icon-setting-widgets-icon {
2465
- display: none;
2421
+ display: none;
2466
2422
  }
2467
2423
 
2468
2424
  .layout-block {
2469
- &:hover {
2470
- .layout-icon-setting-widgets-icon {
2471
- display: flex;
2472
- position: absolute;
2473
- top: 1px;
2474
- right: 0px;
2475
- z-index: 9;
2476
- }
2477
- }
2478
- }
2479
-
2480
- .main-content-margin {
2481
- display: flex;
2425
+ &:hover {
2426
+ .layout-icon-setting-widgets-icon {
2427
+ display: flex;
2428
+ position: absolute;
2429
+ top: 1px;
2430
+ right: 0px;
2431
+ z-index: 9;
2432
+ }
2433
+ }
2434
+ }
2435
+
2436
+ .main-content-margin {
2437
+ display: flex;
2482
2438
  width: 350px;
2483
2439
 
2484
2440
  .ant-form-item {
2485
- margin-bottom: 0px;
2441
+ margin-bottom: 0px;
2486
2442
 
2487
- .ant-form-item-control-input {
2488
- min-height: unset;
2489
- }
2443
+ .ant-form-item-control-input {
2444
+ min-height: unset;
2445
+ }
2490
2446
  }
2491
- }
2447
+ }
2492
2448
 
2493
- .box-content-margin {
2449
+ .box-content-margin {
2494
2450
  width: 80px;
2495
2451
  padding-top: 5px;
2496
2452
  padding-bottom: 5px;
2497
2453
  align-items: center;
2498
2454
  display: flex;
2499
2455
  justify-content: center;
2500
- }
2456
+ }
2501
2457
 
2502
- .box-content-margin {
2458
+ .box-content-margin {
2503
2459
  padding-top: 0px;
2504
2460
  padding-bottom: 0px;
2505
- width: 70px;
2461
+ width: 70px;
2506
2462
  .input-margin {
2507
- border: unset !important;
2508
- box-shadow: unset !important;
2509
- }
2510
- }
2463
+ border: unset !important;
2464
+ box-shadow: unset !important;
2465
+ }
2466
+ }
2511
2467
 
2512
- .box-content-margin-type {
2468
+ .box-content-margin-type {
2513
2469
  width: 50px;
2514
2470
  background-color: rgb(238, 237, 237);
2515
2471
  border-top-right-radius: 5px;
@@ -2520,116 +2476,132 @@
2520
2476
  height: 32px;
2521
2477
  display: flex;
2522
2478
  align-items: center;
2523
- justify-content: center;
2524
- }
2479
+ justify-content: center;
2480
+ }
2525
2481
 
2526
- .margin-border-one {
2482
+ .margin-border-one {
2527
2483
  border-top-left-radius: 5px;
2528
2484
  border-bottom-left-radius: 5px;
2529
2485
  border-top: 1px solid #e0dcdc;
2530
2486
  border-left: 1px solid #e0dcdc;
2531
2487
  border-bottom: 1px solid #e0dcdc;
2532
- }
2488
+ }
2533
2489
 
2534
- .margin-border-two {
2490
+ .margin-border-two {
2535
2491
  border-top: 1px solid #e0dcdc;
2536
2492
  border-left: 1px solid #e0dcdc;
2537
2493
  border-bottom: 1px solid #e0dcdc;
2538
- }
2494
+ }
2539
2495
 
2540
- .margin-test {
2496
+ .margin-test {
2541
2497
  display: flex;
2542
2498
  align-items: center;
2543
2499
  justify-content: center;
2544
2500
  // justify-items: center;
2545
2501
  color: #c4c4c4;
2546
2502
  font-size: 10px;
2547
- }
2503
+ }
2548
2504
 
2549
- .margin-border-right {
2550
- border-right: 1px solid #e0dcdc ;
2551
- }
2505
+ .margin-border-right {
2506
+ border-right: 1px solid #e0dcdc;
2507
+ }
2552
2508
 
2553
- .layout-icon-setting-widgets-icons {
2554
- display: none;
2555
- }
2509
+ .layout-icon-setting-widgets-icons {
2510
+ display: none;
2511
+ }
2556
2512
 
2557
- .layout-icon-setting-widgets-icons-columns {
2558
- display: none;
2559
- }
2513
+ .layout-icon-setting-widgets-icons-columns {
2514
+ display: none;
2515
+ }
2560
2516
 
2561
- .wigeta-layout-block-item:hover>.block-item>.layout-icon-setting-widgets-icons {
2517
+ .wigeta-layout-block-item:hover
2518
+ > .block-item
2519
+ > .layout-icon-setting-widgets-icons {
2562
2520
  display: block;
2563
2521
  .setting-widgets-icons {
2564
- display: flex;
2565
- padding: 0 5px;
2566
- position: absolute;
2567
- right: 2px;
2568
- top: -21px;
2569
- transform-origin: 0 0;
2570
- transition: 0.1s ease-in-out;
2571
- z-index: 9;
2572
- }
2573
- }
2574
-
2575
- .wigeta-layout-block-item:hover>.block-item>.layout-icon-setting-widgets-icons-columns {
2522
+ display: flex;
2523
+ padding: 0 5px;
2524
+ position: absolute;
2525
+ right: 2px;
2526
+ top: -21px;
2527
+ transform-origin: 0 0;
2528
+ transition: 0.1s ease-in-out;
2529
+ z-index: 9;
2530
+ }
2531
+ }
2532
+
2533
+ .wigeta-layout-block-item:hover
2534
+ > .block-item
2535
+ > .layout-icon-setting-widgets-icons-columns {
2576
2536
  display: block;
2577
2537
  .setting-widgets-icons {
2578
- display: flex;
2579
- padding: 0 5px;
2580
- position: absolute;
2581
- right: 2px;
2582
- top:-20px;
2583
- transform-origin: 0 0;
2584
- transition: 0.1s ease-in-out;
2585
- z-index: 9;
2586
- }
2587
- }
2588
-
2589
- .wigeta-layout-block-item:hover>.block-item {
2590
- background-color: rgb(212,234,255)
2591
- }
2592
-
2593
- .wigeta-layout-block-item:hover>.block-item>.wigeta-item>div>.wigeta-layout-main {
2594
- border : unset;
2595
- }
2596
-
2597
- .wigeta-layout-block-item:has(.wigeta-layout-block-item:hover)>.block-item>div>.wigeta-item>.wigeta-layout-main {
2598
- border: 1px solid #fff;
2599
- }
2600
-
2601
- .wigeta-layout-block-item:has(.wigeta-layout-block-item:hover)>.block-item{
2602
- background-color: #fff;
2603
- }
2604
-
2605
- .wigeta-layout-block-item:has(.wigeta-layout-block-item:hover)>.block-item>.layout-icon-setting-widgets-icons {
2538
+ display: flex;
2539
+ padding: 0 5px;
2540
+ position: absolute;
2541
+ right: 2px;
2542
+ top: -20px;
2543
+ transform-origin: 0 0;
2544
+ transition: 0.1s ease-in-out;
2545
+ z-index: 9;
2546
+ }
2547
+ }
2548
+
2549
+ .wigeta-layout-block-item:hover > .block-item {
2550
+ background-color: rgb(212, 234, 255);
2551
+ }
2552
+
2553
+ .wigeta-layout-block-item:hover
2554
+ > .block-item
2555
+ > .wigeta-item
2556
+ > div
2557
+ > .wigeta-layout-main {
2558
+ border: unset;
2559
+ }
2560
+
2561
+ .wigeta-layout-block-item:has(.wigeta-layout-block-item:hover)
2562
+ > .block-item
2563
+ > div
2564
+ > .wigeta-item
2565
+ > .wigeta-layout-main {
2566
+ border: 1px solid #fff;
2567
+ }
2568
+
2569
+ .wigeta-layout-block-item:has(.wigeta-layout-block-item:hover) > .block-item {
2570
+ background-color: #fff;
2571
+ }
2572
+
2573
+ .wigeta-layout-block-item:has(.wigeta-layout-block-item:hover)
2574
+ > .block-item
2575
+ > .layout-icon-setting-widgets-icons {
2606
2576
  display: none;
2607
- }
2577
+ }
2608
2578
 
2609
- .wigeta-layout-block-item:has(.wigeta-layout-block-item:hover)>.block-item>.layout-icon-setting-widgets-icons-columns {
2579
+ .wigeta-layout-block-item:has(.wigeta-layout-block-item:hover)
2580
+ > .block-item
2581
+ > .layout-icon-setting-widgets-icons-columns {
2610
2582
  display: none;
2611
- }
2612
-
2613
- .setting-widgets-icons {
2614
- display: flex;
2615
- padding: 0 5px;
2583
+ }
2584
+
2585
+ .setting-widgets-icons {
2586
+ display: flex;
2587
+ padding: 0 5px;
2616
2588
  position: absolute;
2617
2589
  right: 10px;
2618
- top: -20px;
2619
- transform-origin: 0 0;
2620
- transition: 0.1s ease-in-out;
2590
+ top: -20px;
2591
+ transform-origin: 0 0;
2592
+ transition: 0.1s ease-in-out;
2621
2593
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
2622
2594
  z-index: 9;
2623
2595
 
2624
- .icon-edit {
2625
- padding-top: 0px !important;
2596
+ .icon-edit {
2597
+ padding-top: 0px !important;
2626
2598
  }
2627
- .icon-remove{
2628
- padding-top: 0px !important;
2629
- }
2630
- }
2599
+ .icon-remove {
2600
+ padding-top: 0px !important;
2601
+ }
2602
+ }
2631
2603
 
2632
- .wigeta-layout-block-item {
2604
+ .wigeta-layout-block-item {
2633
2605
  position: relative;
2634
2606
  margin: 10px 5px;
2635
2607
  display: flex;
@@ -2637,35 +2609,67 @@
2637
2609
  background-color: #fff;
2638
2610
 
2639
2611
  .block-item {
2640
- display: flex;
2641
- border: 1px dashed #f2f2f2;
2642
-
2643
- .wigeta-item {
2644
- width: 100%;
2645
- display: grid;
2646
- }
2647
-
2648
- .icon-edit {
2649
- cursor: pointer;
2650
- padding-right: 5px;
2651
- padding-top: 5px;
2652
- color: @border-color-base;
2612
+ display: flex;
2613
+ border: 1px dashed #f2f2f2;
2653
2614
 
2654
- &:hover {
2655
- color: @text-color;
2615
+ .wigeta-item {
2616
+ width: 100%;
2617
+ display: grid;
2656
2618
  }
2657
- }
2658
2619
 
2659
- .icon-remove {
2660
- cursor: pointer;
2661
- padding-right: 5px;
2662
- padding-top: 5px;
2663
- color: @border-color-base;
2620
+ .icon-edit {
2621
+ cursor: pointer;
2622
+ padding-right: 5px;
2623
+ padding-top: 5px;
2624
+ color: @border-color-base;
2664
2625
 
2665
- &:hover {
2666
- color: @text-color;
2626
+ &:hover {
2627
+ color: @text-color;
2628
+ }
2629
+ }
2630
+
2631
+ .icon-remove {
2632
+ cursor: pointer;
2633
+ padding-right: 5px;
2634
+ padding-top: 5px;
2635
+ color: @border-color-base;
2636
+
2637
+ &:hover {
2638
+ color: @text-color;
2639
+ }
2667
2640
  }
2668
- }
2669
2641
  }
2670
-
2671
- }
2642
+ }
2643
+
2644
+ .module-item {
2645
+ border: 2px solid transparent !important;
2646
+ border-radius: 8px;
2647
+ }
2648
+
2649
+ .module-item:hover {
2650
+ border: 2px solid @table-row-hover-bg !important;
2651
+ border-radius: 8px;
2652
+ cursor: pointer;
2653
+ }
2654
+
2655
+ .grid-module {
2656
+ display: grid;
2657
+ grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
2658
+ grid-auto-rows: 1fr;
2659
+ }
2660
+
2661
+ .grid-module::before {
2662
+ content: "";
2663
+ width: 0;
2664
+ padding-bottom: 100%;
2665
+ grid-row: 1 / 1;
2666
+ grid-column: 1 / 1;
2667
+ }
2668
+
2669
+ .grid-module > *:first-child {
2670
+ grid-row: 1 / 1;
2671
+ grid-column: 1 / 1;
2672
+ }
2673
+ .grid-module > * {
2674
+ margin-right: 5px;
2675
+ }