feat: 电商创作场景支持带货视频时长、移动端隐藏设置按钮、优化平台选择器样式 #26

Merged
stringadmin merged 1 commits from feat/ecommerce-scenario-tabs into main 2026-06-17 09:44:01 +00:00
4 changed files with 617 additions and 103 deletions
+27 -11
View File
@@ -1429,6 +1429,7 @@ const maxCloneProductImages = 20;
const maxCloneReferenceImages = 20; const maxCloneReferenceImages = 20;
const cloneVideoDurationMin = 5; const cloneVideoDurationMin = 5;
const cloneVideoDurationMax = 45; const cloneVideoDurationMax = 45;
const composerDurationOptions = [5, 10, 15];
const defaultEcommercePlatform = "淘宝/天猫"; const defaultEcommercePlatform = "淘宝/天猫";
const defaultProductSetOutput: ProductSetOutputKey = "set"; const defaultProductSetOutput: ProductSetOutputKey = "set";
const defaultCloneOutput: CloneOutputKey = "set"; const defaultCloneOutput: CloneOutputKey = "set";
@@ -2411,13 +2412,13 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
const cloneRatioOptions = baseCloneRatioOptions; const cloneRatioOptions = baseCloneRatioOptions;
const composerRatioOptions = useMemo( const composerRatioOptions = useMemo(
() => [ () => [
"1000×1000px 1:1", "1000×1000px\u00a0\u00a0\u00a01:1",
"800×1200px 2:3", "800×1200px\u00a0\u00a0\u00a02:3",
"1200×800px 3:2", "1200×800px\u00a0\u00a0\u00a03:2",
"1200×900px 4:3", "1200×900px\u00a0\u00a0\u00a04:3",
"900×1200px 3:4", "900×1200px\u00a0\u00a0\u00a03:4",
"1080×1920px 9:16", "1080×1920px\u00a0\u00a0\u00a09:16",
"1920×1080px 16:9", "1920×1080px\u00a0\u00a0\u00a016:9",
], ],
[], [],
); );
@@ -5975,11 +5976,10 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
} }
if (menuToRender === "platform") { if (menuToRender === "platform") {
return ( return (
<div key={composerPopoverKey} className={`ecom-command-popover ecom-command-popover--list ecom-command-popover--ratio ecom-command-popover--platform${popoverClosingClass}`} style={composerPopoverStyle}> <div key={composerPopoverKey} className={`ecom-command-popover ecom-command-popover--list ecom-command-popover--platforms${popoverClosingClass}`} style={composerPopoverStyle}>
{platformOptions.map((option) => ( {platformOptions.map((option) => (
<button key={option} type="button" className={platform === option ? "is-active" : ""} onClick={() => { handleClonePlatformChange(option); setComposerMenu(null); }}> <button key={option} type="button" className={platform === option ? "is-active" : ""} onClick={() => { handleClonePlatformChange(option); setComposerMenu(null); }}>
{renderPlatformLogo(option)} {option}
<span className="ecom-platform-name">{option}</span>
</button> </button>
))} ))}
</div> </div>
@@ -6010,6 +6010,17 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
</div> </div>
); );
} }
if (menuToRender === "settings" && activeCommerceScenario === "salesVideo") {
return (
<div key={composerPopoverKey} className={`ecom-command-popover ecom-command-popover--list ecom-command-popover--duration${popoverClosingClass}`} style={composerPopoverStyle}>
{composerDurationOptions.map((option) => (
<button key={option} type="button" className={cloneVideoDuration === option ? "is-active" : ""} onClick={() => { setCloneVideoDuration(option); setComposerMenu(null); }}>
{option}
</button>
))}
</div>
);
}
return ( return (
<div key={composerPopoverKey} className={`ecom-command-popover ecom-command-popover--settings ecom-command-popover--settings-${cloneOutput}${popoverClosingClass}`} style={composerPopoverStyle}> <div key={composerPopoverKey} className={`ecom-command-popover ecom-command-popover--settings ecom-command-popover--settings-${cloneOutput}${popoverClosingClass}`} style={composerPopoverStyle}>
{cloneOutput === "set" ? ( {cloneOutput === "set" ? (
@@ -6599,14 +6610,18 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
) : null} ) : null}
{shouldShowScenarioSettings ? ( {shouldShowScenarioSettings ? (
<div className="ecom-command-option-row ecom-command-option-row--settings"> <div className="ecom-command-option-row ecom-command-option-row--settings">
{activeCommerceScenario !== "salesVideo" && activeCommerceScenario !== "poster" ? (
<button type="button" className={composerMenu === "platform" ? "is-active" : ""} onClick={(event) => toggleComposerMenu("platform", event)}> <button type="button" className={composerMenu === "platform" ? "is-active" : ""} onClick={(event) => toggleComposerMenu("platform", event)}>
<span className="ecom-command-option-icon" aria-hidden="true"><GlobalOutlined /></span> <span className="ecom-command-option-icon" aria-hidden="true"><GlobalOutlined /></span>
<span></span>{platform} <span></span>{platform}
</button> </button>
) : null}
{activeCommerceScenario !== "salesVideo" ? (
<button type="button" className={composerMenu === "language" ? "is-active" : ""} onClick={(event) => toggleComposerMenu("language", event)}> <button type="button" className={composerMenu === "language" ? "is-active" : ""} onClick={(event) => toggleComposerMenu("language", event)}>
<span className="ecom-command-option-icon" aria-hidden="true"><FileImageOutlined /></span> <span className="ecom-command-option-icon" aria-hidden="true"><FileImageOutlined /></span>
<span></span>{language} <span></span>{language}
</button> </button>
) : null}
<button type="button" className={composerMenu === "ratio" ? "is-active" : ""} onClick={(event) => toggleComposerMenu("ratio", event)}> <button type="button" className={composerMenu === "ratio" ? "is-active" : ""} onClick={(event) => toggleComposerMenu("ratio", event)}>
<span className="ecom-command-option-icon" aria-hidden="true"><TableOutlined /></span> <span className="ecom-command-option-icon" aria-hidden="true"><TableOutlined /></span>
<span></span>{getRatioDisplayParts(ratio).aspect} <span></span>{getRatioDisplayParts(ratio).aspect}
@@ -6614,7 +6629,8 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
{scenarioAdvancedSettingsKeys.includes(activeCommerceScenario) ? ( {scenarioAdvancedSettingsKeys.includes(activeCommerceScenario) ? (
<button type="button" className={composerMenu === "settings" ? "is-active" : ""} onClick={(event) => toggleComposerMenu("settings", event)}> <button type="button" className={composerMenu === "settings" ? "is-active" : ""} onClick={(event) => toggleComposerMenu("settings", event)}>
<span className="ecom-command-option-icon" aria-hidden="true"><SettingOutlined /></span> <span className="ecom-command-option-icon" aria-hidden="true"><SettingOutlined /></span>
<span></span>{composerSettingLabel} <span>{activeCommerceScenario === "salesVideo" ? "时长" : "设置"}</span>
{activeCommerceScenario === "salesVideo" ? `${cloneVideoDuration}` : composerSettingLabel}
</button> </button>
) : null} ) : null}
</div> </div>
+386 -39
View File
@@ -14328,9 +14328,8 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
row-gap: 10px !important; row-gap: 10px !important;
} }
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings {
flex: 1 1 calc(50% - 5px) !important; display: none !important;
justify-content: flex-start !important;
} }
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
@@ -14339,40 +14338,6 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
} }
@media (max-width: 420px) { @media (max-width: 420px) {
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings {
display: flex !important;
flex-wrap: nowrap !important;
gap: 7px !important;
justify-content: stretch !important;
overflow: visible !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button {
display: inline-flex !important;
flex: 1 1 0 !important;
width: auto !important;
min-width: 0 !important;
max-width: none !important;
height: 42px !important;
min-height: 42px !important;
padding: 0 !important;
justify-content: center !important;
font-size: 0 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button > span:not(.ecom-command-option-icon) {
display: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings .ecom-command-option-icon {
display: inline-grid !important;
width: 22px !important;
height: 22px !important;
min-width: 22px !important;
margin: 0 !important;
font-size: 14px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
flex-direction: row !important; flex-direction: row !important;
align-items: center !important; align-items: center !important;
@@ -19482,9 +19447,16 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
border: 0 !important; border: 0 !important;
border-radius: 14px !important; border-radius: 14px !important;
color: #ffffff !important; color: #ffffff !important;
background: #181b1f !important; background: linear-gradient(135deg, #1ebddb 0%, #0f829b 100%) !important;
box-shadow: 0 12px 28px rgba(16, 32, 44, 0.14) !important; box-shadow: 0 12px 28px rgba(15, 130, 155, 0.22) !important;
text-align: center !important; text-align: center !important;
transition: transform 160ms ease, box-shadow 160ms ease !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-ai-submit:hover {
background: linear-gradient(135deg, #21c8e3 0%, #1194ad 100%) !important;
box-shadow: 0 14px 32px rgba(15, 130, 155, 0.28) !important;
transform: translateY(-1px) !important;
} }
@media (max-width: 640px) { @media (max-width: 640px) {
@@ -20125,3 +20097,378 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
color: #0f7895 !important; color: #0f7895 !important;
font-weight: 600 !important; font-weight: 600 !important;
} }
/* Platform picker: single-column scrollable list without logos, matching language/ratio style. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platforms.ecom-command-popover--platforms {
display: flex !important;
flex-direction: column !important;
flex-wrap: nowrap !important;
gap: 2px !important;
width: fit-content !important;
min-width: 0 !important;
max-width: calc(100vw - 48px) !important;
max-height: min(320px, calc(100dvh - 180px)) !important;
padding: 5px !important;
border: 1px solid rgba(16, 115, 204, 0.1) !important;
border-radius: 12px !important;
background: #ffffff !important;
box-shadow: 0 12px 32px rgba(16, 115, 204, 0.1) !important;
overflow-x: hidden !important;
overflow-y: auto !important;
scrollbar-width: thin !important;
scrollbar-color: rgba(16, 115, 204, 0.28) transparent !important;
animation: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platforms.ecom-command-popover--platforms button {
display: flex !important;
flex: 0 0 auto !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 36px !important;
min-height: 36px !important;
padding: 0 16px !important;
border: 0 !important;
border-radius: 8px !important;
color: rgba(16, 32, 44, 0.78) !important;
background: transparent !important;
font-size: 14px !important;
font-weight: 500 !important;
white-space: nowrap !important;
animation: none !important;
transition: background 120ms ease, color 120ms ease !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platforms.ecom-command-popover--platforms button:hover {
background: rgba(30, 189, 219, 0.08) !important;
color: #0f7895 !important;
transform: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platforms.ecom-command-popover--platforms button.is-active {
background: rgba(30, 189, 219, 0.12) !important;
color: #0f7895 !important;
font-weight: 600 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platforms.ecom-command-popover--platforms::-webkit-scrollbar {
width: 5px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platforms.ecom-command-popover--platforms::-webkit-scrollbar-thumb {
background: rgba(16, 115, 204, 0.28) !important;
border-radius: 999px !important;
}
/* Ratio & Language pickers: stronger active state so the selected option is clearly visible. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--ratio-picker.ecom-command-popover--ratio-picker button.is-active,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--languages.ecom-command-popover--languages button.is-active {
background: rgba(30, 189, 219, 0.2) !important;
color: #0f7895 !important;
font-weight: 700 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--ratio-picker.ecom-command-popover--ratio-picker button.is-active::before,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--languages.ecom-command-popover--languages button.is-active::before {
position: absolute !important;
left: 8px !important;
top: 50% !important;
width: 5px !important;
height: 5px !important;
border-radius: 999px !important;
background: #1ebddb !important;
transform: translateY(-50%) scale(1) !important;
opacity: 1 !important;
content: "" !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--ratio-picker.ecom-command-popover--ratio-picker button.is-active,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--languages.ecom-command-popover--languages button.is-active {
position: relative !important;
padding-left: 22px !important;
}
/* Platform picker: stronger active state with a visible dot indicator. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platforms.ecom-command-popover--platforms button.is-active {
position: relative !important;
padding-left: 22px !important;
background: rgba(30, 189, 219, 0.2) !important;
color: #0f7895 !important;
font-weight: 700 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platforms.ecom-command-popover--platforms button.is-active::before {
position: absolute !important;
left: 8px !important;
top: 50% !important;
width: 5px !important;
height: 5px !important;
border-radius: 999px !important;
background: #1ebddb !important;
transform: translateY(-50%) scale(1) !important;
opacity: 1 !important;
content: "" !important;
}
/* Ratio/Language/Platform pickers: clean active state without dot indicator, keep color highlight only. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--ratio-picker.ecom-command-popover--ratio-picker button.is-active,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--languages.ecom-command-popover--languages button.is-active,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platforms.ecom-command-popover--platforms button.is-active {
position: static !important;
padding-left: 16px !important;
padding-right: 16px !important;
background: rgba(30, 189, 219, 0.2) !important;
color: #0f7895 !important;
font-weight: 700 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--ratio-picker.ecom-command-popover--ratio-picker button.is-active::before,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--languages.ecom-command-popover--languages button.is-active::before,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--platforms.ecom-command-popover--platforms button.is-active::before {
content: none !important;
}
/* Duration picker: single-column scrollable list for video duration, matching ratio/language style. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--duration.ecom-command-popover--duration {
display: flex !important;
flex-direction: column !important;
flex-wrap: nowrap !important;
gap: 2px !important;
width: fit-content !important;
min-width: 0 !important;
max-width: calc(100vw - 48px) !important;
max-height: min(320px, calc(100dvh - 180px)) !important;
padding: 5px !important;
border: 1px solid rgba(16, 115, 204, 0.1) !important;
border-radius: 12px !important;
background: #ffffff !important;
box-shadow: 0 12px 32px rgba(16, 115, 204, 0.1) !important;
overflow-x: hidden !important;
overflow-y: auto !important;
scrollbar-width: thin !important;
scrollbar-color: rgba(16, 115, 204, 0.28) transparent !important;
animation: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--duration.ecom-command-popover--duration button {
display: flex !important;
flex: 0 0 auto !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 36px !important;
min-height: 36px !important;
padding: 0 16px !important;
border: 0 !important;
border-radius: 8px !important;
color: rgba(16, 32, 44, 0.78) !important;
background: transparent !important;
font-size: 14px !important;
font-weight: 500 !important;
white-space: nowrap !important;
animation: none !important;
transition: background 120ms ease, color 120ms ease !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--duration.ecom-command-popover--duration button:hover {
background: rgba(30, 189, 219, 0.08) !important;
color: #0f7895 !important;
transform: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-popover--duration.ecom-command-popover--duration button.is-active {
background: rgba(30, 189, 219, 0.2) !important;
color: #0f7895 !important;
font-weight: 700 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--duration.ecom-command-popover--duration::-webkit-scrollbar {
width: 5px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--duration.ecom-command-popover--duration::-webkit-scrollbar-thumb {
background: rgba(16, 115, 204, 0.28) !important;
border-radius: 999px !important;
}
/* Final composer rhythm: keep attachments compact and pin the toolbelt to the card bottom. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-items: stretch !important;
gap: clamp(12px, 1.6vw, 18px) !important;
min-height: clamp(250px, 31vh, 316px) !important;
padding: clamp(18px, 2.05vw, 24px) clamp(18px, 2.3vw, 26px) clamp(16px, 1.9vw, 22px) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) {
min-height: clamp(286px, 35vh, 340px) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-asset-popover,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover {
display: flex !important;
flex-wrap: nowrap !important;
align-items: center !important;
align-self: start !important;
gap: 12px !important;
width: 100% !important;
max-width: 100% !important;
min-height: 64px !important;
margin: 0 !important;
padding: 0 2px 2px !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scrollbar-width: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-popover::-webkit-scrollbar {
display: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add {
flex: 0 0 64px !important;
width: 64px !important;
height: 64px !important;
min-height: 64px !important;
padding: 0 !important;
border: 0 !important;
border-radius: 15px !important;
background: rgba(30, 189, 219, 0.1) !important;
color: #0b8fb2 !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add span {
font-size: 24px !important;
line-height: 1 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add small {
margin-top: 4px !important;
color: #0f7f9e !important;
font-size: 14px !important;
font-weight: 600 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb {
flex: 0 0 64px !important;
width: 64px !important;
height: 64px !important;
min-height: 64px !important;
border-radius: 15px !important;
box-shadow: 0 12px 28px rgba(16, 115, 204, 0.12) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-option-row--settings {
align-self: start !important;
margin: 0 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > textarea {
flex: 1 1 auto !important;
align-self: stretch !important;
width: 100% !important;
min-height: 86px !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.58 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea {
min-height: 78px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
flex: 0 0 auto !important;
align-self: end !important;
width: 100% !important;
margin: auto 0 0 !important;
padding-top: clamp(12px, 1.45vw, 16px) !important;
border-top: 1px solid rgba(30, 189, 219, 0.12) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-actions {
min-width: 0 !important;
}
@media (max-width: 640px) {
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
gap: 12px !important;
min-height: 318px !important;
padding: 18px 16px 16px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) {
min-height: 336px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-asset-popover,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover {
gap: 10px !important;
min-height: 58px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb {
flex-basis: 58px !important;
width: 58px !important;
height: 58px !important;
min-height: 58px !important;
border-radius: 14px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add span {
font-size: 22px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add small {
font-size: 13px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > textarea,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea {
min-height: 96px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
min-height: 58px !important;
padding-top: 12px !important;
}
}
@media (max-width: 390px) {
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
min-height: 306px !important;
padding-inline: 14px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) {
min-height: 326px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb {
flex-basis: 54px !important;
width: 54px !important;
height: 54px !important;
min-height: 54px !important;
}
}
+185 -2
View File
@@ -12522,9 +12522,16 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
border: 0 !important; border: 0 !important;
border-radius: 14px !important; border-radius: 14px !important;
color: #ffffff !important; color: #ffffff !important;
background: #181b1f !important; background: linear-gradient(135deg, #1ebddb 0%, #0f829b 100%) !important;
box-shadow: 0 12px 28px rgba(16, 32, 44, 0.14) !important; box-shadow: 0 12px 28px rgba(15, 130, 155, 0.22) !important;
text-align: center !important; text-align: center !important;
transition: transform 160ms ease, box-shadow 160ms ease !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-ai-submit:hover {
background: linear-gradient(135deg, #21c8e3 0%, #1194ad 100%) !important;
box-shadow: 0 14px 32px rgba(15, 130, 155, 0.28) !important;
transform: translateY(-1px) !important;
} }
@media (max-width: 640px) { @media (max-width: 640px) {
@@ -12639,3 +12646,179 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
overflow-y: auto !important; overflow-y: auto !important;
} }
} }
/* Final composer rhythm: keep attachments compact and pin the toolbelt to the card bottom. */
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
display: flex !important;
flex-direction: column !important;
justify-content: flex-start !important;
align-items: stretch !important;
gap: clamp(12px, 1.6vw, 18px) !important;
min-height: clamp(250px, 31vh, 316px) !important;
padding: clamp(18px, 2.05vw, 24px) clamp(18px, 2.3vw, 26px) clamp(16px, 1.9vw, 22px) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) {
min-height: clamp(286px, 35vh, 340px) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-asset-popover,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover {
display: flex !important;
flex-wrap: nowrap !important;
align-items: center !important;
align-self: start !important;
gap: 12px !important;
width: 100% !important;
max-width: 100% !important;
min-height: 64px !important;
margin: 0 !important;
padding: 0 2px 2px !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
overflow-x: auto !important;
overflow-y: hidden !important;
scrollbar-width: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-popover::-webkit-scrollbar {
display: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add {
flex: 0 0 64px !important;
width: 64px !important;
height: 64px !important;
min-height: 64px !important;
padding: 0 !important;
border: 0 !important;
border-radius: 15px !important;
background: rgba(30, 189, 219, 0.1) !important;
color: #0b8fb2 !important;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add span {
font-size: 24px !important;
line-height: 1 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add small {
margin-top: 4px !important;
color: #0f7f9e !important;
font-size: 14px !important;
font-weight: 600 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb {
flex: 0 0 64px !important;
width: 64px !important;
height: 64px !important;
min-height: 64px !important;
border-radius: 15px !important;
box-shadow: 0 12px 28px rgba(16, 115, 204, 0.12) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-option-row--settings {
align-self: start !important;
margin: 0 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > textarea {
flex: 1 1 auto !important;
align-self: stretch !important;
width: 100% !important;
min-height: 86px !important;
height: auto !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.58 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea {
min-height: 78px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
flex: 0 0 auto !important;
align-self: end !important;
width: 100% !important;
margin: auto 0 0 !important;
padding-top: clamp(12px, 1.45vw, 16px) !important;
border-top: 1px solid rgba(30, 189, 219, 0.12) !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-actions {
min-width: 0 !important;
}
@media (max-width: 640px) {
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
gap: 12px !important;
min-height: 318px !important;
padding: 18px 16px 16px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) {
min-height: 336px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-asset-popover,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-popover {
gap: 10px !important;
min-height: 58px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb {
flex-basis: 58px !important;
width: 58px !important;
height: 58px !important;
min-height: 58px !important;
border-radius: 14px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add span {
font-size: 22px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add small {
font-size: 13px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > textarea,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) > textarea {
min-height: 96px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
min-height: 58px !important;
padding-top: 12px !important;
}
}
@media (max-width: 390px) {
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
min-height: 306px !important;
padding-inline: 14px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) {
min-height: 326px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-asset-thumb,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-add,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap:not(.has-generated.is-compact) .clone-ai-input-wrapper.ecom-command-composer:has(.ecom-command-asset-popover) .ecom-command-asset-thumb {
flex-basis: 54px !important;
width: 54px !important;
height: 54px !important;
min-height: 54px !important;
}
}
+11 -43
View File
@@ -3461,9 +3461,8 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
row-gap: 10px !important; row-gap: 10px !important;
} }
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings {
flex: 1 1 calc(50% - 5px) !important; display: none !important;
justify-content: flex-start !important;
} }
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
@@ -3472,40 +3471,6 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
} }
@media (max-width: 420px) { @media (max-width: 420px) {
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings {
display: flex !important;
flex-wrap: nowrap !important;
gap: 7px !important;
justify-content: stretch !important;
overflow: visible !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button {
display: inline-flex !important;
flex: 1 1 0 !important;
width: auto !important;
min-width: 0 !important;
max-width: none !important;
height: 42px !important;
min-height: 42px !important;
padding: 0 !important;
justify-content: center !important;
font-size: 0 !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings button > span:not(.ecom-command-option-icon) {
display: none !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-option-row.ecom-command-option-row--settings .ecom-command-option-icon {
display: inline-grid !important;
width: 22px !important;
height: 22px !important;
min-width: 22px !important;
margin: 0 !important;
font-size: 14px !important;
}
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
flex-direction: row !important; flex-direction: row !important;
align-items: center !important; align-items: center !important;
@@ -3560,15 +3525,18 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
z-index: 160 !important; z-index: 160 !important;
} }
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platform { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--platforms {
width: min(360px, calc(100% - var(--composer-popover-left, 0px))) !important; width: fit-content !important;
max-width: min(360px, calc(100% - var(--composer-popover-left, 0px))) !important; min-width: 0 !important;
max-width: min(320px, calc(100% - var(--composer-popover-left, 0px))) !important;
} }
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--languages, html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--languages,
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--ratio-picker { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--ratio-picker,
width: min(420px, calc(100% - var(--composer-popover-left, 0px))) !important; html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--duration {
max-width: min(420px, calc(100% - var(--composer-popover-left, 0px))) !important; width: fit-content !important;
min-width: 0 !important;
max-width: min(320px, calc(100% - var(--composer-popover-left, 0px))) !important;
} }
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings { html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer > .ecom-command-popover.ecom-command-popover--settings {