feat: enhance ecommerce UI with typewriter animation, icon buttons, responsive layout, and refined design tokens
- EcommercePage.tsx: Add typewriter animation (useTypewriter hook) for slogan text with blinking cursor; replace text-based add/delete buttons with Ant Design icons (CloudUploadOutlined, DeleteOutlined); make command history panel responsive to window width (auto-collapse ≤1180px); update button labels from generic "添加" to context-specific "上传商品图" / "上传素材" - New useTypewriter.ts hook: Character-by-character typewriter animation with configurable speed and pause-before-loop, auto-resets on text change - reset.css: Add comprehensive HTML/body typography baseline (font-size, text-rendering, font-smoothing, line-height); extend reset coverage to select/canvas/svg elements; add overflow-wrap:anywhere for text-bearing elements; add min-width:0 to prevent form element overflow - primitives.css: Add reusable typography utility classes (ui-page-title, ui-section-title, ui-body-copy) with design token references - tokens.css: Expand design token set for typography scales, font weights, and leading values - ecommerce-standalone.css: Add 689 lines of standalone ecommerce page styles - Page CSS (ecommerce, image-workbench, more-tools, more, script-tokens, script-tokens-v5, studio-layout): Enhanced visual styles and layout refinements across all pages - app-shell.css: Shell-level layout and styling improvements
This commit is contained in:
@@ -10983,3 +10983,497 @@
|
||||
border-radius: 14px !important;
|
||||
}
|
||||
|
||||
/* Current #/imageWorkbench ecommerce entry polish. */
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] {
|
||||
--ecom-entry-accent: #1ebddb;
|
||||
--ecom-entry-accent-strong: #1073cc;
|
||||
--ecom-entry-text: #10202c;
|
||||
--ecom-entry-muted: rgba(16, 32, 44, 0.58);
|
||||
--ecom-entry-line: rgba(30, 189, 219, 0.2);
|
||||
--ecom-entry-line-strong: rgba(30, 189, 219, 0.34);
|
||||
--ecom-entry-card: rgba(255, 255, 255, 0.92);
|
||||
--ecom-entry-card-soft: rgba(255, 255, 255, 0.72);
|
||||
--ecom-entry-shadow: 0 24px 70px rgba(16, 115, 204, 0.1);
|
||||
--ecom-entry-shadow-strong: 0 28px 82px rgba(16, 115, 204, 0.16);
|
||||
--ecom-entry-focus: 0 0 0 3px rgba(30, 189, 219, 0.16);
|
||||
background:
|
||||
radial-gradient(46rem 22rem at 50% 11%, rgba(30, 189, 219, 0.17), transparent 72%),
|
||||
radial-gradient(34rem 20rem at 18% 20%, rgba(16, 115, 204, 0.11), transparent 70%),
|
||||
linear-gradient(180deg, #f8fbfc 0%, #f5f8fa 58%, #f8f9fa 100%) !important;
|
||||
overflow-x: hidden !important;
|
||||
overflow-y: auto !important;
|
||||
overscroll-behavior-y: contain;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"]::before {
|
||||
opacity: 0.78 !important;
|
||||
filter: blur(52px) saturate(1.08) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"]::after {
|
||||
opacity: 0.38;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview {
|
||||
padding-top: clamp(72px, 9vh, 118px) !important;
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap {
|
||||
gap: clamp(18px, 2.5vw, 30px) !important;
|
||||
padding-inline: clamp(18px, 3.4vw, 40px) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title {
|
||||
max-width: min(900px, 100%);
|
||||
color: var(--ecom-entry-text) !important;
|
||||
letter-spacing: 0 !important;
|
||||
line-height: 1.12 !important;
|
||||
text-wrap: balance;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
|
||||
border: 1px solid var(--ecom-entry-line) !important;
|
||||
border-radius: 24px !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.97) 0%, rgba(250, 254, 255, 0.92) 100%),
|
||||
linear-gradient(135deg, rgba(30, 189, 219, 0.08), rgba(16, 115, 204, 0.04)) !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.9),
|
||||
0 1px 0 rgba(255, 255, 255, 0.72),
|
||||
var(--ecom-entry-shadow) !important;
|
||||
transition:
|
||||
border-color 180ms ease,
|
||||
box-shadow 180ms ease,
|
||||
transform 180ms ease,
|
||||
background 180ms ease !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:focus-within {
|
||||
border-color: var(--ecom-entry-line-strong) !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.92),
|
||||
var(--ecom-entry-focus),
|
||||
var(--ecom-entry-shadow-strong) !important;
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:hover {
|
||||
border-color: rgba(30, 189, 219, 0.3) !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.92),
|
||||
0 26px 72px rgba(16, 115, 204, 0.13) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer.is-dragging,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer.has-files {
|
||||
border-color: rgba(30, 189, 219, 0.42) !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(244, 253, 255, 0.96) 100%),
|
||||
linear-gradient(135deg, rgba(30, 189, 219, 0.1), rgba(16, 115, 204, 0.06)) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference {
|
||||
border: 1px dashed rgba(30, 189, 219, 0.3) !important;
|
||||
border-radius: 18px !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(244, 253, 255, 0.84)),
|
||||
radial-gradient(circle at 50% 12%, rgba(30, 189, 219, 0.15), transparent 58%) !important;
|
||||
color: var(--ecom-entry-text) !important;
|
||||
box-shadow: 0 14px 34px rgba(16, 115, 204, 0.09) !important;
|
||||
transition:
|
||||
transform 180ms ease,
|
||||
border-color 180ms ease,
|
||||
box-shadow 180ms ease,
|
||||
background 180ms ease !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference:hover,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference:focus-visible {
|
||||
border-color: rgba(30, 189, 219, 0.58) !important;
|
||||
box-shadow:
|
||||
var(--ecom-entry-focus),
|
||||
0 18px 42px rgba(16, 115, 204, 0.14) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference:active {
|
||||
transform: rotate(-2deg) translateY(1px) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference svg,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-upload-inline svg {
|
||||
color: var(--ecom-entry-accent) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-input {
|
||||
color: var(--ecom-entry-text) !important;
|
||||
line-height: 1.72 !important;
|
||||
caret-color: var(--ecom-entry-accent) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-input::placeholder {
|
||||
color: rgba(16, 32, 44, 0.38) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar {
|
||||
align-items: center !important;
|
||||
gap: 12px !important;
|
||||
border-top: 1px solid rgba(30, 189, 219, 0.11) !important;
|
||||
padding-top: 14px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row {
|
||||
gap: 8px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-upload-inline,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-char-count {
|
||||
min-height: 38px;
|
||||
border: 1px solid rgba(30, 189, 219, 0.15) !important;
|
||||
background: rgba(247, 252, 253, 0.92) !important;
|
||||
color: rgba(16, 32, 44, 0.72) !important;
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
|
||||
transition:
|
||||
color 160ms ease,
|
||||
border-color 160ms ease,
|
||||
background 160ms ease,
|
||||
box-shadow 160ms ease,
|
||||
transform 160ms ease !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button:hover,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-upload-inline:hover {
|
||||
border-color: rgba(30, 189, 219, 0.36) !important;
|
||||
background: rgba(238, 251, 254, 0.96) !important;
|
||||
color: var(--ecom-entry-text) !important;
|
||||
box-shadow: 0 10px 24px rgba(16, 115, 204, 0.08) !important;
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button.is-active,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button[aria-expanded="true"] {
|
||||
border-color: rgba(30, 189, 219, 0.46) !important;
|
||||
background: linear-gradient(180deg, rgba(235, 251, 255, 0.98), rgba(223, 247, 252, 0.9)) !important;
|
||||
color: var(--ecom-entry-text) !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.9),
|
||||
0 12px 26px rgba(30, 189, 219, 0.14) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] button:focus-visible {
|
||||
outline: none !important;
|
||||
box-shadow:
|
||||
var(--ecom-entry-focus),
|
||||
0 10px 26px rgba(16, 115, 204, 0.12) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] button:disabled,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] button[aria-disabled="true"] {
|
||||
cursor: not-allowed !important;
|
||||
opacity: 0.56 !important;
|
||||
transform: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send {
|
||||
width: 48px !important;
|
||||
height: 48px !important;
|
||||
min-width: 48px !important;
|
||||
border-radius: 16px !important;
|
||||
background:
|
||||
linear-gradient(135deg, var(--ecom-entry-accent) 0%, var(--ecom-entry-accent-strong) 100%) !important;
|
||||
box-shadow:
|
||||
0 16px 32px rgba(30, 189, 219, 0.28),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.34) !important;
|
||||
transition:
|
||||
transform 160ms ease,
|
||||
box-shadow 160ms ease,
|
||||
filter 160ms ease !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send:hover:not(:disabled) {
|
||||
filter: saturate(1.06) brightness(1.03);
|
||||
box-shadow:
|
||||
0 20px 38px rgba(30, 189, 219, 0.34),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.42) !important;
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send:active:not(:disabled) {
|
||||
transform: translateY(1px) scale(0.98);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-char-count {
|
||||
color: rgba(16, 32, 44, 0.46) !important;
|
||||
font-size: 12px !important;
|
||||
line-height: 1.4 !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board {
|
||||
border: 1px solid rgba(30, 189, 219, 0.12) !important;
|
||||
border-radius: 22px !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(249, 253, 255, 0.62)),
|
||||
rgba(255, 255, 255, 0.58) !important;
|
||||
box-shadow: 0 22px 58px rgba(16, 115, 204, 0.08) !important;
|
||||
backdrop-filter: blur(16px);
|
||||
-webkit-backdrop-filter: blur(16px);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button {
|
||||
border: 1px solid rgba(30, 189, 219, 0.1) !important;
|
||||
border-radius: 18px !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 252, 253, 0.88)) !important;
|
||||
color: var(--ecom-entry-text) !important;
|
||||
box-shadow:
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.86),
|
||||
0 12px 28px rgba(16, 115, 204, 0.06) !important;
|
||||
transition:
|
||||
border-color 180ms ease,
|
||||
box-shadow 180ms ease,
|
||||
transform 180ms ease,
|
||||
background 180ms ease !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:hover {
|
||||
border-color: rgba(30, 189, 219, 0.32) !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(238, 251, 254, 0.94)) !important;
|
||||
box-shadow: 0 18px 34px rgba(16, 115, 204, 0.12) !important;
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:active {
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board strong {
|
||||
color: var(--ecom-entry-text) !important;
|
||||
font-size: 15px !important;
|
||||
line-height: 1.35 !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board span {
|
||||
color: var(--ecom-entry-muted) !important;
|
||||
font-size: 12px !important;
|
||||
line-height: 1.45 !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover {
|
||||
border: 1px solid rgba(30, 189, 219, 0.18) !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(249, 253, 255, 0.94)) !important;
|
||||
box-shadow:
|
||||
0 24px 62px rgba(16, 115, 204, 0.16),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover-note,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-empty-copy {
|
||||
color: var(--ecom-entry-muted) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-empty-card {
|
||||
border: 1px solid rgba(30, 189, 219, 0.14) !important;
|
||||
background: rgba(255, 255, 255, 0.64) !important;
|
||||
box-shadow: 0 20px 56px rgba(16, 115, 204, 0.08) !important;
|
||||
backdrop-filter: blur(14px);
|
||||
-webkit-backdrop-filter: blur(14px);
|
||||
}
|
||||
|
||||
@media (max-width: 1080px) {
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview {
|
||||
padding-top: clamp(64px, 8vh, 96px) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap {
|
||||
max-width: 920px !important;
|
||||
gap: 20px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button {
|
||||
min-height: 72px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 760px) {
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] {
|
||||
background:
|
||||
radial-gradient(30rem 16rem at 50% 8%, rgba(30, 189, 219, 0.16), transparent 72%),
|
||||
linear-gradient(180deg, #f8fbfc 0%, #f6f9fa 100%) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview {
|
||||
padding-top: 16px !important;
|
||||
align-items: flex-start !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap {
|
||||
gap: 14px !important;
|
||||
padding-inline: 18px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title {
|
||||
font-size: clamp(24px, 7vw, 32px) !important;
|
||||
line-height: 1.16 !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
|
||||
min-height: 0 !important;
|
||||
border-radius: 22px !important;
|
||||
padding: 14px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference {
|
||||
min-height: 82px !important;
|
||||
transform: none !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-input {
|
||||
min-height: 84px !important;
|
||||
font-size: 14px !important;
|
||||
line-height: 1.62 !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-toolbar {
|
||||
align-items: stretch !important;
|
||||
gap: 10px !important;
|
||||
padding-top: 12px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row {
|
||||
gap: 7px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-upload-inline {
|
||||
min-height: 36px !important;
|
||||
padding-inline: 10px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-send-button.ecom-command-send {
|
||||
width: 46px !important;
|
||||
height: 46px !important;
|
||||
min-width: 46px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board {
|
||||
border-radius: 20px !important;
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button {
|
||||
min-height: 62px !important;
|
||||
padding: 12px !important;
|
||||
border-radius: 16px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board strong {
|
||||
font-size: 14px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board span {
|
||||
font-size: 11px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover,
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-asset-popover {
|
||||
max-width: calc(100vw - 32px) !important;
|
||||
max-height: min(420px, calc(100vh - 128px)) !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 420px) {
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap {
|
||||
padding-inline: 14px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-title {
|
||||
font-size: 24px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
|
||||
padding: 12px !important;
|
||||
border-radius: 20px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-reference {
|
||||
min-height: 74px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-input {
|
||||
min-height: 76px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-option-row button {
|
||||
flex: 1 1 calc(50% - 6px);
|
||||
justify-content: center !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button {
|
||||
min-height: 58px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-height: 760px) and (min-width: 761px) {
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .clone-ai-preview {
|
||||
padding-top: 64px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-composer-wrap {
|
||||
gap: 16px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button {
|
||||
min-height: 64px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1180px) {
|
||||
.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] {
|
||||
--ecom-history-offset: 0px !important;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview {
|
||||
width: 100% !important;
|
||||
max-width: none !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-history.ecom-command-history {
|
||||
display: grid !important;
|
||||
width: min(292px, calc(100vw - 72px)) !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap {
|
||||
left: 50% !important;
|
||||
right: auto !important;
|
||||
transform: translateX(-50%) !important;
|
||||
width: min(920px, calc(100vw - 48px)) !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] {
|
||||
overflow-x: hidden !important;
|
||||
overflow-y: auto !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] > .product-clone-shell.product-clone-shell {
|
||||
display: block !important;
|
||||
height: auto !important;
|
||||
min-height: 100% !important;
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-preview.clone-ai-preview {
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user