upgrade: adopt V8.31.1 (theme 1.3/1.4 redesigns, editor deep-canvas, guided launch, component library)
Overlay 190 upstream items (V8.22→8.31) preserving trade-pro theme, registry tests, and design docs. Re-applied full patch set on identical anchors (discovery/env_for/blocks.css/type-mapping/locale-override/ theme_color/frontend entries/test_theme_pro_v3 mods) plus compose pins. Verified: theme suites 35/35; dual-baseline full run 415 passed vs pristine 386+29 ours, FAILED-set diff EMPTY (same 10 Windows env fails). Live: container 8.31.1-dev.1 healthy, hesupipe 192 entries intact, trade-pro build 203 pages 0 errors. Co-Authored-By: Claude Code <noreply@anthropic.com>
This commit is contained in:
浅念
@@ -88,3 +88,71 @@ iframe{min-height:590px;height:calc(100vh - 224px)}
|
||||
|
||||
/* Accessible repeated-item forms for galleries, carousels, FAQs and features */
|
||||
.sf-array-editor{display:grid;gap:10px}.sf-array-hint{font-size:11px;line-height:1.6;color:#8391a3;margin:0 0 4px}.sf-array-card{border:1px solid #e5eaf0;background:#fafbfd;padding:11px;border-radius:10px}.sf-array-card-head{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:12px}.sf-array-card-head b{font-size:12px;color:#586a7f}.sf-array-card-head div{display:flex;gap:3px}.sf-array-card-head button{border:1px solid #e2e7ed;border-radius:5px;color:#6c7a8e;background:white;padding:4px 7px;font-size:11px}.sf-array-card-head button:last-child{color:#b95d62}.sf-array-card-head button:disabled{opacity:.3;cursor:not-allowed}.sf-array-field{display:block!important;margin:10px 0!important;font-size:11px!important;font-weight:650!important}.sf-array-field input,.sf-array-field textarea{display:block;width:100%;margin-top:5px;background:white}.sf-array-field textarea{min-height:65px}.sf-array-add{border:1px dashed #e5a77c;border-radius:9px;background:#fff8f2;color:#be672a;padding:13px 9px;font-size:12px;font-weight:800}
|
||||
|
||||
/* V8.22 canvas-level authoring with no change to published templates */
|
||||
.sf-insert-hint{margin:8px 12px;padding:10px 12px;background:#fff3e8;color:#aa5525;font-size:12px;border:1px solid #f0bd98;border-radius:9px;line-height:1.6}
|
||||
.sf-insert-hint[hidden]{display:none!important}
|
||||
.preview-head .preview-note{max-width:350px;font-size:11px;color:#67778b}
|
||||
#sitePreview:focus-visible{outline:2px solid #e77b37;outline-offset:2px}
|
||||
|
||||
/* V8.23 child-first layout inspector */
|
||||
.sf-nested-edit{margin:5px 0 20px;display:grid;gap:9px}.sf-nested-card{border:1px solid #e3e9f0;border-radius:10px;padding:10px;background:#fbfcfd}.sf-nested-card.active{border-color:#42a8b9;background:#f2fbfd}.sf-nested-heading{display:flex;align-items:center;justify-content:space-between;gap:6px}.sf-nested-heading>button{border:0;background:none;font-size:12px;color:#36556e;font-weight:750;text-align:left;cursor:pointer}.sf-nested-heading span{display:flex;gap:4px}.sf-nested-heading span button,.sf-nested-actions button{border:1px solid #d8e4eb;background:white;border-radius:6px;padding:5px 9px;color:#36556e;cursor:pointer}.sf-nested-heading button:disabled{opacity:.3;cursor:not-allowed}.sf-nested-field{display:block;margin:10px 0;color:#536477;font-size:12px}.sf-nested-field input{display:block;margin-top:6px;width:100%;padding:10px;border:1px solid #d7e3e9;border-radius:7px;font-size:12px}.sf-nested-actions{display:flex;gap:6px;margin:10px 0 2px}.sf-nested-actions button:last-child{color:#b44549}.sf-layout-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:9px 0 18px}.sf-layout-presets button{white-space:normal;padding:10px 5px;border:1px solid #e5b995;border-radius:8px;background:#fff8f3;color:#945325;font-size:11px;cursor:pointer}.sf-layout-presets button:disabled{opacity:.4;cursor:not-allowed}
|
||||
|
||||
/* V8.25: friendly shared-component management, scoped to editor only. */
|
||||
.sf-shared-palette-row{border:1px solid #e4e8ef;background:white;border-radius:9px;padding:10px;display:grid;gap:8px;font-size:12px}
|
||||
.sf-shared-palette-row strong{display:flex;justify-content:space-between;gap:7px}
|
||||
.sf-shared-palette-row small{color:#8594a8}
|
||||
.sf-shared-palette-row>div{display:flex;gap:7px}
|
||||
.sf-shared-palette-row button,.sf-shared-actions button{border:1px solid #e0e4e9;border-radius:7px;background:#fff;padding:7px 9px;cursor:pointer;color:#364759}
|
||||
.sf-shared-palette-row button:last-child{background:#fff3e8;color:#b95a23;border-color:#eac7ae}
|
||||
.sf-shared-dialog{width:min(780px,96vw);max-height:88vh;overflow:auto;border:1px solid #e3e7ec;border-radius:16px;padding:24px;box-shadow:0 20px 60px #263a5430;color:#334155}
|
||||
.sf-shared-dialog::backdrop{background:#0e203b70}
|
||||
.sf-shared-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
|
||||
.sf-shared-dialog h2{margin:5px 0 12px;font-size:22px}.sf-shared-dialog h3{margin:18px 0 10px}
|
||||
.sf-shared-card{display:flex;justify-content:space-between;gap:14px;border:1px solid #e3e8ee;border-radius:10px;padding:13px;margin:10px 0;align-items:center}
|
||||
.sf-shared-card>div:first-child{display:grid;gap:4px}.sf-shared-card small,.sf-shared-usage small{display:block;color:#64748b;font-size:11px;margin-top:5px}
|
||||
.sf-shared-actions{display:flex;flex-wrap:wrap;gap:6px}
|
||||
.sf-shared-usage{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid #e2e7ed;border-radius:9px;margin:7px 0;cursor:pointer}
|
||||
.sf-shared-usage:has(input:disabled){opacity:.6;cursor:not-allowed}
|
||||
#sharedComponentDetail{margin-top:22px;border-top:1px solid #e2e7ed;padding-top:12px}
|
||||
#sharedComponentDetail>.ui-btn{margin-top:14px}
|
||||
@media(max-width:700px){.sf-shared-card{display:grid}.sf-shared-dialog{padding:15px}}
|
||||
|
||||
.sf-share-info{border:1px solid #f0cfb5;background:#fff8f1;padding:13px;border-radius:10px;margin:12px 0;color:#955023;font-size:12px}.sf-share-info p{line-height:1.5}
|
||||
|
||||
.sf-shared-history{display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #edf0f4;padding:10px 0;font-size:12px;flex-wrap:wrap}
|
||||
|
||||
/* V8.26 global design navigation, review and restoration */
|
||||
.sf-visual-nav{padding:15px;border:1px solid #e2e8f0;border-radius:12px;background:#fafcff}
|
||||
.sf-visual-nav-header{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;margin-bottom:12px}
|
||||
.sf-visual-nav-header span,.sf-visual-nav-help{font-size:12px;color:#64748b}
|
||||
.sf-nav-item{padding:8px;margin-bottom:6px;border:1px solid #dde5ed;background:#fff;border-radius:10px;display:flex;align-items:center;flex-wrap:wrap;gap:6px}
|
||||
.sf-nav-item input{min-width:100px;flex:1 1 135px;padding:8px;border:1px solid #cbd5e1;border-radius:7px}
|
||||
.sf-nav-action{font-size:12px!important;padding:6px 9px!important}
|
||||
.sf-global-review{width:min(720px,95vw);max-height:85vh;overflow:auto;border:1px solid #dce5ed;border-radius:16px;padding:24px;box-shadow:0 18px 54px #132c4540}
|
||||
.sf-review-change{padding:12px;border:1px solid #dfe6ee;border-radius:10px;margin:9px 0;background:#f9fbfe;overflow-wrap:anywhere}
|
||||
.sf-review-change p{font-size:12px;color:#64748b;margin:7px 0;white-space:pre-wrap}
|
||||
.sf-review-buttons{display:flex;justify-content:flex-end;gap:10px;margin-top:16px}
|
||||
@media(max-width:600px){.sf-nav-item{margin-left:0!important}.sf-global-review{padding:16px}}
|
||||
|
||||
.sf-global-entry{display:flex;flex-direction:column;gap:6px;padding:12px;border:1px solid #f1d7bf;border-radius:10px;background:#fffaf5;margin-bottom:12px}.sf-global-entry button{font-weight:650;text-align:left}.sf-global-entry small{color:#876c56;font-size:11px}
|
||||
|
||||
/* V8.29: discoverable content palette and safe theme comparison */
|
||||
.sf-palette-filter{display:flex;gap:6px;margin:12px 13px 6px}.sf-palette-filter input{min-width:0;flex:1;border:1px solid #d8e2ed;border-radius:9px;padding:10px;font-size:12px}.sf-palette-filter button{border:1px solid #dee6ee;border-radius:8px;background:#f7f9fc;color:#53657a;font-size:11px;padding:0 9px}.sf-palette-summary{font-size:11px;color:#657487;padding:2px 14px 9px}.sf-palette-categories{display:block;padding:0 12px 12px}.sf-palette-group{margin-bottom:12px}.sf-palette-group h4{font-size:12px;color:#4a5870;margin:6px 3px 9px;font-weight:700}.sf-palette-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.sf-palette-grid button{min-height:54px;border:1px solid #e3e9ef;background:white;padding:10px;border-radius:10px;display:flex;gap:8px;align-items:center;text-align:left;color:#35445b;font-size:12px;font-weight:600;line-height:1.4;cursor:pointer}.sf-palette-grid button:hover{background:#fff6ee;border-color:#e8a576}.sf-palette-grid button span{font-size:18px;flex-shrink:0;color:#b9652f}.sf-palette-empty{font-size:12px;color:#697b90;padding:10px}.sf-history-quick{border:1px solid #e0e6ed;background:white;color:#49596a;border-radius:8px;min-width:32px;height:34px;font-size:20px;cursor:pointer}.sf-history-quick:disabled{opacity:.35;cursor:not-allowed}.sf-theme-preview-entry{white-space:nowrap;color:#43576d}.sf-theme-showcase{width:min(1150px,96vw);height:min(94vh,900px);max-height:94vh;border:1px solid #dce3eb;border-radius:17px;overflow:auto;background:white;padding:0;box-shadow:0 25px 80px #10284148}.sf-theme-showcase::backdrop{background:#1424389c}.sf-showcase-head{display:flex;justify-content:space-between;align-items:start;gap:16px;padding:20px 24px 13px;border-bottom:1px solid #e5eaf0}.sf-showcase-head small{color:#b65c2d;font-weight:700}.sf-showcase-head h2{font-size:21px;margin:7px 0}.sf-showcase-head p{font-size:12px;color:#697b90;margin:0}.sf-showcase-tools{display:flex;gap:12px;align-items:end;flex-wrap:wrap;padding:14px 24px}.sf-showcase-tools label{display:grid;gap:5px;font-size:12px;font-weight:600;color:#43566c}.sf-showcase-tools select{border:1px solid #dce3ed;border-radius:8px;padding:9px 14px;min-width:145px;background:white}.sf-showcase-device{display:flex;gap:5px;margin-left:auto;background:#eef2f6;border-radius:8px;padding:4px}.sf-showcase-device button{padding:8px 12px;border:0;background:transparent;color:#596b7e;border-radius:6px;cursor:pointer}.sf-showcase-device button[aria-pressed=true]{background:#fff;color:#ad5c28;box-shadow:0 1px 6px #122c4419;font-weight:700}.sf-showcase-status{margin:0 24px 10px;color:#64748b;font-size:12px}.sf-showcase-stage{height:min(55vh,520px);overflow:auto;background:#eef1f5;padding:15px;display:flex;align-items:stretch;justify-content:center}.sf-showcase-frame{min-width:0;max-width:100%;height:100%;transition:width .18s ease;background:white;box-shadow:0 9px 30px #21334c20}.sf-showcase-frame iframe{display:block;width:100%;height:100%;min-height:0;border:0;background:white}.sf-showcase-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 24px;border-top:1px solid #e5eaf0}.sf-showcase-footer span{color:#718195;font-size:12px}.sf-theme-showcase button:focus-visible,.sf-theme-showcase select:focus-visible,.sf-palette-filter input:focus-visible,.sf-history-quick:focus-visible{outline:3px solid #eeab77;outline-offset:2px}@media(max-width:1100px){.sf-theme-preview-entry{font-size:11px;padding:8px!important}}@media(max-width:700px){.sf-theme-preview-entry{font-size:0;min-width:32px;padding:6px!important}.sf-theme-preview-entry::before{content:'◫';font-size:17px}.sf-showcase-head,.sf-showcase-tools,.sf-showcase-footer{padding:12px}.sf-showcase-stage{height:55vh;padding:8px}.sf-showcase-footer{flex-direction:column;align-items:start}.sf-showcase-device{margin-left:0}}@media(prefers-reduced-motion:reduce){.sf-showcase-frame{transition:none}}
|
||||
|
||||
.sf-style-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:9px 0 17px}.sf-style-presets button{border:1px solid #dae2eb;border-radius:9px;background:#fff;padding:10px 5px;min-height:48px;font-size:11px;color:#364459;cursor:pointer}.sf-style-presets button:nth-child(2){background:#f0f3f8}.sf-style-presets button:nth-child(3){background:#26374d;color:#fff}.sf-style-presets button:focus-visible{outline:3px solid #efa971;outline-offset:2px}
|
||||
/* Prevent translated, closed inspector drawers from widening the mobile viewport. */
|
||||
@media(max-width:1060px){html,body{max-width:100%;overflow-x:clip}}
|
||||
/* V8.29 mobile authoring: two deliberate toolbar rows, never horizontal-scrolling actions. */
|
||||
@media(max-width:720px){
|
||||
.studio-top.sf-easy-top{height:auto;min-height:100px;flex-wrap:wrap;justify-content:space-between;align-content:center;padding:7px 9px;gap:5px}
|
||||
.studio-top.sf-easy-top .brand,.studio-top.sf-easy-top .file-name,.studio-top.sf-easy-top .sf-history-quick,.studio-top.sf-easy-top .sf-theme-preview-entry{display:none!important}
|
||||
.studio-top.sf-easy-top .sf-pane-controls{order:1;flex:0 0 auto}
|
||||
.studio-top.sf-easy-top #saveDraftButton{order:2;flex:0 0 auto}
|
||||
.studio-top.sf-easy-top #publishDesignButton{order:3;flex:0 0 auto}
|
||||
.studio-top.sf-easy-top .studio-actions{order:4;flex:0 0 auto}
|
||||
.studio-top.sf-easy-top .sf-easy-device{order:5;flex:1 1 100%;display:flex;justify-content:center;margin:0}
|
||||
.studio-top.sf-easy-top .sf-easy-device .icon-btn{flex:1;max-width:115px}
|
||||
.studio-body .left-pane,.studio-body .right-pane{top:140px!important}
|
||||
.studio-actions-menu{right:0;max-width:calc(100vw - 18px)}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user