@appscode/design-system 1.1.0-beta.2 → 1.1.0-beta.3
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.
- package/base/_video-player.scss +65 -0
- package/base/utilities/_all.scss +5 -4
- package/base/utilities/_colors.scss +446 -0
- package/base/utilities/_customize-bulma.scss +23 -27
- package/base/utilities/_extended.scss +3 -2
- package/base/utilities/{_default.scss → _global.scss} +146 -298
- package/base/utilities/_layouts.scss +157 -0
- package/base/utilities/_spacing.scss +96 -0
- package/base/utilities/_typography.scss +34 -2
- package/components/_ac-accordion.scss +117 -117
- package/components/_ac-alert-box.scss +205 -262
- package/components/_ac-card.scss +72 -80
- package/components/_ac-input.scss +0 -482
- package/components/_ac-modal.scss +212 -212
- package/components/_ac-multi-select.scss +83 -54
- package/components/_ac-options.scss +122 -122
- package/components/_ac-table.scss +503 -502
- package/components/_ac-tabs.scss +4 -3
- package/components/_ac-tags.scss +116 -116
- package/components/_ac-terminal.scss +275 -231
- package/components/_all.scss +31 -28
- package/components/_app-drawer.scss +0 -134
- package/components/_breadcumb.scss +0 -71
- package/components/_buttons.scss +779 -779
- package/components/_dashboard-header.scss +0 -115
- package/components/_left-sidebar-menu.scss +346 -475
- package/components/_navbar.scss +786 -752
- package/components/_pagination.scss +9 -27
- package/components/_payment-card.scss +1 -1
- package/components/_widget-menu.scss +247 -247
- package/components/ui-builder/_ui-builder.scss +1 -1
- package/components/ui-builder/_vue-open-api.scss +512 -0
- package/main.scss +26 -10
- package/package.json +1 -1
- package/vue-components/v2/card/Card.vue +1 -1
- package/vue-components/v3/cards/Card.vue +1 -1
- package/vue-components/v3/cards/Vendor.vue +1 -1
- package/vue-components/v3/footer/FooterItem.vue +4 -1
- package/vue-components/v3/sidebar/Sidebar.vue +2 -2
- package/base/utilities/_derived-variables.scss +0 -24
- package/base/utilities/_initial-variables.scss +0 -217
- package/components/_basic-card.scss +0 -118
|
@@ -1,152 +1,39 @@
|
|
|
1
|
-
//
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
&.is-fullwidth {
|
|
9
|
-
grid-template-columns: auto !important;
|
|
10
|
-
|
|
11
|
-
&.has-info-content {
|
|
12
|
-
grid-template-columns: 270px calc(100% - 540px) 270px;
|
|
13
|
-
}
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
&.has-info-content {
|
|
17
|
-
grid-template-columns: 270px calc(100% - 540px) 270px;
|
|
18
|
-
|
|
19
|
-
.ac-system-content {
|
|
20
|
-
&.pr-15 {
|
|
21
|
-
padding-right: 0 !important;
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
&.in-ui-builder {
|
|
27
|
-
grid-template-columns: calc(100% - 270px) 270px !important;
|
|
28
|
-
}
|
|
29
|
-
|
|
30
|
-
&.has-ui-builder {
|
|
31
|
-
grid-template-columns: 70px calc(100% - 70px);
|
|
32
|
-
grid-gap: 0;
|
|
33
|
-
|
|
34
|
-
.inner-header {
|
|
35
|
-
position: sticky;
|
|
36
|
-
top: 100px;
|
|
37
|
-
background-color: $white-100;
|
|
38
|
-
z-index: 997;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
.ac-system-content {
|
|
42
|
-
&.pr-15 {
|
|
43
|
-
padding-right: 0 !important;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
.ac-terminal {
|
|
47
|
-
width: calc(100% - 290px);
|
|
48
|
-
left: 289px;
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
|
|
52
|
-
.ac-system-left-sidebar.is-expanded {
|
|
53
|
-
z-index: 998;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
&.expanded-sidebar {
|
|
57
|
-
grid-gap: 0px;
|
|
58
|
-
z-index: 9;
|
|
59
|
-
grid-template-columns: 270px calc(100% - 270px);
|
|
60
|
-
|
|
61
|
-
.is-fullwidth {
|
|
62
|
-
.ac-system-content {
|
|
63
|
-
padding-left: 0;
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
.is-fullwidth {
|
|
69
|
-
grid-template-columns: auto;
|
|
70
|
-
|
|
71
|
-
&.has-info-content {
|
|
72
|
-
grid-template-columns: calc(100% - 260px) 240px;
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
.ac-system-content {
|
|
76
|
-
padding-left: 20px;
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
.ac-system-body {
|
|
81
|
-
padding-top: 0;
|
|
82
|
-
grid-template-columns: 220px calc(100% - 440px) 220px;
|
|
83
|
-
|
|
84
|
-
.ac-system-left-sidebar {
|
|
85
|
-
border-right: none !important;
|
|
86
|
-
height: calc(100vh - 60px);
|
|
87
|
-
|
|
88
|
-
.ac-left-sidebar-wrapper {
|
|
89
|
-
position: fixed;
|
|
90
|
-
top: 140px;
|
|
91
|
-
width: 219px;
|
|
92
|
-
border-right: 1px solid $primary-90;
|
|
93
|
-
height: 100%;
|
|
1
|
+
// border left, right, top, bottom none
|
|
2
|
+
$positions: (
|
|
3
|
+
"b": "bottom",
|
|
4
|
+
"t": "top",
|
|
5
|
+
"l": "left",
|
|
6
|
+
"r": "right",
|
|
7
|
+
);
|
|
94
8
|
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
}
|
|
99
|
-
}
|
|
100
|
-
}
|
|
9
|
+
@each $key, $position in $positions {
|
|
10
|
+
.b-#{$key}-n {
|
|
11
|
+
border-#{$position}: none !important;
|
|
101
12
|
}
|
|
13
|
+
}
|
|
102
14
|
|
|
103
|
-
|
|
104
|
-
|
|
15
|
+
// border position 1px
|
|
16
|
+
@each $key, $position in $positions {
|
|
17
|
+
.b-#{$key}-1 {
|
|
18
|
+
border-#{$position}: 1px solid $primary-90;
|
|
105
19
|
}
|
|
20
|
+
}
|
|
106
21
|
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
&.is-expanded {
|
|
112
|
-
z-index: 998;
|
|
113
|
-
|
|
114
|
-
.ac-product-logo {
|
|
115
|
-
width: 270px !important;
|
|
116
|
-
justify-content: flex-start !important;
|
|
117
|
-
}
|
|
118
|
-
|
|
119
|
-
.menu-list {
|
|
120
|
-
box-shadow: 2px -1px 8px rgba(26, 80, 151, 0.16);
|
|
121
|
-
|
|
122
|
-
&.ac-menu-list {
|
|
123
|
-
width: 270px !important;
|
|
124
|
-
background-color: $white-100;
|
|
125
|
-
|
|
126
|
-
li {
|
|
127
|
-
a {
|
|
128
|
-
strong {
|
|
129
|
-
display: block !important;
|
|
130
|
-
}
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
ul {
|
|
134
|
-
li {
|
|
135
|
-
a {
|
|
136
|
-
padding-left: 50px !important;
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
}
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
}
|
|
144
|
-
}
|
|
22
|
+
// border 1px
|
|
23
|
+
.b-1 {
|
|
24
|
+
border: 1px solid $primary-90;
|
|
145
25
|
}
|
|
146
26
|
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
27
|
+
// for ellipsis
|
|
28
|
+
@for $i from 0 through 10 {
|
|
29
|
+
.is-ellipsis-#{$i} {
|
|
30
|
+
overflow: hidden;
|
|
31
|
+
text-overflow: ellipsis;
|
|
32
|
+
display: -webkit-box;
|
|
33
|
+
line-clamp: #{$i};
|
|
34
|
+
-webkit-line-clamp: #{$i};
|
|
35
|
+
box-orient: vertical;
|
|
36
|
+
-webkit-box-orient: vertical;
|
|
150
37
|
}
|
|
151
38
|
}
|
|
152
39
|
|
|
@@ -154,9 +41,9 @@
|
|
|
154
41
|
width: 720px;
|
|
155
42
|
}
|
|
156
43
|
|
|
157
|
-
.dropdown-content {
|
|
158
|
-
|
|
159
|
-
}
|
|
44
|
+
// .dropdown-content {
|
|
45
|
+
// background-color: $white-100;
|
|
46
|
+
// }
|
|
160
47
|
|
|
161
48
|
// color swatch start
|
|
162
49
|
input[type="color"] {
|
|
@@ -188,31 +75,31 @@ input[type="color"]::-moz-color-swatch {
|
|
|
188
75
|
|
|
189
76
|
// color swatch end
|
|
190
77
|
|
|
191
|
-
.is-dark-theme {
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
}
|
|
78
|
+
// .is-dark-theme {
|
|
79
|
+
// .dropdown-content {
|
|
80
|
+
// background-color: $dark-bg-light;
|
|
81
|
+
// }
|
|
82
|
+
// }
|
|
196
83
|
|
|
197
|
-
.ac-preloader {
|
|
198
|
-
|
|
199
|
-
}
|
|
84
|
+
// .ac-preloader {
|
|
85
|
+
// color: $primary-10;
|
|
86
|
+
// }
|
|
200
87
|
|
|
201
|
-
.section-padding {
|
|
202
|
-
|
|
203
|
-
}
|
|
88
|
+
// .section-padding {
|
|
89
|
+
// padding: 100px 0;
|
|
90
|
+
// }
|
|
204
91
|
|
|
205
|
-
.section-padding-60 {
|
|
206
|
-
|
|
207
|
-
}
|
|
92
|
+
// .section-padding-60 {
|
|
93
|
+
// padding: 60px 0;
|
|
94
|
+
// }
|
|
208
95
|
|
|
209
|
-
.short-section-padding {
|
|
210
|
-
|
|
211
|
-
}
|
|
96
|
+
// .short-section-padding {
|
|
97
|
+
// padding: 50px 0;
|
|
98
|
+
// }
|
|
212
99
|
|
|
213
|
-
.section-divider {
|
|
214
|
-
|
|
215
|
-
}
|
|
100
|
+
// .section-divider {
|
|
101
|
+
// background-color: $primary-90;
|
|
102
|
+
// }
|
|
216
103
|
|
|
217
104
|
.is-auto-hight {
|
|
218
105
|
height: auto !important;
|
|
@@ -237,44 +124,6 @@ input[type="color"]::-moz-color-swatch {
|
|
|
237
124
|
border: none !important;
|
|
238
125
|
}
|
|
239
126
|
|
|
240
|
-
.b-1 {
|
|
241
|
-
border: 1px solid $primary-90;
|
|
242
|
-
}
|
|
243
|
-
|
|
244
|
-
// border left, right, top, bottom none
|
|
245
|
-
$positions: (
|
|
246
|
-
"b": "bottom",
|
|
247
|
-
"t": "top",
|
|
248
|
-
"l": "left",
|
|
249
|
-
"r": "right",
|
|
250
|
-
);
|
|
251
|
-
|
|
252
|
-
@each $key, $position in $positions {
|
|
253
|
-
.b-#{$key}-n {
|
|
254
|
-
border-#{$position}: none !important;
|
|
255
|
-
}
|
|
256
|
-
}
|
|
257
|
-
|
|
258
|
-
// border 1px
|
|
259
|
-
@each $key, $position in $positions {
|
|
260
|
-
.b-#{$key}-1 {
|
|
261
|
-
border-#{$position}: 1px solid $primary-90;
|
|
262
|
-
}
|
|
263
|
-
}
|
|
264
|
-
|
|
265
|
-
// for ellipsis
|
|
266
|
-
@for $i from 0 through 10 {
|
|
267
|
-
.is-ellipsis-#{$i} {
|
|
268
|
-
overflow: hidden;
|
|
269
|
-
text-overflow: ellipsis;
|
|
270
|
-
display: -webkit-box;
|
|
271
|
-
line-clamp: #{$i};
|
|
272
|
-
-webkit-line-clamp: #{$i};
|
|
273
|
-
box-orient: vertical;
|
|
274
|
-
-webkit-box-orient: vertical;
|
|
275
|
-
}
|
|
276
|
-
}
|
|
277
|
-
|
|
278
127
|
.is-disabled {
|
|
279
128
|
opacity: 0.5;
|
|
280
129
|
cursor: not-allowed;
|
|
@@ -315,17 +164,17 @@ $positions: (
|
|
|
315
164
|
vertical-align: middle;
|
|
316
165
|
}
|
|
317
166
|
|
|
318
|
-
.is-flex-start {
|
|
319
|
-
|
|
320
|
-
}
|
|
167
|
+
// .is-flex-start {
|
|
168
|
+
// justify-content: flex-start !important;
|
|
169
|
+
// }
|
|
321
170
|
|
|
322
|
-
.is-flex-center {
|
|
323
|
-
|
|
324
|
-
}
|
|
171
|
+
// .is-flex-center {
|
|
172
|
+
// justify-content: center !important;
|
|
173
|
+
// }
|
|
325
174
|
|
|
326
|
-
.is-flex-end {
|
|
327
|
-
|
|
328
|
-
}
|
|
175
|
+
// .is-flex-end {
|
|
176
|
+
// justify-content: flex-end;
|
|
177
|
+
// }
|
|
329
178
|
|
|
330
179
|
.ac-vcentered {
|
|
331
180
|
display: flex;
|
|
@@ -466,7 +315,6 @@ $positions: (
|
|
|
466
315
|
}
|
|
467
316
|
}
|
|
468
317
|
|
|
469
|
-
// flex end
|
|
470
318
|
.is-transparent-bg {
|
|
471
319
|
background-color: transparent !important;
|
|
472
320
|
}
|
|
@@ -510,9 +358,9 @@ code {
|
|
|
510
358
|
color: $danger !important;
|
|
511
359
|
}
|
|
512
360
|
|
|
513
|
-
.responsive-only {
|
|
514
|
-
|
|
515
|
-
}
|
|
361
|
+
// .responsive-only {
|
|
362
|
+
// display: none;
|
|
363
|
+
// }
|
|
516
364
|
|
|
517
365
|
button {
|
|
518
366
|
&:focus {
|
|
@@ -522,44 +370,44 @@ button {
|
|
|
522
370
|
}
|
|
523
371
|
|
|
524
372
|
// line title global start
|
|
525
|
-
.ac-line-title {
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
}
|
|
373
|
+
// .ac-line-title {
|
|
374
|
+
// position: relative;
|
|
375
|
+
// z-index: 1;
|
|
376
|
+
// margin-bottom: 10px;
|
|
377
|
+
|
|
378
|
+
// &:after {
|
|
379
|
+
// position: absolute;
|
|
380
|
+
// content: "";
|
|
381
|
+
// left: 0;
|
|
382
|
+
// top: 12px;
|
|
383
|
+
// width: 100%;
|
|
384
|
+
// height: 1px;
|
|
385
|
+
// background-color: $primary-90;
|
|
386
|
+
// }
|
|
387
|
+
|
|
388
|
+
// h5 {
|
|
389
|
+
// color: $primary-10;
|
|
390
|
+
// background-color: $white-100;
|
|
391
|
+
// z-index: 2;
|
|
392
|
+
// display: inline-block;
|
|
393
|
+
// position: relative;
|
|
394
|
+
// padding-right: 5px;
|
|
395
|
+
// font-family: "roboto";
|
|
396
|
+
// }
|
|
397
|
+
// }
|
|
550
398
|
|
|
551
399
|
// line title global end
|
|
552
400
|
// docs preview start
|
|
553
|
-
.docs-preview {
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
}
|
|
401
|
+
// .docs-preview {
|
|
402
|
+
// pre {
|
|
403
|
+
// margin: 0;
|
|
404
|
+
// display: inline-flex;
|
|
405
|
+
// align-items: center;
|
|
406
|
+
// font-size: 12px;
|
|
407
|
+
// font-weight: 600;
|
|
408
|
+
// padding: 2px 5px;
|
|
409
|
+
// }
|
|
410
|
+
// }
|
|
563
411
|
|
|
564
412
|
// docs preview end
|
|
565
413
|
// background color start
|
|
@@ -837,29 +685,29 @@ $border_color_4: transparent transparent #585d6e transparent;
|
|
|
837
685
|
// Customize tooltip end
|
|
838
686
|
|
|
839
687
|
// ac-footer sticky start
|
|
840
|
-
.ac-footer-action {
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
}
|
|
688
|
+
// .ac-footer-action {
|
|
689
|
+
// margin-top: 10px;
|
|
690
|
+
// padding-top: 10px;
|
|
691
|
+
// background-color: $white-100;
|
|
692
|
+
// padding: 10px 20px;
|
|
693
|
+
// margin-left: 0;
|
|
694
|
+
// margin-right: 0;
|
|
695
|
+
// margin-left: -20px;
|
|
696
|
+
// border: none;
|
|
697
|
+
// border-radius: 0;
|
|
698
|
+
// border-top: 1px solid $primary-90;
|
|
699
|
+
|
|
700
|
+
// &.is-sticky {
|
|
701
|
+
// position: sticky;
|
|
702
|
+
// bottom: 0;
|
|
703
|
+
// width: calc(100% + 20px);
|
|
704
|
+
// margin-bottom: -4px;
|
|
705
|
+
// z-index: 999;
|
|
706
|
+
// border: none;
|
|
707
|
+
// border-top: 1px solid $primary-90;
|
|
708
|
+
// box-shadow: none;
|
|
709
|
+
// }
|
|
710
|
+
// }
|
|
863
711
|
|
|
864
712
|
// status css
|
|
865
713
|
.status {
|
|
@@ -897,20 +745,20 @@ Responsive Classes
|
|
|
897
745
|
|
|
898
746
|
// Extra small devices (portrait phones, less than 576px)
|
|
899
747
|
@media (max-width: 575.98px) {
|
|
900
|
-
.responsive-only {
|
|
901
|
-
|
|
902
|
-
}
|
|
748
|
+
// .responsive-only {
|
|
749
|
+
// display: block;
|
|
750
|
+
// }
|
|
903
751
|
|
|
904
|
-
.ac-system-body {
|
|
905
|
-
|
|
906
|
-
|
|
752
|
+
// .ac-system-body {
|
|
753
|
+
// grid-gap: 15px;
|
|
754
|
+
// grid-template-columns: 70px calc(100% - 100px);
|
|
907
755
|
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
}
|
|
756
|
+
// .ac-system-content {
|
|
757
|
+
// &.mr-20 {
|
|
758
|
+
// margin-right: 0 !important;
|
|
759
|
+
// }
|
|
760
|
+
// }
|
|
761
|
+
// }
|
|
914
762
|
}
|
|
915
763
|
|
|
916
764
|
// Small devices (landscape phones, 576px and up)
|
|
@@ -919,18 +767,18 @@ Responsive Classes
|
|
|
919
767
|
|
|
920
768
|
// Medium devices (tablets, 768px and up)
|
|
921
769
|
@media (min-width: 768px) and (max-width: 991.98px) {
|
|
922
|
-
.ac-system-body {
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
}
|
|
770
|
+
// .ac-system-body {
|
|
771
|
+
// grid-gap: 15px;
|
|
772
|
+
// grid-template-columns: 240px calc(100% - 255px);
|
|
773
|
+
// }
|
|
926
774
|
}
|
|
927
775
|
|
|
928
776
|
// Large devices (desktops, 992px and up)
|
|
929
777
|
@media (min-width: 992px) and (max-width: 1199.98px) {
|
|
930
|
-
.ac-system-body {
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
}
|
|
778
|
+
// .ac-system-body {
|
|
779
|
+
// grid-gap: 0px;
|
|
780
|
+
// grid-template-columns: 240px calc(100% - 260px);
|
|
781
|
+
// }
|
|
934
782
|
}
|
|
935
783
|
|
|
936
784
|
// Extra large devices (large desktops, 1200px and up)
|
|
@@ -939,8 +787,8 @@ Responsive Classes
|
|
|
939
787
|
|
|
940
788
|
// FHD devices
|
|
941
789
|
@media (min-width: 1408px) and (max-width: 1600) {
|
|
942
|
-
.ac-system-body {
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
}
|
|
790
|
+
// .ac-system-body {
|
|
791
|
+
// grid-gap: 0px;
|
|
792
|
+
// grid-template-columns: 240px calc(100% - 260px);
|
|
793
|
+
// }
|
|
946
794
|
}
|
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
// default layout css
|
|
2
|
+
.ac-system-body {
|
|
3
|
+
display: grid;
|
|
4
|
+
grid-gap: 0px;
|
|
5
|
+
grid-template-columns: 250px calc(100% - 250px);
|
|
6
|
+
padding-top: 50px;
|
|
7
|
+
transition: 0.3s ease-in-out;
|
|
8
|
+
|
|
9
|
+
&.is-fullwidth {
|
|
10
|
+
grid-template-columns: auto !important;
|
|
11
|
+
|
|
12
|
+
// &.has-info-content {
|
|
13
|
+
// grid-template-columns: 250px calc(100% - 540px) 250px;
|
|
14
|
+
// }
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
// &.has-info-content {
|
|
18
|
+
// grid-template-columns: 250px calc(100% - 540px) 250px;
|
|
19
|
+
|
|
20
|
+
// .ac-system-content {
|
|
21
|
+
// &.pr-15 {
|
|
22
|
+
// padding-right: 0 !important;
|
|
23
|
+
// }
|
|
24
|
+
// }
|
|
25
|
+
// }
|
|
26
|
+
|
|
27
|
+
// &.in-ui-builder {
|
|
28
|
+
// grid-template-columns: calc(100% - 250px) 250px !important;
|
|
29
|
+
// }
|
|
30
|
+
|
|
31
|
+
// &.has-ui-builder {
|
|
32
|
+
// grid-template-columns: 70px calc(100% - 70px);
|
|
33
|
+
// grid-gap: 0;
|
|
34
|
+
|
|
35
|
+
// .inner-header {
|
|
36
|
+
// position: sticky;
|
|
37
|
+
// top: 100px;
|
|
38
|
+
// background-color: $white-100;
|
|
39
|
+
// z-index: 997;
|
|
40
|
+
// }
|
|
41
|
+
|
|
42
|
+
// .ac-system-content {
|
|
43
|
+
// &.pr-15 {
|
|
44
|
+
// padding-right: 0 !important;
|
|
45
|
+
// }
|
|
46
|
+
|
|
47
|
+
// .ac-terminal {
|
|
48
|
+
// width: calc(100% - 290px);
|
|
49
|
+
// left: 289px;
|
|
50
|
+
// }
|
|
51
|
+
// }
|
|
52
|
+
|
|
53
|
+
// // .ac-system-left-sidebar.is-expanded {
|
|
54
|
+
// // z-index: 998;
|
|
55
|
+
// // }
|
|
56
|
+
|
|
57
|
+
// // &.expanded-sidebar {
|
|
58
|
+
// // grid-gap: 0px;
|
|
59
|
+
// // z-index: 9;
|
|
60
|
+
// // grid-template-columns: 250px calc(100% - 250px);
|
|
61
|
+
|
|
62
|
+
// // .is-fullwidth {
|
|
63
|
+
// // .ac-system-content {
|
|
64
|
+
// // padding-left: 0;
|
|
65
|
+
// // }
|
|
66
|
+
// // }
|
|
67
|
+
// // }
|
|
68
|
+
|
|
69
|
+
// // .is-fullwidth {
|
|
70
|
+
// // grid-template-columns: auto;
|
|
71
|
+
|
|
72
|
+
// // &.has-info-content {
|
|
73
|
+
// // grid-template-columns: calc(100% - 260px) 240px;
|
|
74
|
+
// // }
|
|
75
|
+
|
|
76
|
+
// // .ac-system-content {
|
|
77
|
+
// // padding-left: 20px;
|
|
78
|
+
// // }
|
|
79
|
+
// // }
|
|
80
|
+
|
|
81
|
+
// // .ac-system-body {
|
|
82
|
+
// // padding-top: 0;
|
|
83
|
+
// // grid-template-columns: 220px calc(100% - 440px) 220px;
|
|
84
|
+
|
|
85
|
+
// // .ac-system-left-sidebar {
|
|
86
|
+
// // // border-right: none !important;
|
|
87
|
+
// // // height: calc(100vh - 60px);
|
|
88
|
+
|
|
89
|
+
// // .ac-left-sidebar-wrapper {
|
|
90
|
+
// // position: fixed;
|
|
91
|
+
// // top: 140px;
|
|
92
|
+
// // width: 219px;
|
|
93
|
+
// // border-right: 1px solid $primary-90;
|
|
94
|
+
// // height: 100%;
|
|
95
|
+
|
|
96
|
+
// // ul.menu-list-wrapper {
|
|
97
|
+
// // padding-top: 10px;
|
|
98
|
+
// // }
|
|
99
|
+
// // }
|
|
100
|
+
// // }
|
|
101
|
+
// // }
|
|
102
|
+
// }
|
|
103
|
+
|
|
104
|
+
// &.has-deploy-flow {
|
|
105
|
+
// grid-template-columns: 65% 35%;
|
|
106
|
+
// }
|
|
107
|
+
|
|
108
|
+
// .ac-system-left-sidebar {
|
|
109
|
+
// // border-right: 1px solid $primary-90;
|
|
110
|
+
// // box-shadow: none;
|
|
111
|
+
|
|
112
|
+
// &.is-expanded {
|
|
113
|
+
// z-index: 998;
|
|
114
|
+
|
|
115
|
+
// .ac-product-logo {
|
|
116
|
+
// width: 250px !important;
|
|
117
|
+
// justify-content: flex-start !important;
|
|
118
|
+
// }
|
|
119
|
+
|
|
120
|
+
// .menu-list {
|
|
121
|
+
// box-shadow: 2px -1px 8px rgba(26, 80, 151, 0.16);
|
|
122
|
+
|
|
123
|
+
// &.ac-menu-list {
|
|
124
|
+
// width: 250px !important;
|
|
125
|
+
// background-color: $white-100;
|
|
126
|
+
|
|
127
|
+
// li {
|
|
128
|
+
// a {
|
|
129
|
+
// strong {
|
|
130
|
+
// display: block !important;
|
|
131
|
+
// }
|
|
132
|
+
// }
|
|
133
|
+
|
|
134
|
+
// ul {
|
|
135
|
+
// li {
|
|
136
|
+
// a {
|
|
137
|
+
// padding-left: 50px !important;
|
|
138
|
+
// }
|
|
139
|
+
// }
|
|
140
|
+
// }
|
|
141
|
+
// }
|
|
142
|
+
// }
|
|
143
|
+
// }
|
|
144
|
+
// }
|
|
145
|
+
// }
|
|
146
|
+
}
|
|
147
|
+
// sidebar collapsed
|
|
148
|
+
.sidebar-collapsed {
|
|
149
|
+
.ac-system-body {
|
|
150
|
+
grid-template-columns: 60px calc(100% - 60px);
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
// .ac-system-body {
|
|
154
|
+
// &.is-preview-step {
|
|
155
|
+
// grid-template-columns: calc(100% - 250px) 250px !important;
|
|
156
|
+
// }
|
|
157
|
+
// }
|