@gem-sdk/styles 1.36.8 → 2.0.0-dev.871

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/builder.css CHANGED
@@ -224,12 +224,12 @@
224
224
  background-color: #d8e1ff !important;
225
225
  }
226
226
 
227
- #visual-content .fake-placeholder[is-drag-to-theme-section='true'] {
227
+ #visual-content .fake-placeholder[is-drag-to-theme-section='true'], #visual-content .fake-placeholder[is-drag-to-shopify-section='true'] {
228
228
  background-color: rgba(254, 228, 227, 0.24) !important;
229
229
  display: block;
230
230
  }
231
231
 
232
- #visual-content .fake-placeholder[is-drag-to-theme-section='true'] .drag-to-theme-section-message {
232
+ #visual-content .fake-placeholder[is-drag-to-theme-section='true'] .drag-to-section-message, #visual-content .fake-placeholder[is-drag-to-shopify-section='true'] .drag-to-section-message {
233
233
  display: flex;
234
234
  align-items: center;
235
235
  position: -webkit-sticky;
@@ -250,11 +250,11 @@
250
250
  background: #f44336 !important;
251
251
  }
252
252
 
253
- #visual-content .fake-placeholder[is-drag-to-theme-section='true'] .drag-to-theme-section-message.exceed-limit {
253
+ #visual-content .fake-placeholder[is-drag-to-theme-section='true'] .drag-to-section-message.exceed-limit, #visual-content .fake-placeholder[is-drag-to-shopify-section='true'] .drag-to-section-message.exceed-limit {
254
254
  margin-left: 48px;
255
255
  }
256
256
 
257
- #visual-content .fake-placeholder[is-drag-to-theme-section='true'] .drag-to-theme-section-message-icon {
257
+ #visual-content .fake-placeholder[is-drag-to-theme-section='true'] .drag-to-section-message-icon, #visual-content .fake-placeholder[is-drag-to-shopify-section='true'] .drag-to-section-message-icon {
258
258
  width: 24px;
259
259
  height: 24px;
260
260
  display: flex;
@@ -262,10 +262,16 @@
262
262
  justify-content: center;
263
263
  }
264
264
 
265
- #visual-content .fake-placeholder[is-drag-to-theme-section='true'] .drag-to-theme-section-message svg {
265
+ #visual-content .fake-placeholder[is-drag-to-theme-section='true'] .drag-to-section-message svg, #visual-content .fake-placeholder[is-drag-to-shopify-section='true'] .drag-to-section-message svg {
266
266
  margin-right: 4px;
267
267
  }
268
268
 
269
+ #visual-content .fake-placeholder[is-drag-to-exceeded-section='true'] {
270
+ background-color: rgba(244,67,54, 0.08) !important;
271
+ border: 1px solid rgba(244,67,54) !important;
272
+ display: block;
273
+ }
274
+
269
275
  #visual-content .fake-placeholder[is-component-dragging='true'] {
270
276
  background-color: #8aa4ff66 !important;
271
277
  }
@@ -400,6 +406,17 @@
400
406
  outline: 4px solid #9144da3d !important;
401
407
  }
402
408
 
409
+ .post-purchase-page {
410
+ font-size: 14px;
411
+ font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
412
+ line-height: 15px;
413
+ }
414
+
415
+ .post-purchase-page select:focus {
416
+ border-color: #1879b9;
417
+ box-shadow: 0 0 0 1px #1879b9;
418
+ }
419
+
403
420
  /* .button-text.ck p {
404
421
  overflow: hidden;
405
422
  text-overflow: ellipsis;
@@ -452,6 +469,10 @@
452
469
  border-bottom-width: 6px;
453
470
  }
454
471
 
472
+ .editor-content {
473
+ font-family: Inter, sans-serif, ui-sans-serif, system-ui !important;
474
+ }
475
+
455
476
  @media (max-width: 768px) {
456
477
  .gps-suggestion-item:hover .item-link {
457
478
  width: 196px;
@@ -460,4 +481,4 @@
460
481
  .gps-suggestion-item .item-link {
461
482
  width: 196px;
462
483
  }
463
- }
484
+ }
@@ -1 +1 @@
1
- .builder{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.builder [disabled]{pointer-events:auto}.builder [data-slot=children]{visibility:visible}.builder [data-slot=children]:after{color:#aaa;visibility:visible}.builder [data-slot=children] .drag-placeholder{height:100%}.builder .generate-image-to-layout-btn{background-image:linear-gradient(270.07deg,#874cfd .03%,#3c38e1 99.92%);position:relative;z-index:1}.builder .generate-image-to-layout-btn:before{background-image:linear-gradient(270.07deg,#3633cc .03%,#6d3dcc 99.92%);border-radius:3px;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease-out;z-index:-1}.builder .btn-disable{background-color:#f4f4f4;background-image:none;color:#9e9e9e;cursor:not-allowed}.builder .generate-image-to-layout-btn:hover:before{opacity:1}.builder .image-to-layout-input-border{border:1px solid #3c38e1;border-radius:3px}.builder .image-to-layout-input-wrapper-modal{position:relative}.builder .image-to-layout-input-wrapper,.builder .image-to-layout-input-wrapper-add-section{background:#fff;background-clip:padding-box;box-sizing:border-box;position:relative}.image-to-layout-input-wrapper-add-section{border:1px solid #3c67ff}.gps-image-to-layout-progress-bar{background:linear-gradient(270.07deg,#874cfd .03%,#3c38e1 99.92%)}.drag-placeholder{display:none;width:100%}#storefront{position:relative;z-index:20}#visual-content{display:none;font-family:Inter,sans-serif,ui-sans-serif,system-ui!important;height:100%;left:0;min-height:100vh;position:absolute;top:0;width:100%;z-index:50}#visual-content .fake-placeholder{background:transparent;background-image:url(//d1um8515vdn9kb.cloudfront.net/images/background-pattern.png);left:0;position:absolute;top:0;visibility:hidden;z-index:0}#visual-content .fake-placeholder.fake-placeholder-slot{background:transparent}#visual-content .fake-placeholder.has-section{background-color:#3c67ff!important;background-image:none;border:none!important;height:6px;margin:0!important;visibility:visible}#visual-content .fake-placeholder.visual-placeholder-error{background-color:#fee4e3!important}#visual-content .fake-placeholder.visual-placeholder-error .limitation-error-content{display:none}#visual-content .fake-placeholder.visual-placeholder-error{border:1px dashed #f44336!important;color:#f44336!important;font-family:Inter,sans-serif,ui-sans-serif,system-ui;font-size:14px;font-weight:500;line-height:150%;position:relative;text-align:center;visibility:visible}#visual-content .fake-placeholder.visual-placeholder-error.children-error{background-color:#f44336!important;border:none!important}#visual-content .fake-placeholder.visual-placeholder-error.limitation-error .limitation-error-content{align-items:center;background-color:#fee4e3!important;border-radius:3px;display:flex;height:29px;padding:4px 8px}#visual-content .fake-placeholder.visual-placeholder-error.limitation-error .limitation-error-content span{font-size:14px;font-weight:500;line-height:150%;margin-left:8px}#visual-content .fake-placeholder.visual-placeholder{align-items:center;background-color:#8aa4ff66;color:#3c67ff;display:flex;font-size:14px;font-weight:500;justify-content:center;line-height:150%;visibility:visible;z-index:20}#visual-content .fake-placeholder.visual-placeholder-theme-section[is-component-dragging=true]{background-color:#ebddf866!important}#visual-content .fake-placeholder.visual-placeholder-theme-section{background-color:#ebddf866}#visual-content .fake-placeholder.visual-placeholder-theme-section.visual-placeholder-error.has-section:not([is-component-dragging=true]){background-color:#f44336!important}#visual-content .fake-placeholder.visual-placeholder-theme-section.has-section:not([is-component-dragging=true]){background-color:#9144da!important}#visual-content .fake-placeholder.visual-placeholder-child-on-sections{margin:16px!important}#visual-content .fake-placeholder.visual-placeholder-between-sections{background-color:#3c67ff;background-image:none;border:none;height:6px;margin:0!important;visibility:visible}#visual-content .fake-placeholder.not-show{display:none}#visual-content .fake-placeholder[is-blank-page=true]{background-color:#d8e1ff!important}#visual-content .fake-placeholder[is-drag-to-theme-section=true]{background-color:hsla(2,93%,94%,.24)!important;display:block}#visual-content .fake-placeholder[is-drag-to-theme-section=true] .drag-to-theme-section-message{align-items:center;background:#f44336!important;border-radius:3px!important;color:#f9f9f9!important;display:flex;font-size:14px;font-weight:400;left:8px;line-height:24px;margin-left:8px;margin-top:8px;padding:4px;position:-webkit-sticky;position:sticky;top:8px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}#visual-content .fake-placeholder[is-drag-to-theme-section=true] .drag-to-theme-section-message.exceed-limit{margin-left:48px}#visual-content .fake-placeholder[is-drag-to-theme-section=true] .drag-to-theme-section-message-icon{align-items:center;display:flex;height:24px;justify-content:center;width:24px}#visual-content .fake-placeholder[is-drag-to-theme-section=true] .drag-to-theme-section-message svg{margin-right:4px}#visual-content .fake-placeholder[is-component-dragging=true]{background-color:#8aa4ff66!important}[contenteditable=true]:active,[contenteditable=true]:focus,[contenteditable=true]:focus-visible{outline:none;overflow:hidden}[data-component-is-third-party=true]{background-color:#f4f4f4}[data-component-tag=ProductDescription],[data-component-tag=ProductPrice],[data-component-tag=ProductTag],[data-component-tag=ProductTitle]{cursor:default}:root{--selection-bg:#accef7}.builder ::selection{background:var(--selection-bg);color:currentColor}.builder ::-moz-selection{background:var(--selection-bg);color:currentColor}.gps-drag-element-here{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='none' stroke='%233C67FFFF' stroke-dasharray='12,12' stroke-dashoffset='72' stroke-linecap='square' stroke-width='2'/%3E%3C/svg%3E")}.gps-drag-element-here,.gps-page-suggestion{font-family:Inter,sans-serif,ui-sans-serif,system-ui!important}.gps-page-suggestion{background:#fff;border-radius:3px;box-shadow:0 4px 16px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.12)}.gps-suggestion-item .gps-suggestion-item-btn{display:flex}.gps-suggestion-item .item-link{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:360px}.gps-suggestion-item:hover .item-link{width:360px}.gps-base-font-family{font-family:Inter,sans-serif,ui-sans-serif,system-ui!important}.btn-disable:before{background:none!important;background-color:#f4f4f4!important;color:#9e9e9e}.gps-image-detection-section:hover .gps-generating-actions{display:flex}.gps-generating-section-text{-webkit-text-fill-color:transparent;background:-webkit-linear-gradient(#874cfd,#3c38e1);-webkit-background-clip:text}.ck-blurred{cursor:pointer}.ck-focused{cursor:text}.button-text{position:relative}.button-text.ck-focused,.child-item-text.ck-focused{border-color:transparent!important;box-shadow:0 0 0 2px hsla(0,0%,100%,0),0 0 0 1px #3c67ff,0 0 0 5px #3c67ff3d}.theme-section-editor .child-item-text:hover{border-color:#9144da!important}.theme-section-editor .button-text:hover:after{border:1px solid #9144da}.theme-section-editor .button-text.ck-focused,.theme-section-editor .child-item-text.ck-focused{border-color:transparent!important;box-shadow:0 0 0 2px hsla(0,0%,100%,0),0 0 0 1px #9144da,0 0 0 5px #9144da3d}.theme-section-editor [data-component-tag=Heading] [data-outline][data-outline-editor-inline-focus],.theme-section-editor [data-component-tag=Text] [data-outline][data-outline-editor-inline-focus]{border-color:#9144da;outline:4px solid #9144da3d!important}.gp-text.ck p{word-break:break-word}.button-text:hover:after{border:1px solid #3c67ff;content:"";height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}.button-text.ck-focused:hover:after{border:0!important}.sticky-overlay{align-items:center;background-color:#3c67ff26;border:2px solid #3c67ff;color:#3c67ff;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1}.sticky-overlay.highlight-top{border-top-width:6px}.sticky-overlay.highlight-bottom{border-bottom-width:6px}@media (max-width:768px){.gps-suggestion-item .item-link,.gps-suggestion-item:hover .item-link{width:196px}}
1
+ .builder{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.builder [disabled]{pointer-events:auto}.builder [data-slot=children]{visibility:visible}.builder [data-slot=children]:after{color:#aaa;visibility:visible}.builder [data-slot=children] .drag-placeholder{height:100%}.builder .generate-image-to-layout-btn{background-image:linear-gradient(270.07deg,#874cfd .03%,#3c38e1 99.92%);position:relative;z-index:1}.builder .generate-image-to-layout-btn:before{background-image:linear-gradient(270.07deg,#3633cc .03%,#6d3dcc 99.92%);border-radius:3px;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease-out;z-index:-1}.builder .btn-disable{background-color:#f4f4f4;background-image:none;color:#9e9e9e;cursor:not-allowed}.builder .generate-image-to-layout-btn:hover:before{opacity:1}.builder .image-to-layout-input-border{border:1px solid #3c38e1;border-radius:3px}.builder .image-to-layout-input-wrapper-modal{position:relative}.builder .image-to-layout-input-wrapper,.builder .image-to-layout-input-wrapper-add-section{background:#fff;background-clip:padding-box;box-sizing:border-box;position:relative}.image-to-layout-input-wrapper-add-section{border:1px solid #3c67ff}.gps-image-to-layout-progress-bar{background:linear-gradient(270.07deg,#874cfd .03%,#3c38e1 99.92%)}.drag-placeholder{display:none;width:100%}#storefront{position:relative;z-index:20}#visual-content{display:none;font-family:Inter,sans-serif,ui-sans-serif,system-ui!important;height:100%;left:0;min-height:100vh;position:absolute;top:0;width:100%;z-index:50}#visual-content .fake-placeholder{background:transparent;background-image:url(//d1um8515vdn9kb.cloudfront.net/images/background-pattern.png);left:0;position:absolute;top:0;visibility:hidden;z-index:0}#visual-content .fake-placeholder.fake-placeholder-slot{background:transparent}#visual-content .fake-placeholder.has-section{background-color:#3c67ff!important;background-image:none;border:none!important;height:6px;margin:0!important;visibility:visible}#visual-content .fake-placeholder.visual-placeholder-error{background-color:#fee4e3!important}#visual-content .fake-placeholder.visual-placeholder-error .limitation-error-content{display:none}#visual-content .fake-placeholder.visual-placeholder-error{border:1px dashed #f44336!important;color:#f44336!important;font-family:Inter,sans-serif,ui-sans-serif,system-ui;font-size:14px;font-weight:500;line-height:150%;position:relative;text-align:center;visibility:visible}#visual-content .fake-placeholder.visual-placeholder-error.children-error{background-color:#f44336!important;border:none!important}#visual-content .fake-placeholder.visual-placeholder-error.limitation-error .limitation-error-content{align-items:center;background-color:#fee4e3!important;border-radius:3px;display:flex;height:29px;padding:4px 8px}#visual-content .fake-placeholder.visual-placeholder-error.limitation-error .limitation-error-content span{font-size:14px;font-weight:500;line-height:150%;margin-left:8px}#visual-content .fake-placeholder.visual-placeholder{align-items:center;background-color:#8aa4ff66;color:#3c67ff;display:flex;font-size:14px;font-weight:500;justify-content:center;line-height:150%;visibility:visible;z-index:20}#visual-content .fake-placeholder.visual-placeholder-theme-section[is-component-dragging=true]{background-color:#ebddf866!important}#visual-content .fake-placeholder.visual-placeholder-theme-section{background-color:#ebddf866}#visual-content .fake-placeholder.visual-placeholder-theme-section.visual-placeholder-error.has-section:not([is-component-dragging=true]){background-color:#f44336!important}#visual-content .fake-placeholder.visual-placeholder-theme-section.has-section:not([is-component-dragging=true]){background-color:#9144da!important}#visual-content .fake-placeholder.visual-placeholder-child-on-sections{margin:16px!important}#visual-content .fake-placeholder.visual-placeholder-between-sections{background-color:#3c67ff;background-image:none;border:none;height:6px;margin:0!important;visibility:visible}#visual-content .fake-placeholder.not-show{display:none}#visual-content .fake-placeholder[is-blank-page=true]{background-color:#d8e1ff!important}#visual-content .fake-placeholder[is-drag-to-shopify-section=true],#visual-content .fake-placeholder[is-drag-to-theme-section=true]{background-color:hsla(2,93%,94%,.24)!important;display:block}#visual-content .fake-placeholder[is-drag-to-shopify-section=true] .drag-to-section-message,#visual-content .fake-placeholder[is-drag-to-theme-section=true] .drag-to-section-message{align-items:center;background:#f44336!important;border-radius:3px!important;color:#f9f9f9!important;display:flex;font-size:14px;font-weight:400;left:8px;line-height:24px;margin-left:8px;margin-top:8px;padding:4px;position:-webkit-sticky;position:sticky;top:8px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}#visual-content .fake-placeholder[is-drag-to-shopify-section=true] .drag-to-section-message.exceed-limit,#visual-content .fake-placeholder[is-drag-to-theme-section=true] .drag-to-section-message.exceed-limit{margin-left:48px}#visual-content .fake-placeholder[is-drag-to-shopify-section=true] .drag-to-section-message-icon,#visual-content .fake-placeholder[is-drag-to-theme-section=true] .drag-to-section-message-icon{align-items:center;display:flex;height:24px;justify-content:center;width:24px}#visual-content .fake-placeholder[is-drag-to-shopify-section=true] .drag-to-section-message svg,#visual-content .fake-placeholder[is-drag-to-theme-section=true] .drag-to-section-message svg{margin-right:4px}#visual-content .fake-placeholder[is-drag-to-exceeded-section=true]{background-color:rgba(244,67,54,.08)!important;border:1px solid #f44336!important;display:block}#visual-content .fake-placeholder[is-component-dragging=true]{background-color:#8aa4ff66!important}[contenteditable=true]:active,[contenteditable=true]:focus,[contenteditable=true]:focus-visible{outline:none;overflow:hidden}[data-component-is-third-party=true]{background-color:#f4f4f4}[data-component-tag=ProductDescription],[data-component-tag=ProductPrice],[data-component-tag=ProductTag],[data-component-tag=ProductTitle]{cursor:default}:root{--selection-bg:#accef7}.builder ::selection{background:var(--selection-bg);color:currentColor}.builder ::-moz-selection{background:var(--selection-bg);color:currentColor}.gps-drag-element-here{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='100%25' height='100%25' fill='none' stroke='%233C67FFFF' stroke-dasharray='12,12' stroke-dashoffset='72' stroke-linecap='square' stroke-width='2'/%3E%3C/svg%3E")}.gps-drag-element-here,.gps-page-suggestion{font-family:Inter,sans-serif,ui-sans-serif,system-ui!important}.gps-page-suggestion{background:#fff;border-radius:3px;box-shadow:0 4px 16px rgba(0,0,0,.06),0 4px 16px rgba(0,0,0,.12)}.gps-suggestion-item .gps-suggestion-item-btn{display:flex}.gps-suggestion-item .item-link{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:360px}.gps-suggestion-item:hover .item-link{width:360px}.gps-base-font-family{font-family:Inter,sans-serif,ui-sans-serif,system-ui!important}.btn-disable:before{background:none!important;background-color:#f4f4f4!important;color:#9e9e9e}.gps-image-detection-section:hover .gps-generating-actions{display:flex}.gps-generating-section-text{-webkit-text-fill-color:transparent;background:-webkit-linear-gradient(#874cfd,#3c38e1);-webkit-background-clip:text}.ck-blurred{cursor:pointer}.ck-focused{cursor:text}.button-text{position:relative}.button-text.ck-focused,.child-item-text.ck-focused{border-color:transparent!important;box-shadow:0 0 0 2px hsla(0,0%,100%,0),0 0 0 1px #3c67ff,0 0 0 5px #3c67ff3d}.theme-section-editor .child-item-text:hover{border-color:#9144da!important}.theme-section-editor .button-text:hover:after{border:1px solid #9144da}.theme-section-editor .button-text.ck-focused,.theme-section-editor .child-item-text.ck-focused{border-color:transparent!important;box-shadow:0 0 0 2px hsla(0,0%,100%,0),0 0 0 1px #9144da,0 0 0 5px #9144da3d}.theme-section-editor [data-component-tag=Heading] [data-outline][data-outline-editor-inline-focus],.theme-section-editor [data-component-tag=Text] [data-outline][data-outline-editor-inline-focus]{border-color:#9144da;outline:4px solid #9144da3d!important}.post-purchase-page{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:14px;line-height:15px}.post-purchase-page select:focus{border-color:#1879b9;box-shadow:0 0 0 1px #1879b9}.gp-text.ck p{word-break:break-word}.button-text:hover:after{border:1px solid #3c67ff;content:"";height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%}.button-text.ck-focused:hover:after{border:0!important}.sticky-overlay{align-items:center;background-color:#3c67ff26;border:2px solid #3c67ff;color:#3c67ff;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1}.sticky-overlay.highlight-top{border-top-width:6px}.sticky-overlay.highlight-bottom{border-bottom-width:6px}.editor-content{font-family:Inter,sans-serif,ui-sans-serif,system-ui!important}@media (max-width:768px){.gps-suggestion-item .item-link,.gps-suggestion-item:hover .item-link{width:196px}}
package/dist/toolbar.css CHANGED
@@ -167,10 +167,20 @@
167
167
  [data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section='true'][data-toolbar-active]:hover {
168
168
  background: #9144da;
169
169
  }
170
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-shopify-section='true'][data-toolbar-hover][data-toolbar-hover-focus] {
171
+ background: #29845A;
172
+ padding: 4px;
173
+ }
174
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-shopify-section='true'][data-toolbar-hover]:hover {
175
+ background: #29845A;
176
+ }
177
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-shopify-section='true'][data-toolbar-active]:hover {
178
+ background: #29845A;
179
+ }
170
180
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active] {
171
181
  opacity: 1;
172
182
  visibility: visible;
173
- z-index: 20;
183
+ z-index: 1000;
174
184
  height: 32px;
175
185
  top: -35px;
176
186
  background: #151515;
@@ -193,6 +203,12 @@
193
203
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-theme-section='true'][data-toolbar-hover-focus] {
194
204
  background: #9144da;
195
205
  }
206
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-shopify-section='true'] {
207
+ background: #29845A;
208
+ }
209
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-shopify-section='true'][data-toolbar-hover-focus] {
210
+ background: #29845A;
211
+ }
196
212
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] {
197
213
  padding: 4px;
198
214
  margin-right: 9px;
@@ -236,7 +252,7 @@
236
252
  transform: rotate(180deg);
237
253
  }
238
254
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent]:hover {
239
- background: rgba(225, 225, 225, 0.2);
255
+ background-color: rgba(225, 225, 225, 0.2);
240
256
  }
241
257
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-show-parent] [data-toolbar-icon-drag] {
242
258
  display: block;
@@ -257,7 +273,7 @@
257
273
  height: 16px;
258
274
  }
259
275
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-duplicate]:hover, [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-delete]:hover, [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out]:hover, [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section]:hover {
260
- background: rgba(225, 225, 225, 0.2);
276
+ background-color: rgba(225, 225, 225, 0.2);
261
277
  }
262
278
  [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-delete][data-toolbar-disable='true'] svg, [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-zoom-out][data-toolbar-disable='true'] svg, [data-toolbar-wrap] [data-toolbar][data-toolbar-active] [data-toolbar-active-create-theme-section][data-toolbar-disable='true'] svg {
263
279
  opacity: 0.4;
@@ -314,6 +330,10 @@
314
330
  [data-toolbar-wrap] [data-toolbar][data-toolbar-theme-section='true'][data-toolbar-active] {
315
331
  border-color: #9144da;
316
332
  }
333
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-shopify-section='true'][data-toolbar-hover-focus],
334
+ [data-toolbar-wrap] [data-toolbar][data-toolbar-shopify-section='true'][data-toolbar-active] {
335
+ border-color: #29845A;
336
+ }
317
337
  [data-toolbar-wrap] [data-toolbar][data-toolbar-active][data-toolbar-limit='true'],
318
338
  [data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-limit='true'],
319
339
  [data-toolbar-wrap] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus][data-toolbar-limit='true'],
@@ -346,6 +366,9 @@
346
366
  visibility: hidden;
347
367
  transition: opacity 0ms ease-in-out;
348
368
  }
369
+ [data-toolbar-wrap][data-section-exceeded][data-toolbar-wrap] [data-outline][data-outline-section='true'] {
370
+ border-color: #f44336;
371
+ }
349
372
  /* State Outline */
350
373
  [data-toolbar-wrap] [data-outline][data-outline-hover],
351
374
  [data-toolbar-wrap] [data-outline][data-outline-force-hover] {
@@ -386,7 +409,7 @@
386
409
  border-color: transparent;
387
410
  z-index: 0;
388
411
  }
389
- [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] {
412
+ [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], [data-toolbar-wrap] [data-component-tag='PostPurchaseHeading'] [data-outline][data-outline-editor-inline-focus], [data-toolbar-wrap] [data-component-tag='PostPurchaseText'] [data-outline][data-outline-editor-inline-focus] {
390
413
  border-color: #3c67ff;
391
414
  outline: 4px solid rgba(60, 103, 255, 0.24);
392
415
  top: 0px;
@@ -408,6 +431,12 @@
408
431
  border-color: #9144da;
409
432
  z-index: 0;
410
433
  }
434
+ [data-toolbar-wrap] [data-outline][data-outline-shopify-section='true'],
435
+ [data-toolbar-wrap] [data-outline][data-outline-shopify-section='true'][data-outline-hover-focus],
436
+ [data-toolbar-wrap] [data-outline][data-outline-shopify-section='true'][data-outline-active] {
437
+ border-color: #29845A;
438
+ z-index: 0;
439
+ }
411
440
  [data-toolbar-wrap] [data-outline][data-outline-active][data-outline-limit='true'],
412
441
  [data-toolbar-wrap] [data-outline][data-outline-hover][data-outline-limit='true'],
413
442
  [data-toolbar-wrap] [data-outline][data-outline-hover][data-outline-hover-focus][data-outline-limit='true'],
@@ -435,6 +464,17 @@
435
464
  [data-toolbar-wrap] [data-theme-section] .gp-text:hover {
436
465
  border-color: transparent !important;
437
466
  }
467
+ /* disable delay animation on shopify section */
468
+ [data-toolbar-wrap] [data-shopify-section] [data-toolbar][data-toolbar-hover][data-toolbar-hover-focus],
469
+ [data-toolbar-wrap] [data-shopify-section] [data-outline][data-outline-hover][data-outline-hover-focus],
470
+ [data-toolbar-wrap] [data-shopify-section] [data-toolbar-add-top],
471
+ [data-toolbar-wrap] [data-shopify-section] [data-toolbar-add-bottom] {
472
+ transition-delay: 0ms;
473
+ }
474
+ [data-toolbar-wrap] [data-shopify-section] [data-toolbar-add-top],
475
+ [data-toolbar-wrap] [data-shopify-section] [data-toolbar-add-bottom] {
476
+ border-color: #29845A;
477
+ }
438
478
  [data-toolbar-wrap] [data-theme-section-status] {
439
479
  display: none;
440
480
  align-items: center;
@@ -577,6 +617,7 @@
577
617
  display: none;
578
618
  }
579
619
  [data-toolbar-wrap] [data-spacing] [data-spacing-margin-bottom] [data-spacing-margin-bottom-bg] [data-value-number] {
620
+ font-family: Inter;
580
621
  background-color: #3c67ff;
581
622
  border-radius: 6px;
582
623
  color: #fff;
@@ -631,7 +672,7 @@
631
672
  [data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip] {
632
673
  width: unset;
633
674
  max-width: unset;
634
- background-color: #676767 !important;
675
+ background-color: #333333 !important;
635
676
  color: #fff;
636
677
  text-align: center;
637
678
  border-radius: 6px;
@@ -661,7 +702,7 @@
661
702
  margin-top: -5px;
662
703
  border-width: 5px;
663
704
  border-style: solid;
664
- border-color: transparent #676767 transparent transparent;
705
+ border-color: transparent #333333 transparent transparent;
665
706
  }
666
707
  [data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position='left'] {
667
708
  top: -5px;
@@ -675,7 +716,7 @@
675
716
  margin-top: -5px;
676
717
  border-width: 5px;
677
718
  border-style: solid;
678
- border-color: transparent transparent transparent #676767;
719
+ border-color: transparent transparent transparent #333333;
679
720
  }
680
721
  [data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position='top'] {
681
722
  bottom: 105%;
@@ -684,12 +725,12 @@
684
725
  [data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position='top']::after {
685
726
  content: ' ';
686
727
  position: absolute;
687
- top: 100%;
728
+ top: calc(100% - 0.5px);
688
729
  left: 50%;
689
730
  margin-left: -5px;
690
731
  border-width: 5px;
691
732
  border-style: solid;
692
- border-color: #676767 transparent transparent transparent;
733
+ border-color: #333333 transparent transparent transparent;
693
734
  }
694
735
  [data-toolbar-wrap] [data-toolbar-tooltip-trigger] [data-toolbar-tooltip-position='bottom'] {
695
736
  top: 105%;
@@ -703,7 +744,7 @@
703
744
  margin-left: -5px;
704
745
  border-width: 5px;
705
746
  border-style: solid;
706
- border-color: transparent transparent #676767 transparent;
747
+ border-color: transparent transparent #333333 transparent;
707
748
  }
708
749
  /* Tooltips state */
709
750
  [data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-duplicate] {
@@ -719,12 +760,102 @@
719
760
  left: unset;
720
761
  right: 6px;
721
762
  }
763
+ [data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-delete] {
764
+ position: relative;
765
+ }
766
+ [data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-delete] [data-toolbar-tooltip] {
767
+ width: 206px;
768
+ white-space: normal;
769
+ font-size: 12px;
770
+ line-height: 20px;
771
+ text-align: left;
772
+ padding: 8px;
773
+ }
774
+ [data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-delete] [data-toolbar-tooltip][data-toolbar-tooltip-position='top'] {
775
+ margin-bottom: 12px;
776
+ left: 50%;
777
+ -webkit-transform: translateX(-50%);
778
+ transform: translateX(-50%);
779
+ }
780
+ [data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-delete] [data-toolbar-tooltip][data-toolbar-tooltip-position='bottom'] {
781
+ top: 36px;
782
+ right: -4px;
783
+ left: unset;
784
+ }
785
+ [data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-delete] [data-toolbar-tooltip][data-toolbar-tooltip-position='bottom']::after {
786
+ right: 10px;
787
+ left: unset;
788
+ }
722
789
  [data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-add-top] [data-toolbar-tooltip], [data-toolbar-wrap] [data-toolbar-tooltip-trigger][data-toolbar-add-bottom] [data-toolbar-tooltip] {
723
790
  margin-bottom: 12px;
724
791
  left: 50%;
725
792
  -webkit-transform: translateX(-50%);
726
793
  transform: translateX(-50%);
727
794
  }
795
+ /* Resize column */
796
+ [data-toolbar-wrap] [data-column] {
797
+ z-index: 10;
798
+ position: absolute;
799
+ width: 100%;
800
+ height: 100%;
801
+ top: 0;
802
+ left: 0;
803
+ pointer-events: none;
804
+ }
805
+ [data-toolbar-wrap] [data-column] [data-column-hand-drag] {
806
+ justify-content: center;
807
+ align-items: center;
808
+ visibility: hidden;
809
+ opacity: 0;
810
+ cursor: grab;
811
+ pointer-events: auto;
812
+ }
813
+ [data-toolbar-wrap] [data-column] [data-column-hand-drag] [data-column-hand-visual] {
814
+ border-radius: 2px;
815
+ width: 3px;
816
+ height: 80%;
817
+ background-color: #d6d6d6;
818
+ transition: all 0.2s;
819
+ }
820
+ [data-toolbar-wrap] [data-column] [data-column-hand-drag] [data-column-hand-visual-drag] {
821
+ position: absolute;
822
+ top: 50%;
823
+ left: 50%;
824
+ -webkit-transform: translate(-50%, -50%);
825
+ transform: translate(-50%, -50%);
826
+ color: #3c67ff;
827
+ visibility: hidden;
828
+ opacity: 0;
829
+ transition: all 0.2s;
830
+ width: 16px;
831
+ }
832
+ [data-toolbar-wrap] [data-column] [data-column-hand-drag] [data-column-hand-visual-drag] svg {
833
+ width: 16px;
834
+ height: 16px;
835
+ -webkit-transform: rotate(45deg);
836
+ transform: rotate(45deg);
837
+ }
838
+ [data-toolbar-wrap] [data-column] [data-column-hand-drag]:hover [data-column-hand-visual], [data-toolbar-wrap] [data-column] [data-column-hand-drag][data-column-hand-drag-active='true'] [data-column-hand-visual] {
839
+ background-color: #3c67ff;
840
+ }
841
+ [data-toolbar-wrap] [data-column] [data-column-hand-drag]:hover [data-column-hand-visual-drag], [data-toolbar-wrap] [data-column] [data-column-hand-drag][data-column-hand-drag-active='true'] [data-column-hand-visual-drag] {
842
+ visibility: visible;
843
+ opacity: 1;
844
+ }
845
+ [data-toolbar-wrap] [data-column][data-column-theme-section='true'] [data-column-hand-drag] [data-column-hand-visual-drag] {
846
+ color: #9144da;
847
+ }
848
+ [data-toolbar-wrap] [data-column][data-column-theme-section='true'] [data-column-hand-drag]:hover [data-column-hand-visual], [data-toolbar-wrap] [data-column][data-column-theme-section='true'] [data-column-hand-drag][data-column-hand-drag-active='true'] [data-column-hand-visual] {
849
+ background-color: #9144da;
850
+ }
851
+ [data-toolbar-wrap] [data-column][data-column-theme-section='true'] [data-column-hand-drag]:hover [data-column-hand-visual-drag], [data-toolbar-wrap] [data-column][data-column-theme-section='true'] [data-column-hand-drag][data-column-hand-drag-active='true'] [data-column-hand-visual-drag] {
852
+ visibility: visible;
853
+ opacity: 1;
854
+ }
855
+ [data-toolbar-wrap] [data-column][data-column-visible] [data-column-hand-drag], [data-toolbar-wrap] [data-column][data-column-force-visible='true'] [data-column-hand-drag], [data-toolbar-wrap] [data-column][data-column-is-drag-visible='true'] [data-column-hand-drag] {
856
+ visibility: visible;
857
+ opacity: 1;
858
+ }
728
859
 
729
860
  [data-toolbar-debug] [data-toolbar] {
730
861
  opacity: 1;
@@ -757,7 +888,7 @@
757
888
  min-width: 284px;
758
889
  display: flex;
759
890
  flex-direction: column;
760
- border-radius: 3px;
891
+ border-radius: 12px;
761
892
  position: absolute;
762
893
  right: -4px;
763
894
  top: 100%;
@@ -778,7 +909,7 @@
778
909
 
779
910
  .theme-section-tooltip-wrapper .theme-section-tooltip__image {
780
911
  background: #212121;
781
- border-radius: 3px 3px 0 0;
912
+ border-radius: 12px 12px 0 0;
782
913
  padding-top: 16px;
783
914
  padding-bottom: 8px;
784
915
  padding-left: 21px;
@@ -811,7 +942,7 @@
811
942
 
812
943
  .theme-section-tooltip-wrapper .theme-section-tooltip__action {
813
944
  padding: 16px;
814
- border-radius: 0 0 3px 3px;
945
+ border-radius: 0 0 12px 12px;
815
946
  border-top: solid 1px #3b3b3b;
816
947
  background: #151515;
817
948
  display: flex;
@@ -823,7 +954,7 @@
823
954
  width: 100%;
824
955
  text-align: center;
825
956
  background: #3c67ff;
826
- border-radius: 3px;
957
+ border-radius: 8px;
827
958
  height: 40px;
828
959
  font-size: 14px;
829
960
  line-height: 24px;
@@ -837,12 +968,11 @@
837
968
  }
838
969
 
839
970
  .theme-section-tooltip-wrapper .theme-section-tooltip__action-limit button {
840
- background: #fdb913 !important;
841
- color: #212121 !important;
971
+ background: #3c67ff !important;
842
972
  }
843
973
 
844
974
  .theme-section-tooltip-wrapper .theme-section-tooltip__action-limit button:hover {
845
- background: #fdc742 !important;
975
+ background: #2856f8 !important;
846
976
  }
847
977
 
848
978
  .theme-section-tooltip-wrapper .theme-section-tooltip__action-learn-more {
@@ -863,87 +993,126 @@
863
993
  /* Toolbar onboarding */
864
994
 
865
995
  [data-toolbar-onboarding] {
996
+ position: absolute;
997
+ left: 0;
998
+ top: 0;
999
+ width: 320px;
1000
+ background-color: #fff;
1001
+ color: rgba(60, 103, 255, 0.24);
1002
+ border-radius: 8px;
1003
+ box-shadow:
1004
+ 0px 4px 16px 0px rgba(0, 0, 0, 0.12),
1005
+ 0px -4px 16px 0px rgba(0, 0, 0, 0.06);
1006
+ z-index: 40;
1007
+ visibility: hidden;
1008
+ opacity: 0;
1009
+ }
1010
+
1011
+ [data-toolbar-onboarding][data-onboarding-active] {
1012
+ visibility: visible;
1013
+ opacity: 1;
1014
+ transition: opacity 0.25s;
1015
+ }
1016
+
1017
+ [data-toolbar-onboarding] [data-onboarding-wrapper] {
1018
+ }
1019
+
1020
+ [data-toolbar-onboarding] [data-icon] {
866
1021
  position: absolute;
867
- left: 0;
868
- top: 0;
869
- width: 320px;
870
- background-color: #fff;
871
- color:rgba(60, 103, 255, 0.24);
872
- border-radius: 8px;
873
- box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12), 0px -4px 16px 0px rgba(0, 0, 0, 0.06);
874
- z-index: 40;
875
- visibility: hidden;
876
- opacity: 0;
1022
+ top: -4px;
1023
+ left: 16px;
1024
+ /* Popover */
1025
+ box-shadow:
1026
+ 0px 4px 16px 0px rgba(0, 0, 0, 0.12),
1027
+ 0px -4px 16px 0px rgba(0, 0, 0, 0.06);
877
1028
  }
878
1029
 
879
- [data-toolbar-onboarding][data-onboarding-active]{
880
- visibility: visible;
881
- opacity: 1;
882
- transition: opacity .25s;
1030
+ [data-toolbar-onboarding] [data-icon][data-position='top'] {
1031
+ top: unset;
1032
+ bottom: -4px;
883
1033
  }
884
1034
 
885
- [data-toolbar-onboarding] [data-onboarding-wrapper] {
886
-
1035
+ [data-toolbar-onboarding] [data-close] {
1036
+ position: absolute;
1037
+ top: 8px;
1038
+ right: 8px;
1039
+ z-index: 99;
1040
+ border-radius: 8px;
1041
+ background-color: transparent;
1042
+ transition: background 0.25s;
1043
+ }
1044
+
1045
+ [data-toolbar-onboarding] [data-close]:hover {
1046
+ background-color: #e2e2e2;
887
1047
  }
888
1048
 
889
- [data-toolbar-onboarding] [data-icon] {
890
- position: absolute;
891
- top: -4px;
892
- left: 16px;
893
- /* Popover */
894
- box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12), 0px -4px 16px 0px rgba(0, 0, 0, 0.06);
1049
+ [data-toolbar-onboarding] [data-close] svg {
1050
+ -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
1051
+ filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
895
1052
  }
896
1053
 
1054
+ [data-toolbar-onboarding] [data-icon] {
1055
+ position: absolute;
1056
+ top: -4px;
1057
+ left: 16px;
1058
+ /* Popover */
1059
+ box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.12), 0px -4px 16px 0px rgba(0, 0, 0, 0.06);
1060
+ }
1061
+
897
1062
  [data-toolbar-onboarding] [data-icon][data-position="top"] {
898
- top: unset;
899
- bottom: -4px;
900
- }
1063
+ top: unset;
1064
+ bottom: -4px;
1065
+ }
901
1066
 
902
1067
  [data-toolbar-onboarding] [data-close] {
903
- position: absolute;
904
- top: 8px;
905
- right: 8px;
906
- z-index: 99;
907
- border-radius: 8px;
908
- background-color: transparent;
909
- transition: background .25s;
910
- }
1068
+ position: absolute;
1069
+ top: 8px;
1070
+ right: 8px;
1071
+ z-index: 99;
1072
+ border-radius: 8px;
1073
+ background-color: transparent;
1074
+ transition: background .25s;
1075
+ }
911
1076
 
912
1077
  [data-toolbar-onboarding] [data-close]:hover {
913
- background-color: #E2E2E2;
914
- }
1078
+ background-color: #E2E2E2;
1079
+ }
915
1080
 
916
1081
  [data-toolbar-onboarding] [data-close] svg {
917
- -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
918
- filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
919
- }
1082
+ -webkit-filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
1083
+ filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
1084
+ }
920
1085
 
921
1086
  [data-toolbar-onboarding] [data-content] {
922
- padding: 16px;
923
- }
1087
+ padding: 16px;
1088
+ }
924
1089
 
925
1090
  [data-toolbar-onboarding] video {
926
- border-radius: 8px 8px 0 0;
927
- }
1091
+ border-radius: 8px 8px 0 0;
1092
+ }
928
1093
 
929
1094
  [data-toolbar-onboarding] h3 {
930
- color: #212121;
931
- font-family: Inter;
932
- font-size: 16px;
933
- font-style: normal;
934
- font-weight: 600;
935
- line-height: 24px; /* 150% */
936
- letter-spacing: -0.32px;
937
- }
1095
+ color: #212121;
1096
+ font-family: Inter;
1097
+ font-size: 16px;
1098
+ font-style: normal;
1099
+ font-weight: 600;
1100
+ line-height: 24px; /* 150% */
1101
+ letter-spacing: -0.32px;
1102
+ }
938
1103
 
939
- [data-toolbar-onboarding] p{
940
- color: #676767;
941
- font-family: Inter;
942
- font-size: 14px;
943
- font-style: normal;
944
- font-weight: 400;
945
- line-height: 24px; /* 171.429% */
946
- }
1104
+ [data-toolbar-onboarding] p {
1105
+ color: #676767;
1106
+ font-family: Inter;
1107
+ font-size: 14px;
1108
+ font-style: normal;
1109
+ font-weight: 400;
1110
+ line-height: 24px; /* 171.429% */
1111
+ }
1112
+
1113
+ [data-slot="children"] {
1114
+ font-family: Inter;
1115
+ }
947
1116
 
948
1117
  @media (max-width: 767px) {
949
1118
  [data-toolbar-wrap] [data-toolbar-add-top], [data-toolbar-wrap] [data-toolbar-add-bottom] {