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

- 新增带货视频时长选项(5/10/15秒)及时长选择 popover

- 创作标签在移动端(<=640px)隐藏平台/语种/比例/设置/时长按钮行,仅保留文本输入框

- 重构平台选择器为单列滚动列表,移除平台 logo,统一比例/语种/平台 active 高亮样式

- 优化 composer 整体布局节奏(素材紧凑、工具栏底部固定、响应式高度)

- 调整 AI 帮写提交按钮为青色系渐变样式
This commit is contained in:
2026-06-17 17:02:10 +08:00
parent 2cd76ec3a5
commit 6dd2a107fd
4 changed files with 617 additions and 103 deletions
+11 -43
View File
@@ -3461,9 +3461,8 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
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 {
flex: 1 1 calc(50% - 5px) !important;
justify-content: flex-start !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 {
display: none !important;
}
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) {
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 {
flex-direction: row !important;
align-items: center !important;
@@ -3560,15 +3525,18 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
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 {
width: min(360px, calc(100% - var(--composer-popover-left, 0px))) !important;
max-width: min(360px, 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--platforms {
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--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 {
width: min(420px, calc(100% - var(--composer-popover-left, 0px))) !important;
max-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--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--duration {
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 {