diff --git a/src/styles/ecommerce-standalone.css b/src/styles/ecommerce-standalone.css index 750aa08..043e658 100644 --- a/src/styles/ecommerce-standalone.css +++ b/src/styles/ecommerce-standalone.css @@ -2781,7 +2781,7 @@ position: absolute !important; left: 50% !important; z-index: 12 !important; - width: min(1036px, calc(100% - 56px)) !important; + width: min(1220px, calc(100% - 40px)) !important; margin-right: 0 !important; margin-left: 0 !important; ; @@ -9043,20 +9043,22 @@ .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-strip { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; - gap: 12px !important; - width: 100% !important; - margin: 14px 0 10px !important; + gap: 10px !important; + width: min(100%, 1088px) !important; + margin: 16px auto 12px !important; + box-sizing: border-box !important; } .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-card { position: relative !important; display: block !important; width: 100% !important; - aspect-ratio: 1.46 / 1 !important; - min-height: 92px !important; + min-width: 0 !important; + aspect-ratio: 3.06 / 1 !important; + min-height: 100px !important; padding: 0 !important; border: 1px solid rgba(30, 189, 219, 0.18) !important; - border-radius: 16px !important; + border-radius: 14px !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(246, 251, 253, 0.98)), #ffffff !important; @@ -9342,6 +9344,18 @@ min-height: 60px !important; } + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-strip { + grid-template-columns: minmax(0, 1fr) !important; + gap: 8px !important; + width: min(100%, 540px) !important; + margin: 12px auto 10px !important; + } + + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-card { + aspect-ratio: 2.9 / 1 !important; + min-height: 84px !important; + } + .ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview { padding-inline: 18px !important; } @@ -9378,6 +9392,50 @@ content: "" !important; background: rgba(30, 189, 219, 0.12) !important; } + + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-set-upload.has-images, + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-hot-material.has-images { + gap: 8px !important; + padding: 8px !important; + } + + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-set-upload.has-images .ecom-command-asset-thumb.ecom-quick-upload-thumb, + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-hot-material.has-images .ecom-command-asset-thumb.ecom-quick-upload-thumb, + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-set-upload.has-images .ecom-quick-hot-add-btn, + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-hot-material.has-images .ecom-quick-hot-add-btn { + width: 56px !important; + height: 56px !important; + min-width: 56px !important; + min-height: 56px !important; + flex-basis: 56px !important; + } +} + +@media (max-width: 480px) { + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-strip { + width: 100% !important; + } + + .ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-template-card { + min-height: 76px !important; + } + + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-set-upload.has-images, + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-hot-material.has-images { + gap: 6px !important; + padding: 6px !important; + } + + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-set-upload.has-images .ecom-command-asset-thumb.ecom-quick-upload-thumb, + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-hot-material.has-images .ecom-command-asset-thumb.ecom-quick-upload-thumb, + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-set-upload.has-images .ecom-quick-hot-add-btn, + html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"].is-hot-clone-page .ecom-quick-hot-page .ecom-quick-hot-material.has-images .ecom-quick-hot-add-btn { + width: 50px !important; + height: 50px !important; + min-width: 50px !important; + min-height: 50px !important; + flex-basis: 50px !important; + } } @keyframes ecommerce-soft-popover-out {