@gem-sdk/styles 1.23.0-staging.155 → 1.23.0-staging.157

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/dist/toolbar.css CHANGED
@@ -6,15 +6,15 @@
6
6
  [data-toolbar-wrap] [data-toolbar] {
7
7
  position: absolute;
8
8
  z-index: 20;
9
- height: 32px;
10
- top: -32px;
9
+ height: 24px;
10
+ top: -24px;
11
11
  left: 0;
12
12
  max-width: unset;
13
13
  display: flex;
14
14
  align-items: center;
15
15
  padding: 4px;
16
16
  color: #fff;
17
- background: #fff;
17
+ background: #3c67ff;
18
18
  border: solid 1px #3c67ff;
19
19
  border-radius: 6px 6px 0 0;
20
20
  white-space: nowrap;
@@ -55,7 +55,7 @@
55
55
  [data-toolbar-wrap] [data-toolbar] [data-toolbar-parent] {
56
56
  position: absolute;
57
57
  top: -32px;
58
- left: -1px;
58
+ left: 0px;
59
59
  height: 32px;
60
60
  padding: 8px;
61
61
  opacity: 1;
@@ -67,14 +67,28 @@
67
67
  background: #3c67ff;
68
68
  }
69
69
  [data-toolbar-wrap] [data-toolbar] [data-toolbar-parent]:hover {
70
- background: #7190FF;
70
+ background: #7190ff;
71
+ }
72
+ /* fix hover parent */
73
+ [data-toolbar-wrap] [data-toolbar] [data-toolbar-parent]:before {
74
+ content: '';
75
+ width: 100%;
76
+ height: 4px;
77
+ background: transparent;
78
+ bottom: -4px;
79
+ left: 0;
80
+ position: absolute;
81
+ }
82
+ [data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-parent-revert='true']:before {
83
+ bottom: unset;
84
+ top: -4px;
71
85
  }
72
86
  [data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section='true'] {
73
- border: solid 1px #9144da;
74
- color: #9144da;
87
+ background-color: #9144da;
88
+ color: #fff;
75
89
  }
76
90
  [data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section='true']:hover {
77
- background: #ebddf8;
91
+ background-color: #af7edd;
78
92
  }
79
93
  [data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section='true'][data-toolbar-hover-focus] {
80
94
  background: #ebddf8;
@@ -103,9 +117,12 @@
103
117
  display: none;
104
118
  }
105
119
  [data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section='true'] {
106
- color: #9144da;
107
- border: solid 1px #9144da;
120
+ background-color: #9144da;
121
+ color: #fff;
108
122
  }
123
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section='true'][data-toolbar-active] [data-toolbar-show-parent]:before {
124
+ background-color: #af7edd;
125
+ }
109
126
  [data-toolbar-wrap] [data-toolbar-theme-section='true'] [data-toolbar-duplicate] {
110
127
  border-color: #be86f3;
111
128
  }
@@ -117,7 +134,6 @@
117
134
  z-index: 30;
118
135
  border-width: 0;
119
136
  transition-delay: 100ms;
120
- border-width: 0;
121
137
  }
122
138
  [data-toolbar-wrap] [data-toolbar][data-toolbar-hover]:hover, [data-toolbar-wrap] [data-toolbar][data-toolbar-force-hover]:hover {
123
139
  background: #3c67ff;
@@ -128,25 +144,25 @@
128
144
  }
129
145
  [data-toolbar-wrap] [data-toolbar][data-toolbar-hover-revert] {
130
146
  top: calc(100% - 1px);
147
+ border-radius: 0 0 6px 6px;
131
148
  }
132
149
  [data-toolbar-wrap] [data-toolbar][data-toolbar-hover-inside] {
133
150
  top: 0;
151
+ border-radius: 0 0 6px 6px;
134
152
  }
135
153
  [data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus] {
136
154
  background: #3c67ff;
137
155
  z-index: 40;
138
- padding: 4px 8px;
139
156
  }
140
157
  [data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus]:hover {
141
158
  background: #3c67ff;
142
159
  }
143
160
  [data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section='true'][data-toolbar-hover][data-toolbar-hover-focus] {
144
- background: #ebddf8;
161
+ background: #9144da;
145
162
  padding: 4px;
146
163
  }
147
164
  [data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section='true'][data-toolbar-hover]:hover {
148
- background: #ebddf8;
149
- border-color: #9144da;
165
+ background: #9144da;
150
166
  }
151
167
  [data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section='true'][data-toolbar-active]:hover {
152
168
  background: #9144da;
@@ -182,11 +198,20 @@
182
198
  margin-right: 8px;
183
199
  border-radius: 6px;
184
200
  transition: background 200ms ease-in-out;
185
- position: relative ;
201
+ position: relative;
186
202
  }
187
203
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent]:before {
188
204
  position: absolute;
189
- content: "";
205
+ content: '';
206
+ background: #424242;
207
+ width: 1px;
208
+ height: calc(100% - 4px);
209
+ right: -4px;
210
+ top: 2px;
211
+ }
212
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent]:before {
213
+ position: absolute;
214
+ content: '';
190
215
  background: #424242;
191
216
  width: 1px;
192
217
  height: calc(100% - 4px);
@@ -257,16 +282,16 @@
257
282
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-create-theme-section] {
258
283
  display: none;
259
284
  }
260
- [data-toolbar-wrap] [data-toolbar][data-toolbar-active-overflow],
285
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-active-overflow],
261
286
  [data-toolbar-wrap] [data-toolbar][data-toolbar-hover-overflow] {
262
287
  left: unset;
263
288
  right: 0;
264
289
  }
265
290
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active-revert] {
266
- top: calc(100% - 1px);
291
+ top: calc(100% + 3px);
267
292
  }
268
293
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active-inside] {
269
- top: 0;
294
+ top: 4px;
270
295
  }
271
296
  [data-toolbar-wrap] [data-toolbar][data-toolbar-section='true'] {
272
297
  left: unset;
@@ -275,11 +300,11 @@
275
300
  }
276
301
  [data-toolbar-wrap] [data-toolbar][data-toolbar-section='true'][data-toolbar-hover-focus]
277
302
  [data-toolbar-create-theme-section] {
278
- border-color: #7190FF;
303
+ border-color: #7190ff;
279
304
  }
280
305
  [data-toolbar-wrap] [data-toolbar][data-toolbar-section='true'][data-toolbar-hover-focus],
281
306
  [data-toolbar-wrap] [data-toolbar][data-toolbar-section='true'][data-toolbar-active] {
282
- border-color: #7190FF;
307
+ border-color: #7190ff;
283
308
  }
284
309
  [data-toolbar-wrap] [data-toolbar][data-toolbar-editor-inline-focus] {
285
310
  display: none;
@@ -343,11 +368,11 @@
343
368
  background: #ebddf866;
344
369
  }
345
370
  [data-toolbar-wrap] [data-outline][data-outline-overlay-theme-section] {
346
- background: #ebddf83d;
371
+ background: transparent;
347
372
  }
348
373
  [data-toolbar-wrap] [data-outline][data-outline-hover][data-outline-section='true'] {
349
374
  border-color: #3c67ff;
350
- z-index: -1;
375
+ z-index: 0;
351
376
  }
352
377
  [data-toolbar-wrap] [data-outline][data-outline-section='true'][data-outline-hover-focus],
353
378
  [data-toolbar-wrap] [data-outline][data-outline-section='true'][data-outline-active] {
@@ -399,6 +424,10 @@
399
424
  [data-toolbar-wrap] [data-theme-section] [data-toolbar-add-bottom] {
400
425
  transition-delay: 0ms;
401
426
  }
427
+ [data-toolbar-wrap] [data-theme-section] [data-toolbar-add-top],
428
+ [data-toolbar-wrap] [data-theme-section] [data-toolbar-add-bottom] {
429
+ border-color: #9144da;
430
+ }
402
431
  [data-toolbar-wrap] [data-theme-section] .button-text::after {
403
432
  display: none !important;
404
433
  }
@@ -453,20 +482,21 @@
453
482
  align-items: center;
454
483
  background: #fff;
455
484
  color: #3c67ff;
456
- border: solid 1px #d6d6d6;
457
- border-radius: 3px;
485
+ border: solid 1px #3c67ff;
486
+ border-radius: 8px;
458
487
  cursor: pointer;
459
488
  position: absolute;
460
489
  z-index: 50;
461
490
  left: calc(50% - 16px);
462
491
  top: -16px;
463
- display: none;
492
+ display: flex;
493
+ opacity: 0;
494
+ visibility: hidden;
464
495
  -webkit-user-select: none;
465
496
  user-select: none;
466
497
  transition:
467
498
  border-color 200ms ease-in-out,
468
499
  opacity 0ms ease-in-out;
469
- transition: border-color 200ms ease-in-out, opacity 0ms ease-in-out;
470
500
  transition-delay: 100ms;
471
501
  }
472
502
  [data-toolbar-wrap] [data-toolbar-add-top] svg, [data-toolbar-wrap] [data-toolbar-add-bottom] svg {
@@ -477,7 +507,7 @@
477
507
  transition: transform 200ms ease-in-out, -webkit-transform 200ms ease-in-out;
478
508
  }
479
509
  [data-toolbar-wrap] [data-toolbar-add-top]:hover, [data-toolbar-wrap] [data-toolbar-add-bottom]:hover {
480
- border-color: #3c67ff;
510
+ background-color: #f6f6f6;
481
511
  }
482
512
  [data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-disable='true'], [data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-disable='true'] {
483
513
  background: #f4f4f4;
@@ -500,11 +530,13 @@
500
530
  }
501
531
  [data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-add-hover],
502
532
  [data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-add-hover] {
503
- display: flex;
533
+ opacity: 1;
534
+ visibility: visible;
504
535
  }
505
536
  [data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-add-active],
506
537
  [data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-add-active] {
507
- display: flex;
538
+ opacity: 1;
539
+ visibility: visible;
508
540
  }
509
541
  /* Resize spacing */
510
542
  [data-toolbar-wrap] [data-spacing] {
@@ -673,39 +705,32 @@
673
705
  transform: translateX(-50%);
674
706
  }
675
707
 
676
-
677
708
  [data-toolbar-debug] [data-toolbar] {
678
709
  opacity: 1;
679
710
  visibility: visible;
680
711
  }
681
712
 
682
-
683
713
  [data-toolbar-debug] [data-outline] {
684
714
  opacity: 1;
685
715
  visibility: visible;
686
716
  }
687
717
 
688
-
689
718
  [data-toolbar-active='true'] .theme-section-tooltip {
690
719
  right: -53px !important;
691
720
  padding-top: 16px !important;
692
721
  }
693
722
 
694
-
695
723
  [data-toolbar-active='true'] .theme-section-tooltip::before {
696
724
  right: 45% !important;
697
725
  top: 12px !important;
698
726
  }
699
727
 
700
-
701
728
  /* Create theme section tooltip */
702
729
 
703
-
704
730
  .theme-section-tooltip-wrapper {
705
731
  position: relative;
706
732
  }
707
733
 
708
-
709
734
  .theme-section-tooltip-wrapper .theme-section-tooltip {
710
735
  cursor: default;
711
736
  min-width: 284px;
@@ -718,7 +743,6 @@
718
743
  padding-top: 9px;
719
744
  }
720
745
 
721
-
722
746
  .theme-section-tooltip-wrapper .theme-section-tooltip::before {
723
747
  content: '';
724
748
  position: absolute;
@@ -731,7 +755,6 @@
731
755
  top: 5px;
732
756
  }
733
757
 
734
-
735
758
  .theme-section-tooltip-wrapper .theme-section-tooltip__image {
736
759
  background: #212121;
737
760
  border-radius: 12px 12px 0 0;
@@ -742,7 +765,6 @@
742
765
  min-height: 150px;
743
766
  }
744
767
 
745
-
746
768
  .theme-section-tooltip-wrapper .theme-section-tooltip__body {
747
769
  display: flex;
748
770
  flex-direction: column;
@@ -752,7 +774,6 @@
752
774
  white-space: normal;
753
775
  }
754
776
 
755
-
756
777
  .theme-section-tooltip-wrapper .theme-section-tooltip__body-title {
757
778
  color: #f9f9f9;
758
779
  font-size: 14px;
@@ -760,7 +781,6 @@
760
781
  line-height: 24px;
761
782
  }
762
783
 
763
-
764
784
  .theme-section-tooltip-wrapper .theme-section-tooltip__body-desc {
765
785
  color: #aaa;
766
786
  font-size: 14px;
@@ -768,7 +788,6 @@
768
788
  line-height: 24px;
769
789
  }
770
790
 
771
-
772
791
  .theme-section-tooltip-wrapper .theme-section-tooltip__action {
773
792
  padding: 16px;
774
793
  border-radius: 0 0 12px 12px;
@@ -778,7 +797,6 @@
778
797
  flex-direction: column;
779
798
  }
780
799
 
781
-
782
800
  .theme-section-tooltip-wrapper .theme-section-tooltip__action button {
783
801
  cursor: pointer;
784
802
  width: 100%;
@@ -793,23 +811,19 @@
793
811
  transition: all 0.15s ease-in;
794
812
  }
795
813
 
796
-
797
814
  .theme-section-tooltip-wrapper .theme-section-tooltip__action button:hover {
798
815
  background: #2856f8;
799
816
  }
800
817
 
801
-
802
818
  .theme-section-tooltip-wrapper .theme-section-tooltip__action-limit button {
803
819
  background: #fdb913 !important;
804
820
  color: #212121 !important;
805
821
  }
806
822
 
807
-
808
823
  .theme-section-tooltip-wrapper .theme-section-tooltip__action-limit button:hover {
809
824
  background: #fdc742 !important;
810
825
  }
811
826
 
812
-
813
827
  .theme-section-tooltip-wrapper .theme-section-tooltip__action-learn-more {
814
828
  color: #8aa4ff;
815
829
  text-align: center;
@@ -821,12 +835,10 @@
821
835
  transition: all 0.15s ease-in;
822
836
  }
823
837
 
824
-
825
838
  .theme-section-tooltip-wrapper .theme-section-tooltip__action-learn-more:hover {
826
839
  color: #b1c3ff;
827
840
  }
828
841
 
829
-
830
842
  @media (max-width: 767px) {
831
843
  [data-toolbar-wrap] [data-toolbar-add-top], [data-toolbar-wrap] [data-toolbar-add-bottom] {
832
844
  width: 28px;
@@ -834,4 +846,8 @@
834
846
  left: calc(50% - 14px);
835
847
  top: -14px;
836
848
  }
849
+ [data-toolbar-wrap] [data-toolbar-add-bottom] {
850
+ top: unset;
851
+ bottom: -14px;
852
+ }
837
853
  }
@@ -1 +1 @@
1
- [data-toolbar-wrap]{position:relative}[data-toolbar-wrap] [data-toolbar]{align-items:center;background:#fff;border:1px solid #3c67ff;border-radius:6px 6px 0 0;color:#fff;cursor:pointer;display:flex;font-family:Inter,sans-serif,ui-sans-serif,system-ui;height:32px;left:0;max-width:unset;opacity:0;padding:4px;pointer-events:unset;position:absolute;top:-32px;transition:opacity 0ms ease-in-out;-webkit-user-select:none;user-select:none;visibility:hidden;white-space:nowrap;z-index:20}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent],[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent]{align-items:center;display:flex}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent] [data-toolbar-icon-drag],[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent] [data-toolbar-icon-drag]{display:none}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent] [data-toolbar-icon-drag] svg,[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent] [data-toolbar-icon-drag] svg{display:block;height:16px;max-width:unset;width:16px}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent] [data-toolbar-name],[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent] [data-toolbar-name]{display:block;font-size:12px;font-weight:500;padding-left:4px;padding-right:4px;white-space:nowrap}[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent]{cursor:grab}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent]{background:#fff;background:#3c67ff;border-radius:8px;color:#fff;height:32px;left:-1px;opacity:1;padding:8px;position:absolute;top:-32px;visibility:visible;z-index:30}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent]:hover{background:#7190ff}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section=true]{border:1px solid #9144da;color:#9144da}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section=true]:hover,[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section=true][data-toolbar-hover-focus],[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section=true][data-toolbar-hover-focus]:hover{background:#ebddf8}[data-toolbar-wrap] [data-toolbar] [data-toolbar-create-theme-section]{border-left:1px solid;border-color:#d6d6d6;font-size:12px;font-weight:500;line-height:16px;margin-bottom:8px;margin-left:4px;margin-top:8px;padding-left:8px;padding-right:4px}[data-toolbar-wrap] [data-toolbar] [data-toolbar-active-create-theme-section],[data-toolbar-wrap] [data-toolbar] [data-toolbar-delete],[data-toolbar-wrap] [data-toolbar] [data-toolbar-duplicate],[data-toolbar-wrap] [data-toolbar] [data-toolbar-icon-parent],[data-toolbar-wrap] [data-toolbar] [data-toolbar-zoom-out]{display:none}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true]{border:1px solid #9144da;color:#9144da}[data-toolbar-wrap] [data-toolbar-theme-section=true] [data-toolbar-duplicate]{border-color:#be86f3}[data-toolbar-wrap] [data-toolbar][data-toolbar-force-hover],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover]{border-width:0;opacity:1;transition-delay:.1s;visibility:visible;z-index:30}[data-toolbar-wrap] [data-toolbar][data-toolbar-force-hover]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-hover]:hover{background:#3c67ff;border-color:#3c67ff}[data-toolbar-wrap] [data-toolbar][data-toolbar-force-hover]:hover [data-toolbar-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover]:hover [data-toolbar-create-theme-section]{border-color:#3c67ff}[data-toolbar-wrap] [data-toolbar][data-toolbar-hover-revert]{top:calc(100% - 1px)}[data-toolbar-wrap] [data-toolbar][data-toolbar-hover-inside]{top:0}[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus]{background:#3c67ff;padding:4px 8px;z-index:40}[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus]:hover{background:#3c67ff}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-hover][data-toolbar-hover-focus]{background:#ebddf8;padding:4px}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-hover]:hover{background:#ebddf8;border-color:#9144da}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-active]:hover{background:#9144da}[data-toolbar-wrap] [data-toolbar][data-toolbar-active]{background:#000;border-radius:8px;border-width:0;color:#fff;height:32px;opacity:1;top:-35px;visibility:visible;z-index:20}[data-toolbar-wrap] [data-toolbar][data-toolbar-active]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-hover-focus],[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-hover-focus]:hover{background:#000}[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-theme-section=true],[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-theme-section=true][data-toolbar-hover-focus]{background:#9144da}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent]{border-radius:6px;margin-right:8px;padding:4px;position:relative;transition:background .2s ease-in-out}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent]:before{background:#424242;content:"";height:calc(100% - 4px);position:absolute;right:-4px;top:2px;width:1px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] [data-toolbar-icon-parent]{display:block;transition:-webkit-transform .2s ease-in-out;transition:transform .2s ease-in-out;transition:transform .2s ease-in-out,-webkit-transform .2s ease-in-out}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] [data-toolbar-icon-parent] svg{display:block;height:16px;max-width:unset;width:16px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] [data-toolbar-icon-parent][data-toolbar-icon-parent-open=true]{-webkit-transform:rotate(180deg);transform:rotate(180deg)}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent]:hover{background:hsla(0,0%,88%,.2)}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] [data-toolbar-icon-drag]{display:block}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete],[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate],[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out]{border-radius:2px;display:block;padding:4px;transition:background .2s ease-in-out}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out] svg{display:block;height:16px;max-width:unset;width:16px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out]:hover{background:hsla(0,0%,88%,.2)}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section][data-toolbar-disable=true] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete][data-toolbar-disable=true] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate][data-toolbar-disable=true] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out][data-toolbar-disable=true] svg{opacity:.4}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section][data-toolbar-disable=true]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete][data-toolbar-disable=true]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate][data-toolbar-disable=true]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out][data-toolbar-disable=true]:hover{background:transparent}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section-wrapper]{border-left:1px solid #6a6a6a;border-right:1px solid #6a6a6a;margin:0 4px;padding:0 4px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section]{align-items:center;display:flex!important;gap:4px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section] p{font-size:12px;font-weight:500}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-create-theme-section]{display:none}[data-toolbar-wrap] [data-toolbar][data-toolbar-active-overflow],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover-overflow]{left:unset;right:0}[data-toolbar-wrap] [data-toolbar][data-toolbar-active-revert]{top:calc(100% - 1px)}[data-toolbar-wrap] [data-toolbar][data-toolbar-active-inside]{top:0}[data-toolbar-wrap] [data-toolbar][data-toolbar-section=true]{border-color:#d6d6d6;left:unset;right:0}[data-toolbar-wrap] [data-toolbar][data-toolbar-section=true][data-toolbar-active],[data-toolbar-wrap] [data-toolbar][data-toolbar-section=true][data-toolbar-hover-focus],[data-toolbar-wrap] [data-toolbar][data-toolbar-section=true][data-toolbar-hover-focus] [data-toolbar-create-theme-section]{border-color:#7190ff}[data-toolbar-wrap] [data-toolbar][data-toolbar-editor-inline-focus]{display:none}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-active],[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-hover-focus]{border-color:#9144da}[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-limit=true],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus][data-toolbar-limit=true],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-limit=true],[data-toolbar-wrap] [data-toolbar][data-toolbar-limit=true]{background:#f44336;border-color:#f44336;color:#fff}[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-limit=true] [data-toolbar-active-create-theme-section-wrapper],[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-limit=true] [data-toolbar-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus][data-toolbar-limit=true] [data-toolbar-active-create-theme-section-wrapper],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus][data-toolbar-limit=true] [data-toolbar-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-limit=true] [data-toolbar-active-create-theme-section-wrapper],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-limit=true] [data-toolbar-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-limit=true] [data-toolbar-active-create-theme-section-wrapper],[data-toolbar-wrap] [data-toolbar][data-toolbar-limit=true] [data-toolbar-create-theme-section]{border-color:#fff}[data-toolbar-wrap] [data-outline]{border:1px solid #3c67ff;height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transition:opacity 0ms ease-in-out;visibility:hidden;width:100%;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-force-hover],[data-toolbar-wrap] [data-outline][data-outline-hover]{opacity:1;transition-delay:.1s;visibility:visible;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-active]{opacity:1;visibility:visible;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-force-overlay],[data-toolbar-wrap] [data-outline][data-outline-overlay]{background:rgba(60,103,255,.1);transition-delay:0ms}[data-toolbar-wrap] [data-outline][data-outline-force-overlay][data-outline-theme-section=true],[data-toolbar-wrap] [data-outline][data-outline-overlay][data-outline-theme-section=true]{background:#ebddf866}[data-toolbar-wrap] [data-outline][data-outline-overlay-theme-section]{background:#ebddf83d}[data-toolbar-wrap] [data-outline][data-outline-hover][data-outline-section=true]{border-color:#3c67ff;z-index:-1}[data-toolbar-wrap] [data-outline][data-outline-section=true][data-outline-active],[data-toolbar-wrap] [data-outline][data-outline-section=true][data-outline-hover-focus]{border-color:#3c67ff;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-editor-inline-focus]{border-color:transparent;outline:unset;z-index:0}[data-toolbar-wrap] [data-component-tag=Heading] [data-outline][data-outline-editor-inline-focus],[data-toolbar-wrap] [data-component-tag=Text] [data-outline][data-outline-editor-inline-focus]{border-color:#3c67ff;height:calc(100% + 4px);left:-2px;outline:4px solid rgba(60,103,255,.24);top:-2px;width:calc(100% + 4px);z-index:0}[data-toolbar-wrap] [data-component-tag=Section]>[data-toolbar] [data-toolbar-show-parent]{margin-right:0}[data-toolbar-wrap] [data-component-tag=Section]>[data-toolbar] [data-toolbar-show-parent]:before{display:none}[data-toolbar-wrap] [data-outline][data-outline-theme-section=true],[data-toolbar-wrap] [data-outline][data-outline-theme-section=true][data-outline-active],[data-toolbar-wrap] [data-outline][data-outline-theme-section=true][data-outline-hover-focus]{border-color:#9144da;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-active][data-outline-limit=true],[data-toolbar-wrap] [data-outline][data-outline-hover][data-outline-hover-focus][data-outline-limit=true],[data-toolbar-wrap] [data-outline][data-outline-hover][data-outline-limit=true],[data-toolbar-wrap] [data-outline][data-outline-limit=true]{border-color:#f44336}[data-toolbar-wrap] [data-outline][data-outline-parent-hover],[data-toolbar-wrap] [data-outline][data-outline-section][data-outline-parent-hover]{border-style:dashed}[data-toolbar-wrap] [data-theme-section] [data-outline][data-outline-hover][data-outline-hover-focus],[data-toolbar-wrap] [data-theme-section] [data-toolbar-add-bottom],[data-toolbar-wrap] [data-theme-section] [data-toolbar-add-top],[data-toolbar-wrap] [data-theme-section] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus]{transition-delay:0ms}[data-toolbar-wrap] [data-theme-section] .button-text:after{display:none!important}[data-toolbar-wrap] [data-theme-section] .gp-text:hover{border-color:transparent!important}[data-toolbar-wrap] [data-theme-section-status]{align-items:center;background:#ebddf8;border-radius:3px;color:#212121;display:none;font-size:14px;font-weight:400;gap:4px;left:8px;line-height:24px;max-width:32px;overflow:hidden;padding:4px;position:absolute;top:8px;transition:max-width 1s ease-in-out;z-index:50}[data-toolbar-wrap] [data-theme-section-status-active=true]{display:flex}[data-toolbar-wrap] [data-theme-section-status-icon]{align-items:center;cursor:pointer;display:flex;flex-shrink:0;height:24px;justify-content:center;width:24px}[data-toolbar-wrap] [data-theme-section-status-text]{display:block;white-space:nowrap}[data-toolbar-wrap] [data-theme-section-status]:hover{max-width:100%}[data-toolbar-wrap] [data-toolbar-add-bottom],[data-toolbar-wrap] [data-toolbar-add-top]{align-items:center;background:#fff;border:1px solid #d6d6d6;border-radius:3px;color:#3c67ff;cursor:pointer;display:flex;display:none;height:32px;justify-content:center;left:calc(50% - 16px);position:absolute;top:-16px;transition:border-color .2s ease-in-out,opacity 0ms ease-in-out;transition-delay:.1s;-webkit-user-select:none;user-select:none;width:32px;z-index:50}[data-toolbar-wrap] [data-toolbar-add-bottom] svg,[data-toolbar-wrap] [data-toolbar-add-top] svg{height:16px;transition:-webkit-transform .2s ease-in-out;transition:transform .2s ease-in-out;transition:transform .2s ease-in-out,-webkit-transform .2s ease-in-out;width:16px}[data-toolbar-wrap] [data-toolbar-add-bottom]:hover,[data-toolbar-wrap] [data-toolbar-add-top]:hover{border-color:#3c67ff}[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-disable=true],[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-disable=true]:hover,[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-disable=true],[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-disable=true]:hover{background:#f4f4f4;border-color:#d6d6d6;color:#d6d6d6}[data-toolbar-wrap] [data-toolbar-add-bottom]{bottom:-16px;top:unset}[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-add-open=true] svg,[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-add-open=true] svg{-webkit-transform:rotate(45deg);transform:rotate(45deg)}[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-add-active],[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-add-hover],[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-add-active],[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-add-hover]{display:flex}[data-toolbar-wrap] [data-spacing]{z-index:10}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom]{bottom:0;display:flex;display:none;justify-content:center;left:0;position:absolute;width:100%;z-index:10}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom] [data-spacing-margin-bottom-bg]{align-items:center;background-color:#3c67ff33;display:flex;justify-content:center;left:0;position:absolute;top:0;width:100%}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom] [data-spacing-margin-bottom-bg] [data-spacing-margin-bottom-value]{background-color:#3c67ff;border-radius:4px;color:#fff;display:none;font-size:8px;font-weight:700;padding:2px;position:absolute}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom] [data-spacing-margin-bottom-drag]{background-color:#3c67ff;border-top-left-radius:4px;border-top-right-radius:4px;bottom:0;cursor:ns-resize;height:4px;position:absolute;-webkit-transform:translateY(-100%);transform:translateY(-100%);transition:height .2s;width:40px}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom] [data-spacing-margin-bottom-drag]:hover{height:6px}[data-toolbar-wrap] [data-spacing][data-spacing-theme-section=true] [data-spacing-margin-bottom-bg]{background-color:#9144da33}[data-toolbar-wrap] [data-spacing][data-spacing-theme-section=true] [data-spacing-margin-bottom-bg] [data-spacing-margin-bottom-value],[data-toolbar-wrap] [data-spacing][data-spacing-theme-section=true] [data-spacing-margin-bottom-drag]{background-color:#9144da}[data-toolbar-wrap] [data-spacing-margin-bottom][data-spacing-margin-bottom-active]{display:flex}[data-toolbar-wrap] [data-spacing][data-spacing-hidden]{display:none}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip]{background-color:#676767!important;border-radius:6px;color:#fff;font-size:16px;max-width:unset;opacity:0;padding:8px 12px;pointer-events:none;position:absolute;text-align:center;transition:opacity 1s;white-space:nowrap;width:unset;z-index:1}[data-toolbar-wrap] [data-toolbar-tooltip-trigger]:hover [data-toolbar-tooltip]{opacity:1}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=right]{left:105%;top:-5px}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=right]:after{border:5px solid transparent;border-right-color:#676767;content:" ";margin-top:-5px;position:absolute;right:100%;top:50%}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=left]{right:105%;top:-5px}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=left]:after{border:5px solid transparent;border-left-color:#676767;content:" ";left:100%;margin-top:-5px;position:absolute;top:50%}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=top]{bottom:105%;left:0}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=top]:after{border:5px solid transparent;border-top-color:#676767;content:" ";left:50%;margin-left:-5px;position:absolute;top:100%}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=bottom]{left:0;top:105%}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=bottom]:after{border:5px solid transparent;border-bottom-color:#676767;bottom:100%;content:" ";left:50%;margin-left:-5px;position:absolute}[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-duplicate]{position:relative}[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-duplicate] [data-toolbar-tooltip]{left:unset;margin-top:12px;right:0}[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-duplicate] [data-toolbar-tooltip][data-toolbar-tooltip-position=bottom]:after{content:" ";left:unset;right:6px}[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-add-bottom] [data-toolbar-tooltip],[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-add-top] [data-toolbar-tooltip]{left:50%;margin-bottom:12px;-webkit-transform:translateX(-50%);transform:translateX(-50%)}[data-toolbar-debug] [data-outline],[data-toolbar-debug] [data-toolbar]{opacity:1;visibility:visible}[data-toolbar-active=true] .theme-section-tooltip{padding-top:16px!important;right:-53px!important}[data-toolbar-active=true] .theme-section-tooltip:before{right:45%!important;top:12px!important}.theme-section-tooltip-wrapper{position:relative}.theme-section-tooltip-wrapper .theme-section-tooltip{border-radius:12px;cursor:default;display:flex;flex-direction:column;min-width:284px;padding-top:9px;position:absolute;right:-4px;top:100%}.theme-section-tooltip-wrapper .theme-section-tooltip:before{background:#212121;content:"";height:8px;position:absolute;right:16px;top:5px;-webkit-transform:rotate(45deg);transform:rotate(45deg);width:8px}.theme-section-tooltip-wrapper .theme-section-tooltip__image{background:#212121;border-radius:12px 12px 0 0;min-height:150px;padding:16px 20px 8px 21px}.theme-section-tooltip-wrapper .theme-section-tooltip__body{background:#151515;display:flex;flex-direction:column;gap:8px;padding:16px;white-space:normal}.theme-section-tooltip-wrapper .theme-section-tooltip__body-title{color:#f9f9f9;font-size:14px;font-weight:500;line-height:24px}.theme-section-tooltip-wrapper .theme-section-tooltip__body-desc{color:#aaa;font-size:14px;font-weight:400;line-height:24px}.theme-section-tooltip-wrapper .theme-section-tooltip__action{background:#151515;border-radius:0 0 12px 12px;border-top:1px solid #3b3b3b;display:flex;flex-direction:column;padding:16px}.theme-section-tooltip-wrapper .theme-section-tooltip__action button{background:#3c67ff;border-radius:8px;color:#f9f9f9;cursor:pointer;font-size:14px;font-weight:500;height:40px;line-height:24px;text-align:center;transition:all .15s ease-in;width:100%}.theme-section-tooltip-wrapper .theme-section-tooltip__action button:hover{background:#2856f8}.theme-section-tooltip-wrapper .theme-section-tooltip__action-limit button{background:#fdb913!important;color:#212121!important}.theme-section-tooltip-wrapper .theme-section-tooltip__action-limit button:hover{background:#fdc742!important}.theme-section-tooltip-wrapper .theme-section-tooltip__action-learn-more{color:#8aa4ff;cursor:pointer;font-size:12px;font-weight:500;line-height:20px;margin-top:8px;text-align:center;transition:all .15s ease-in}.theme-section-tooltip-wrapper .theme-section-tooltip__action-learn-more:hover{color:#b1c3ff}@media (max-width:767px){[data-toolbar-wrap] [data-toolbar-add-bottom],[data-toolbar-wrap] [data-toolbar-add-top]{height:28px;left:calc(50% - 14px);top:-14px;width:28px}}
1
+ [data-toolbar-wrap]{position:relative}[data-toolbar-wrap] [data-toolbar]{align-items:center;background:#3c67ff;border:1px solid #3c67ff;border-radius:6px 6px 0 0;color:#fff;cursor:pointer;display:flex;font-family:Inter,sans-serif,ui-sans-serif,system-ui;height:24px;left:0;max-width:unset;opacity:0;padding:4px;pointer-events:unset;position:absolute;top:-24px;transition:opacity 0ms ease-in-out;-webkit-user-select:none;user-select:none;visibility:hidden;white-space:nowrap;z-index:20}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent],[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent]{align-items:center;display:flex}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent] [data-toolbar-icon-drag],[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent] [data-toolbar-icon-drag]{display:none}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent] [data-toolbar-icon-drag] svg,[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent] [data-toolbar-icon-drag] svg{display:block;height:16px;max-width:unset;width:16px}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent] [data-toolbar-name],[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent] [data-toolbar-name]{display:block;font-size:12px;font-weight:500;padding-left:4px;padding-right:4px;white-space:nowrap}[data-toolbar-wrap] [data-toolbar] [data-toolbar-show-parent]{cursor:grab}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent]{background:#fff;background:#3c67ff;border-radius:8px;color:#fff;height:32px;left:0;opacity:1;padding:8px;position:absolute;top:-32px;visibility:visible;z-index:30}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent]:hover{background:#7190ff}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent]:before{background:transparent;bottom:-4px;content:"";height:4px;left:0;position:absolute;width:100%}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-parent-revert=true]:before{bottom:unset;top:-4px}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section=true]{background-color:#9144da;color:#fff}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section=true]:hover{background-color:#af7edd}[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section=true][data-toolbar-hover-focus],[data-toolbar-wrap] [data-toolbar] [data-toolbar-parent][data-toolbar-theme-section=true][data-toolbar-hover-focus]:hover{background:#ebddf8}[data-toolbar-wrap] [data-toolbar] [data-toolbar-create-theme-section]{border-left:1px solid;border-color:#d6d6d6;font-size:12px;font-weight:500;line-height:16px;margin-bottom:8px;margin-left:4px;margin-top:8px;padding-left:8px;padding-right:4px}[data-toolbar-wrap] [data-toolbar] [data-toolbar-active-create-theme-section],[data-toolbar-wrap] [data-toolbar] [data-toolbar-delete],[data-toolbar-wrap] [data-toolbar] [data-toolbar-duplicate],[data-toolbar-wrap] [data-toolbar] [data-toolbar-icon-parent],[data-toolbar-wrap] [data-toolbar] [data-toolbar-zoom-out]{display:none}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true]{background-color:#9144da;color:#fff}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-active] [data-toolbar-show-parent]:before{background-color:#af7edd}[data-toolbar-wrap] [data-toolbar-theme-section=true] [data-toolbar-duplicate]{border-color:#be86f3}[data-toolbar-wrap] [data-toolbar][data-toolbar-force-hover],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover]{border-width:0;opacity:1;transition-delay:.1s;visibility:visible;z-index:30}[data-toolbar-wrap] [data-toolbar][data-toolbar-force-hover]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-hover]:hover{background:#3c67ff;border-color:#3c67ff}[data-toolbar-wrap] [data-toolbar][data-toolbar-force-hover]:hover [data-toolbar-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover]:hover [data-toolbar-create-theme-section]{border-color:#3c67ff}[data-toolbar-wrap] [data-toolbar][data-toolbar-hover-revert]{border-radius:0 0 6px 6px;top:calc(100% - 1px)}[data-toolbar-wrap] [data-toolbar][data-toolbar-hover-inside]{border-radius:0 0 6px 6px;top:0}[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus]{background:#3c67ff;z-index:40}[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus]:hover{background:#3c67ff}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-hover][data-toolbar-hover-focus]{background:#9144da;padding:4px}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-active]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-hover]:hover{background:#9144da}[data-toolbar-wrap] [data-toolbar][data-toolbar-active]{background:#000;border-radius:8px;border-width:0;color:#fff;height:32px;opacity:1;top:-35px;visibility:visible;z-index:20}[data-toolbar-wrap] [data-toolbar][data-toolbar-active]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-hover-focus],[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-hover-focus]:hover{background:#000}[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-theme-section=true],[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-theme-section=true][data-toolbar-hover-focus]{background:#9144da}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent]{border-radius:6px;margin-right:8px;padding:4px;position:relative;transition:background .2s ease-in-out}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent]:before{background:#424242;content:"";height:calc(100% - 4px);position:absolute;right:-4px;top:2px;width:1px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] [data-toolbar-icon-parent]{display:block;transition:-webkit-transform .2s ease-in-out;transition:transform .2s ease-in-out;transition:transform .2s ease-in-out,-webkit-transform .2s ease-in-out}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] [data-toolbar-icon-parent] svg{display:block;height:16px;max-width:unset;width:16px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] [data-toolbar-icon-parent][data-toolbar-icon-parent-open=true]{-webkit-transform:rotate(180deg);transform:rotate(180deg)}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent]:hover{background:hsla(0,0%,88%,.2)}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] [data-toolbar-icon-drag]{display:block}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete],[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate],[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out]{border-radius:2px;display:block;padding:4px;transition:background .2s ease-in-out}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out] svg{display:block;height:16px;max-width:unset;width:16px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out]:hover{background:hsla(0,0%,88%,.2)}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section][data-toolbar-disable=true] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete][data-toolbar-disable=true] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate][data-toolbar-disable=true] svg,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out][data-toolbar-disable=true] svg{opacity:.4}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section][data-toolbar-disable=true]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete][data-toolbar-disable=true]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate][data-toolbar-disable=true]:hover,[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out][data-toolbar-disable=true]:hover{background:transparent}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section-wrapper]{border-left:1px solid #6a6a6a;border-right:1px solid #6a6a6a;margin:0 4px;padding:0 4px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section]{align-items:center;display:flex!important;gap:4px}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section] p{font-size:12px;font-weight:500}[data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-create-theme-section]{display:none}[data-toolbar-wrap] [data-toolbar][data-toolbar-active-overflow],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover-overflow]{left:unset;right:0}[data-toolbar-wrap] [data-toolbar][data-toolbar-active-revert]{top:calc(100% + 3px)}[data-toolbar-wrap] [data-toolbar][data-toolbar-active-inside]{top:4px}[data-toolbar-wrap] [data-toolbar][data-toolbar-section=true]{border-color:#d6d6d6;left:unset;right:0}[data-toolbar-wrap] [data-toolbar][data-toolbar-section=true][data-toolbar-active],[data-toolbar-wrap] [data-toolbar][data-toolbar-section=true][data-toolbar-hover-focus],[data-toolbar-wrap] [data-toolbar][data-toolbar-section=true][data-toolbar-hover-focus] [data-toolbar-create-theme-section]{border-color:#7190ff}[data-toolbar-wrap] [data-toolbar][data-toolbar-editor-inline-focus]{display:none}[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-active],[data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section=true][data-toolbar-hover-focus]{border-color:#9144da}[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-limit=true],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus][data-toolbar-limit=true],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-limit=true],[data-toolbar-wrap] [data-toolbar][data-toolbar-limit=true]{background:#f44336;border-color:#f44336;color:#fff}[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-limit=true] [data-toolbar-active-create-theme-section-wrapper],[data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-limit=true] [data-toolbar-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus][data-toolbar-limit=true] [data-toolbar-active-create-theme-section-wrapper],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus][data-toolbar-limit=true] [data-toolbar-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-limit=true] [data-toolbar-active-create-theme-section-wrapper],[data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-limit=true] [data-toolbar-create-theme-section],[data-toolbar-wrap] [data-toolbar][data-toolbar-limit=true] [data-toolbar-active-create-theme-section-wrapper],[data-toolbar-wrap] [data-toolbar][data-toolbar-limit=true] [data-toolbar-create-theme-section]{border-color:#fff}[data-toolbar-wrap] [data-outline]{border:1px solid #3c67ff;height:100%;left:0;opacity:0;pointer-events:none;position:absolute;top:0;transition:opacity 0ms ease-in-out;visibility:hidden;width:100%;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-force-hover],[data-toolbar-wrap] [data-outline][data-outline-hover]{opacity:1;transition-delay:.1s;visibility:visible;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-active]{opacity:1;visibility:visible;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-force-overlay],[data-toolbar-wrap] [data-outline][data-outline-overlay]{background:rgba(60,103,255,.1);transition-delay:0ms}[data-toolbar-wrap] [data-outline][data-outline-force-overlay][data-outline-theme-section=true],[data-toolbar-wrap] [data-outline][data-outline-overlay][data-outline-theme-section=true]{background:#ebddf866}[data-toolbar-wrap] [data-outline][data-outline-overlay-theme-section]{background:transparent}[data-toolbar-wrap] [data-outline][data-outline-hover][data-outline-section=true],[data-toolbar-wrap] [data-outline][data-outline-section=true][data-outline-active],[data-toolbar-wrap] [data-outline][data-outline-section=true][data-outline-hover-focus]{border-color:#3c67ff;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-editor-inline-focus]{border-color:transparent;outline:unset;z-index:0}[data-toolbar-wrap] [data-component-tag=Heading] [data-outline][data-outline-editor-inline-focus],[data-toolbar-wrap] [data-component-tag=Text] [data-outline][data-outline-editor-inline-focus]{border-color:#3c67ff;height:calc(100% + 4px);left:-2px;outline:4px solid rgba(60,103,255,.24);top:-2px;width:calc(100% + 4px);z-index:0}[data-toolbar-wrap] [data-component-tag=Section]>[data-toolbar] [data-toolbar-show-parent]{margin-right:0}[data-toolbar-wrap] [data-component-tag=Section]>[data-toolbar] [data-toolbar-show-parent]:before{display:none}[data-toolbar-wrap] [data-outline][data-outline-theme-section=true],[data-toolbar-wrap] [data-outline][data-outline-theme-section=true][data-outline-active],[data-toolbar-wrap] [data-outline][data-outline-theme-section=true][data-outline-hover-focus]{border-color:#9144da;z-index:0}[data-toolbar-wrap] [data-outline][data-outline-active][data-outline-limit=true],[data-toolbar-wrap] [data-outline][data-outline-hover][data-outline-hover-focus][data-outline-limit=true],[data-toolbar-wrap] [data-outline][data-outline-hover][data-outline-limit=true],[data-toolbar-wrap] [data-outline][data-outline-limit=true]{border-color:#f44336}[data-toolbar-wrap] [data-outline][data-outline-parent-hover],[data-toolbar-wrap] [data-outline][data-outline-section][data-outline-parent-hover]{border-style:dashed}[data-toolbar-wrap] [data-theme-section] [data-outline][data-outline-hover][data-outline-hover-focus],[data-toolbar-wrap] [data-theme-section] [data-toolbar-add-bottom],[data-toolbar-wrap] [data-theme-section] [data-toolbar-add-top],[data-toolbar-wrap] [data-theme-section] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus]{transition-delay:0ms}[data-toolbar-wrap] [data-theme-section] [data-toolbar-add-bottom],[data-toolbar-wrap] [data-theme-section] [data-toolbar-add-top]{border-color:#9144da}[data-toolbar-wrap] [data-theme-section] .button-text:after{display:none!important}[data-toolbar-wrap] [data-theme-section] .gp-text:hover{border-color:transparent!important}[data-toolbar-wrap] [data-theme-section-status]{align-items:center;background:#ebddf8;border-radius:3px;color:#212121;display:none;font-size:14px;font-weight:400;gap:4px;left:8px;line-height:24px;max-width:32px;overflow:hidden;padding:4px;position:absolute;top:8px;transition:max-width 1s ease-in-out;z-index:50}[data-toolbar-wrap] [data-theme-section-status-active=true]{display:flex}[data-toolbar-wrap] [data-theme-section-status-icon]{align-items:center;cursor:pointer;display:flex;flex-shrink:0;height:24px;justify-content:center;width:24px}[data-toolbar-wrap] [data-theme-section-status-text]{display:block;white-space:nowrap}[data-toolbar-wrap] [data-theme-section-status]:hover{max-width:100%}[data-toolbar-wrap] [data-toolbar-add-bottom],[data-toolbar-wrap] [data-toolbar-add-top]{align-items:center;background:#fff;border:1px solid #3c67ff;border-radius:8px;color:#3c67ff;cursor:pointer;display:flex;height:32px;justify-content:center;left:calc(50% - 16px);opacity:0;position:absolute;top:-16px;transition:border-color .2s ease-in-out,opacity 0ms ease-in-out;transition-delay:.1s;-webkit-user-select:none;user-select:none;visibility:hidden;width:32px;z-index:50}[data-toolbar-wrap] [data-toolbar-add-bottom] svg,[data-toolbar-wrap] [data-toolbar-add-top] svg{height:16px;transition:-webkit-transform .2s ease-in-out;transition:transform .2s ease-in-out;transition:transform .2s ease-in-out,-webkit-transform .2s ease-in-out;width:16px}[data-toolbar-wrap] [data-toolbar-add-bottom]:hover,[data-toolbar-wrap] [data-toolbar-add-top]:hover{background-color:#f6f6f6}[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-disable=true],[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-disable=true]:hover,[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-disable=true],[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-disable=true]:hover{background:#f4f4f4;border-color:#d6d6d6;color:#d6d6d6}[data-toolbar-wrap] [data-toolbar-add-bottom]{bottom:-16px;top:unset}[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-add-open=true] svg,[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-add-open=true] svg{-webkit-transform:rotate(45deg);transform:rotate(45deg)}[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-add-active],[data-toolbar-wrap] [data-toolbar-add-bottom][data-toolbar-add-hover],[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-add-active],[data-toolbar-wrap] [data-toolbar-add-top][data-toolbar-add-hover]{opacity:1;visibility:visible}[data-toolbar-wrap] [data-spacing]{z-index:10}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom]{bottom:0;display:flex;display:none;justify-content:center;left:0;position:absolute;width:100%;z-index:10}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom] [data-spacing-margin-bottom-bg]{align-items:center;background-color:#3c67ff33;display:flex;justify-content:center;left:0;position:absolute;top:0;width:100%}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom] [data-spacing-margin-bottom-bg] [data-spacing-margin-bottom-value]{background-color:#3c67ff;border-radius:4px;color:#fff;display:none;font-size:8px;font-weight:700;padding:2px;position:absolute}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom] [data-spacing-margin-bottom-drag]{background-color:#3c67ff;border-top-left-radius:4px;border-top-right-radius:4px;bottom:0;cursor:ns-resize;height:4px;position:absolute;-webkit-transform:translateY(-100%);transform:translateY(-100%);transition:height .2s;width:40px}[data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom] [data-spacing-margin-bottom-drag]:hover{height:6px}[data-toolbar-wrap] [data-spacing][data-spacing-theme-section=true] [data-spacing-margin-bottom-bg]{background-color:#9144da33}[data-toolbar-wrap] [data-spacing][data-spacing-theme-section=true] [data-spacing-margin-bottom-bg] [data-spacing-margin-bottom-value],[data-toolbar-wrap] [data-spacing][data-spacing-theme-section=true] [data-spacing-margin-bottom-drag]{background-color:#9144da}[data-toolbar-wrap] [data-spacing-margin-bottom][data-spacing-margin-bottom-active]{display:flex}[data-toolbar-wrap] [data-spacing][data-spacing-hidden]{display:none}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip]{background-color:#676767!important;border-radius:6px;color:#fff;font-size:16px;max-width:unset;opacity:0;padding:8px 12px;pointer-events:none;position:absolute;text-align:center;transition:opacity 1s;white-space:nowrap;width:unset;z-index:1}[data-toolbar-wrap] [data-toolbar-tooltip-trigger]:hover [data-toolbar-tooltip]{opacity:1}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=right]{left:105%;top:-5px}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=right]:after{border:5px solid transparent;border-right-color:#676767;content:" ";margin-top:-5px;position:absolute;right:100%;top:50%}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=left]{right:105%;top:-5px}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=left]:after{border:5px solid transparent;border-left-color:#676767;content:" ";left:100%;margin-top:-5px;position:absolute;top:50%}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=top]{bottom:105%;left:0}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=top]:after{border:5px solid transparent;border-top-color:#676767;content:" ";left:50%;margin-left:-5px;position:absolute;top:100%}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=bottom]{left:0;top:105%}[data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position=bottom]:after{border:5px solid transparent;border-bottom-color:#676767;bottom:100%;content:" ";left:50%;margin-left:-5px;position:absolute}[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-duplicate]{position:relative}[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-duplicate] [data-toolbar-tooltip]{left:unset;margin-top:12px;right:0}[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-duplicate] [data-toolbar-tooltip][data-toolbar-tooltip-position=bottom]:after{content:" ";left:unset;right:6px}[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-add-bottom] [data-toolbar-tooltip],[data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-add-top] [data-toolbar-tooltip]{left:50%;margin-bottom:12px;-webkit-transform:translateX(-50%);transform:translateX(-50%)}[data-toolbar-debug] [data-outline],[data-toolbar-debug] [data-toolbar]{opacity:1;visibility:visible}[data-toolbar-active=true] .theme-section-tooltip{padding-top:16px!important;right:-53px!important}[data-toolbar-active=true] .theme-section-tooltip:before{right:45%!important;top:12px!important}.theme-section-tooltip-wrapper{position:relative}.theme-section-tooltip-wrapper .theme-section-tooltip{border-radius:12px;cursor:default;display:flex;flex-direction:column;min-width:284px;padding-top:9px;position:absolute;right:-4px;top:100%}.theme-section-tooltip-wrapper .theme-section-tooltip:before{background:#212121;content:"";height:8px;position:absolute;right:16px;top:5px;-webkit-transform:rotate(45deg);transform:rotate(45deg);width:8px}.theme-section-tooltip-wrapper .theme-section-tooltip__image{background:#212121;border-radius:12px 12px 0 0;min-height:150px;padding:16px 20px 8px 21px}.theme-section-tooltip-wrapper .theme-section-tooltip__body{background:#151515;display:flex;flex-direction:column;gap:8px;padding:16px;white-space:normal}.theme-section-tooltip-wrapper .theme-section-tooltip__body-title{color:#f9f9f9;font-size:14px;font-weight:500;line-height:24px}.theme-section-tooltip-wrapper .theme-section-tooltip__body-desc{color:#aaa;font-size:14px;font-weight:400;line-height:24px}.theme-section-tooltip-wrapper .theme-section-tooltip__action{background:#151515;border-radius:0 0 12px 12px;border-top:1px solid #3b3b3b;display:flex;flex-direction:column;padding:16px}.theme-section-tooltip-wrapper .theme-section-tooltip__action button{background:#3c67ff;border-radius:8px;color:#f9f9f9;cursor:pointer;font-size:14px;font-weight:500;height:40px;line-height:24px;text-align:center;transition:all .15s ease-in;width:100%}.theme-section-tooltip-wrapper .theme-section-tooltip__action button:hover{background:#2856f8}.theme-section-tooltip-wrapper .theme-section-tooltip__action-limit button{background:#fdb913!important;color:#212121!important}.theme-section-tooltip-wrapper .theme-section-tooltip__action-limit button:hover{background:#fdc742!important}.theme-section-tooltip-wrapper .theme-section-tooltip__action-learn-more{color:#8aa4ff;cursor:pointer;font-size:12px;font-weight:500;line-height:20px;margin-top:8px;text-align:center;transition:all .15s ease-in}.theme-section-tooltip-wrapper .theme-section-tooltip__action-learn-more:hover{color:#b1c3ff}@media (max-width:767px){[data-toolbar-wrap] [data-toolbar-add-bottom],[data-toolbar-wrap] [data-toolbar-add-top]{height:28px;left:calc(50% - 14px);top:-14px;width:28px}[data-toolbar-wrap] [data-toolbar-add-bottom]{bottom:-14px;top:unset}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gem-sdk/styles",
3
- "version": "1.23.0-staging.155",
3
+ "version": "1.23.0-staging.157",
4
4
  "description": "Largely classless, blazing fast and super light-weight. Bonsai, a base CSS framework for modern browsers",
5
5
  "license": "MIT",
6
6
  "main": "src/index.js",
@@ -5,15 +5,15 @@
5
5
  [data-toolbar] {
6
6
  position: absolute;
7
7
  z-index: 20;
8
- height: 32px;
9
- top: -32px;
8
+ height: 24px;
9
+ top: -24px;
10
10
  left: 0;
11
11
  max-width: unset;
12
12
  display: flex;
13
13
  align-items: center;
14
14
  padding: 4px;
15
15
  color: #fff;
16
- background: #fff;
16
+ background: #3c67ff;
17
17
  border: solid 1px #3c67ff;
18
18
  border-radius: 6px 6px 0 0;
19
19
  white-space: nowrap;
@@ -58,7 +58,7 @@
58
58
  [data-toolbar-parent] {
59
59
  position: absolute;
60
60
  top: -32px;
61
- left: -1px;
61
+ left: 0px;
62
62
  height: 32px;
63
63
  padding: 8px;
64
64
  opacity: 1;
@@ -70,16 +70,32 @@
70
70
  background: #3c67ff;
71
71
 
72
72
  &:hover {
73
- background: #7190FF;
73
+ background: #7190ff;
74
+ }
75
+
76
+ /* fix hover parent */
77
+ &:before {
78
+ content: '';
79
+ width: 100%;
80
+ height: 4px;
81
+ background: transparent;
82
+ bottom: -4px;
83
+ left: 0;
84
+ position: absolute;
85
+ }
86
+
87
+ &[data-toolbar-parent-revert='true']:before {
88
+ bottom: unset;
89
+ top: -4px;
74
90
  }
75
91
  }
76
92
 
77
93
  [data-toolbar-parent][data-toolbar-theme-section='true'] {
78
- border: solid 1px #9144da;
79
- color: #9144da;
94
+ background-color: #9144da;
95
+ color: #fff;
80
96
 
81
97
  &:hover {
82
- background: #ebddf8;
98
+ background-color: #af7edd;
83
99
  }
84
100
 
85
101
  &[data-toolbar-hover-focus] {
@@ -115,10 +131,15 @@
115
131
  }
116
132
 
117
133
  [data-toolbar][data-toolbar-theme-section='true'] {
118
- color: #9144da;
119
- border: solid 1px #9144da;
134
+ background-color: #9144da;
135
+ color: #fff;
136
+
137
+ &[data-toolbar-active] [data-toolbar-show-parent] {
138
+ &:before {
139
+ background-color: #af7edd;
140
+ }
141
+ }
120
142
  }
121
-
122
143
 
123
144
  [data-toolbar-theme-section='true'] [data-toolbar-duplicate] {
124
145
  border-color: #be86f3;
@@ -132,7 +153,6 @@
132
153
  z-index: 30;
133
154
  border-width: 0;
134
155
  transition-delay: 100ms;
135
- border-width: 0;
136
156
 
137
157
  &:hover {
138
158
  background: #3c67ff;
@@ -146,16 +166,17 @@
146
166
 
147
167
  [data-toolbar][data-toolbar-hover-revert] {
148
168
  top: calc(100% - 1px);
169
+ border-radius: 0 0 6px 6px;
149
170
  }
150
171
 
151
172
  [data-toolbar][data-toolbar-hover-inside] {
152
173
  top: 0;
174
+ border-radius: 0 0 6px 6px;
153
175
  }
154
176
 
155
177
  [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus] {
156
178
  background: #3c67ff;
157
179
  z-index: 40;
158
- padding: 4px 8px;
159
180
 
160
181
  &:hover {
161
182
  background: #3c67ff;
@@ -163,14 +184,13 @@
163
184
  }
164
185
 
165
186
  [data-toolbar][data-toolbar-theme-section='true'][data-toolbar-hover][data-toolbar-hover-focus] {
166
- background: #ebddf8;
187
+ background: #9144da;
167
188
  padding: 4px;
168
189
  }
169
190
 
170
191
  [data-toolbar][data-toolbar-theme-section='true'][data-toolbar-hover] {
171
192
  &:hover {
172
- background: #ebddf8;
173
- border-color: #9144da;
193
+ background: #9144da;
174
194
  }
175
195
  }
176
196
 
@@ -216,11 +236,21 @@
216
236
  margin-right: 8px;
217
237
  border-radius: 6px;
218
238
  transition: background 200ms ease-in-out;
219
- position: relative ;
239
+ position: relative;
240
+
241
+ &:before {
242
+ position: absolute;
243
+ content: '';
244
+ background: #424242;
245
+ width: 1px;
246
+ height: calc(100% - 4px);
247
+ right: -4px;
248
+ top: 2px;
249
+ }
220
250
 
221
251
  &:before {
222
252
  position: absolute;
223
- content: "";
253
+ content: '';
224
254
  background: #424242;
225
255
  width: 1px;
226
256
  height: calc(100% - 4px);
@@ -307,18 +337,18 @@
307
337
  }
308
338
  }
309
339
 
310
- [data-toolbar][data-toolbar-active-overflow],
340
+ [data-toolbar][data-toolbar-active-overflow],
311
341
  [data-toolbar][data-toolbar-hover-overflow] {
312
342
  left: unset;
313
343
  right: 0;
314
344
  }
315
345
 
316
346
  [data-toolbar][data-toolbar-active-revert] {
317
- top: calc(100% - 1px);
347
+ top: calc(100% + 3px);
318
348
  }
319
349
 
320
350
  [data-toolbar][data-toolbar-active-inside] {
321
- top: 0;
351
+ top: 4px;
322
352
  }
323
353
 
324
354
  [data-toolbar][data-toolbar-section='true'] {
@@ -329,12 +359,12 @@
329
359
 
330
360
  [data-toolbar][data-toolbar-section='true'][data-toolbar-hover-focus]
331
361
  [data-toolbar-create-theme-section] {
332
- border-color: #7190FF;
362
+ border-color: #7190ff;
333
363
  }
334
364
 
335
365
  [data-toolbar][data-toolbar-section='true'][data-toolbar-hover-focus],
336
366
  [data-toolbar][data-toolbar-section='true'][data-toolbar-active] {
337
- border-color: #7190FF;
367
+ border-color: #7190ff;
338
368
  }
339
369
 
340
370
  [data-toolbar][data-toolbar-editor-inline-focus] {
@@ -402,12 +432,12 @@
402
432
  }
403
433
 
404
434
  [data-outline][data-outline-overlay-theme-section] {
405
- background: #ebddf83d;
435
+ background: transparent;
406
436
  }
407
437
 
408
438
  [data-outline][data-outline-hover][data-outline-section='true'] {
409
439
  border-color: #3c67ff;
410
- z-index: -1;
440
+ z-index: 0;
411
441
  }
412
442
 
413
443
  [data-outline][data-outline-section='true'][data-outline-hover-focus],
@@ -435,7 +465,7 @@
435
465
  z-index: 0;
436
466
  }
437
467
  }
438
-
468
+
439
469
  [data-component-tag='Section'] {
440
470
  /* disable divider */
441
471
  > [data-toolbar] [data-toolbar-show-parent] {
@@ -474,7 +504,12 @@
474
504
  [data-toolbar-add-bottom] {
475
505
  transition-delay: 0ms;
476
506
  }
477
-
507
+
508
+ [data-toolbar-add-top],
509
+ [data-toolbar-add-bottom] {
510
+ border-color: #9144da;
511
+ }
512
+
478
513
  .button-text::after {
479
514
  display: none !important;
480
515
  }
@@ -537,19 +572,20 @@
537
572
  align-items: center;
538
573
  background: #fff;
539
574
  color: #3c67ff;
540
- border: solid 1px #d6d6d6;
541
- border-radius: 3px;
575
+ border: solid 1px #3c67ff;
576
+ border-radius: 8px;
542
577
  cursor: pointer;
543
578
  position: absolute;
544
579
  z-index: 50;
545
580
  left: calc(50% - 16px);
546
581
  top: -16px;
547
- display: none;
582
+ display: flex;
583
+ opacity: 0;
584
+ visibility: hidden;
548
585
  user-select: none;
549
586
  transition:
550
587
  border-color 200ms ease-in-out,
551
588
  opacity 0ms ease-in-out;
552
- transition: border-color 200ms ease-in-out, opacity 0ms ease-in-out;
553
589
  transition-delay: 100ms;
554
590
 
555
591
  @media (max-width: 767px) {
@@ -568,7 +604,7 @@
568
604
  }
569
605
 
570
606
  &:hover {
571
- border-color: #3c67ff;
607
+ background-color: #f6f6f6;
572
608
  }
573
609
 
574
610
  &[data-toolbar-disable='true'] {
@@ -587,6 +623,13 @@
587
623
  [data-toolbar-add-bottom] {
588
624
  top: unset;
589
625
  bottom: -16px;
626
+
627
+ @media (max-width: 767px) {
628
+ & {
629
+ top: unset;
630
+ bottom: -14px;
631
+ }
632
+ }
590
633
  }
591
634
 
592
635
  /* Active add state */
@@ -599,12 +642,14 @@
599
642
 
600
643
  [data-toolbar-add-top][data-toolbar-add-hover],
601
644
  [data-toolbar-add-bottom][data-toolbar-add-hover] {
602
- display: flex;
645
+ opacity: 1;
646
+ visibility: visible;
603
647
  }
604
648
 
605
649
  [data-toolbar-add-top][data-toolbar-add-active],
606
650
  [data-toolbar-add-bottom][data-toolbar-add-active] {
607
- display: flex;
651
+ opacity: 1;
652
+ visibility: visible;
608
653
  }
609
654
 
610
655
  /* Resize spacing */
@@ -806,7 +851,6 @@
806
851
  }
807
852
  }
808
853
 
809
-
810
854
  [data-toolbar-debug] {
811
855
  [data-toolbar] {
812
856
  opacity: 1;