Compare commits
3 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 stringadmin
|
207f05ac86 | ||
 ludan
|
2a2ab701e3 | ||
|
stringadmin
|
cf88bc05e4 |
@@ -347,6 +347,8 @@ function App() {
|
||||
toast.info("Bug 反馈入口已保留，后续可接入反馈页面。");
|
||||
};
|
||||
|
||||
const shouldShowEcommerceTopbar = currentPage === "workspace" && !workspaceChrome.isToolPage;
|
||||
|
||||
return (
|
||||
<div
|
||||
className="ecommerce-standalone web-shell"
|
||||
@@ -355,6 +357,7 @@ function App() {
|
||||
data-view="ecommerce"
|
||||
data-workspace-tool-page={workspaceChrome.isToolPage ? "true" : "false"}
|
||||
>
|
||||
{shouldShowEcommerceTopbar ? (
|
||||
<Topbar
|
||||
session={session}
|
||||
usage={usage}
|
||||
@@ -366,6 +369,7 @@ function App() {
|
||||
onLogout={handleLogout}
|
||||
onBugFeedback={handleBugFeedback}
|
||||
/>
|
||||
) : null}
|
||||
|
||||
<main className="ecommerce-standalone__content">
|
||||
{session ? (
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
import {
|
||||
AppstoreOutlined,
|
||||
AppstoreAddOutlined,
|
||||
BorderOuterOutlined,
|
||||
ClearOutlined,
|
||||
CloudUploadOutlined,
|
||||
CloseOutlined,
|
||||
@@ -7,14 +9,17 @@ import {
|
||||
EditOutlined,
|
||||
FireOutlined,
|
||||
FileImageOutlined,
|
||||
FileTextOutlined,
|
||||
FolderOpenOutlined,
|
||||
FrownOutlined,
|
||||
GlobalOutlined,
|
||||
HighlightOutlined,
|
||||
LayoutOutlined,
|
||||
LoadingOutlined,
|
||||
MenuFoldOutlined,
|
||||
MenuUnfoldOutlined,
|
||||
PaperClipOutlined,
|
||||
PlayCircleOutlined,
|
||||
PlusOutlined,
|
||||
QuestionCircleOutlined,
|
||||
ReloadOutlined,
|
||||
@@ -22,6 +27,7 @@ import {
|
||||
SettingOutlined,
|
||||
SkinOutlined,
|
||||
TableOutlined,
|
||||
TranslationOutlined,
|
||||
VideoCameraOutlined,
|
||||
} from "@ant-design/icons";
|
||||
import {
|
||||
@@ -256,6 +262,7 @@ import {
|
||||
|
||||
|
||||
interface ProductClonePageProps {
|
||||
onWorkspaceChromeChange?: (state: { isToolPage: boolean }) => void;
|
||||
[key: string]: unknown;
|
||||
}
|
||||
|
||||
@@ -811,7 +818,7 @@ const cloneSetCountOptions: Array<{
|
||||
const cloneSetCountKeys = cloneSetCountOptions.map((option) => option.key);
|
||||
const minCloneSetTotal = 1;
|
||||
const maxCloneSetTotal = 16;
|
||||
const maxCloneProductImages = 20;
|
||||
const maxCloneProductImages = 10;
|
||||
const maxCloneReferenceImages = 20;
|
||||
const cloneVideoDurationMin = 5;
|
||||
const cloneVideoDurationMax = 45;
|
||||
@@ -1084,6 +1091,7 @@ function mergeEcommerceHistoryRecords(...recordGroups: EcommerceHistoryRecord[][
|
||||
}
|
||||
|
||||
function ProductClonePage(_props: ProductClonePageProps = {}) {
|
||||
const { onWorkspaceChromeChange } = _props;
|
||||
const setInputRef = useRef<HTMLInputElement>(null);
|
||||
const productInputRef = useRef<HTMLInputElement>(null);
|
||||
const cloneReferenceInputRef = useRef<HTMLInputElement>(null);
|
||||
@@ -2939,7 +2947,13 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
|
||||
const imageFiles = notifyRejectedImages(files);
|
||||
if (!imageFiles.length) return;
|
||||
const remainingSlots = maxCloneProductImages - productImages.length;
|
||||
if (remainingSlots <= 0) return;
|
||||
if (remainingSlots <= 0) {
|
||||
toast.info(`最多上传 ${maxCloneProductImages} 张素材`);
|
||||
return;
|
||||
}
|
||||
if (imageFiles.length > remainingSlots) {
|
||||
toast.info(`最多上传 ${maxCloneProductImages} 张素材，已自动保留前 ${remainingSlots} 张`);
|
||||
}
|
||||
|
||||
const localItems = createLocalImageItems(imageFiles, remainingSlots, "product");
|
||||
setProductImages((current) => [...current, ...localItems].slice(0, maxCloneProductImages));
|
||||
@@ -4668,6 +4682,29 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
|
||||
const isQuickSetTool = isCloneTool && activeQuickTool === "quick-set";
|
||||
const isCopywritingTool = isCloneTool && activeQuickTool === "copywriting";
|
||||
const isOneClickVideoTool = isCloneTool && activeQuickTool === "oneClickVideo";
|
||||
const isWorkspaceToolPage =
|
||||
!isCloneTool ||
|
||||
isSmartCutoutTool ||
|
||||
isQuickDetailTool ||
|
||||
isWatermarkTool ||
|
||||
isTranslateTool ||
|
||||
isImageEditTool ||
|
||||
isHotCloneTool ||
|
||||
isQuickSetTool ||
|
||||
isCopywritingTool ||
|
||||
isOneClickVideoTool ||
|
||||
isVideoWorkspaceVisible ||
|
||||
Boolean(activeHistoryRecordId);
|
||||
|
||||
useEffect(() => {
|
||||
onWorkspaceChromeChange?.({ isToolPage: isWorkspaceToolPage });
|
||||
}, [isWorkspaceToolPage, onWorkspaceChromeChange]);
|
||||
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
onWorkspaceChromeChange?.({ isToolPage: false });
|
||||
};
|
||||
}, [onWorkspaceChromeChange]);
|
||||
const pageLabel = isSetTool ? "商品套图" : isDetail ? "A+/详情页" : isTryOn ? "AI服饰穿戴" : activeToolMeta?.label || "商品工具";
|
||||
const setPrimaryLabel =
|
||||
setImages.length === 0
|
||||
@@ -6328,7 +6365,13 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
|
||||
<button
|
||||
type="button"
|
||||
className={`ecom-command-reference ecom-command-reference--bottom ecom-command-tool ecom-command-tool--upload${productImages.length ? " has-images" : ""}${isProductUploadDragging ? " is-dragging" : ""}`}
|
||||
onClick={() => productInputRef.current?.click()}
|
||||
onClick={() => {
|
||||
if (productImages.length >= maxCloneProductImages) {
|
||||
toast.info(`最多上传 ${maxCloneProductImages} 张素材`);
|
||||
return;
|
||||
}
|
||||
productInputRef.current?.click();
|
||||
}}
|
||||
onDragEnter={(event) => {
|
||||
event.preventDefault();
|
||||
setIsProductUploadDragging(true);
|
||||
@@ -6341,8 +6384,9 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
|
||||
const files = Array.from(event.dataTransfer.files);
|
||||
if (files.length) addComposerAssets(files);
|
||||
}}
|
||||
aria-label="上传素材"
|
||||
title="上传素材"
|
||||
aria-disabled={productImages.length >= maxCloneProductImages}
|
||||
aria-label={productImages.length >= maxCloneProductImages ? `最多上传 ${maxCloneProductImages} 张素材` : "上传素材"}
|
||||
title={productImages.length >= maxCloneProductImages ? `最多上传 ${maxCloneProductImages} 张素材` : "上传素材"}
|
||||
>
|
||||
<span aria-hidden="true"><PaperClipOutlined /></span>
|
||||
<strong>上传素材</strong>
|
||||
@@ -6458,15 +6502,15 @@ function ProductClonePage(_props: ProductClonePageProps = {}) {
|
||||
{(status === "idle" || status === "ready") && !showMainVideoWorkspace ? (
|
||||
<section className="ecom-command-quick-board" aria-label="快捷功能">
|
||||
{[
|
||||
{ label: "A+/详情页", tone: "detail", icon: <LayoutOutlined />, onClick: openQuickDetailPage },
|
||||
{ label: "A+/详情页", tone: "detail", icon: <BorderOuterOutlined />, onClick: openQuickDetailPage },
|
||||
{ label: "爆款复刻", tone: "hot", icon: <FireOutlined />, onClick: openHotClonePage },
|
||||
{ label: "图片修改", tone: "edit", icon: <EditOutlined />, onClick: openImageWorkbenchPage },
|
||||
{ label: "图片修改", tone: "edit", icon: <HighlightOutlined />, onClick: openImageWorkbenchPage },
|
||||
{ label: "智能抠图", tone: "cutout", icon: <ScissorOutlined />, onClick: openSmartCutoutUpload },
|
||||
{ label: "去除水印", tone: "watermark", icon: <ClearOutlined />, onClick: openWatermarkRemovalPage },
|
||||
{ label: "图片翻译", tone: "translate", icon: <GlobalOutlined />, onClick: openImageTranslatePage },
|
||||
{ label: "商品套图", tone: "product", icon: <AppstoreOutlined />, onClick: openQuickSetPage },
|
||||
{ label: "一键文案", tone: "copywriting", icon: <EditOutlined />, onClick: openCopywritingPage },
|
||||
{ label: "一键视频", tone: "video", icon: <VideoCameraOutlined />, onClick: openOneClickVideoPage },
|
||||
{ label: "图片翻译", tone: "translate", icon: <TranslationOutlined />, onClick: openImageTranslatePage },
|
||||
{ label: "商品套图", tone: "product", icon: <AppstoreAddOutlined />, onClick: openQuickSetPage },
|
||||
{ label: "一键文案", tone: "copywriting", icon: <FileTextOutlined />, onClick: openCopywritingPage },
|
||||
{ label: "一键视频", tone: "video", icon: <PlayCircleOutlined />, onClick: openOneClickVideoPage },
|
||||
{ label: "更多功能", tone: "more", icon: <SettingOutlined />, disabled: true },
|
||||
].map((item) => (
|
||||
<button
|
||||
|
||||
@@ -20784,3 +20784,212 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
|
||||
grid-template-rows: auto minmax(0, 1fr) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Ecommerce home quick tools: match the soft product-card background language. */
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board {
|
||||
gap: 10px !important;
|
||||
padding: 8px !important;
|
||||
border: 0 !important;
|
||||
border-radius: 0 !important;
|
||||
background: transparent !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--detail {
|
||||
--quick-card-glow: rgba(198, 213, 255, 0.56) !important;
|
||||
--quick-card-glow-hover: rgba(177, 196, 252, 0.72) !important;
|
||||
--quick-card-icon: #4967c8 !important;
|
||||
--quick-card-text: #142133 !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--hot {
|
||||
--quick-card-glow: rgba(255, 226, 184, 0.54) !important;
|
||||
--quick-card-glow-hover: rgba(255, 211, 151, 0.72) !important;
|
||||
--quick-card-icon: #b56a1f !important;
|
||||
--quick-card-text: #1f2630 !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--edit {
|
||||
--quick-card-glow: rgba(244, 204, 234, 0.54) !important;
|
||||
--quick-card-glow-hover: rgba(237, 181, 222, 0.7) !important;
|
||||
--quick-card-icon: #a44986 !important;
|
||||
--quick-card-text: #1d2330 !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--cutout {
|
||||
--quick-card-glow: rgba(188, 234, 255, 0.56) !important;
|
||||
--quick-card-glow-hover: rgba(161, 222, 250, 0.72) !important;
|
||||
--quick-card-icon: #2479a7 !important;
|
||||
--quick-card-text: #122431 !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--watermark {
|
||||
--quick-card-glow: rgba(250, 210, 199, 0.52) !important;
|
||||
--quick-card-glow-hover: rgba(243, 188, 174, 0.7) !important;
|
||||
--quick-card-icon: #b64e3c !important;
|
||||
--quick-card-text: #20242c !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--translate {
|
||||
--quick-card-glow: rgba(181, 230, 219, 0.55) !important;
|
||||
--quick-card-glow-hover: rgba(154, 217, 202, 0.72) !important;
|
||||
--quick-card-icon: #167667 !important;
|
||||
--quick-card-text: #13272a !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--product {
|
||||
--quick-card-glow: rgba(207, 237, 194, 0.56) !important;
|
||||
--quick-card-glow-hover: rgba(185, 226, 169, 0.72) !important;
|
||||
--quick-card-icon: #3f7d3d !important;
|
||||
--quick-card-text: #17252a !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--copywriting {
|
||||
--quick-card-glow: rgba(205, 218, 236, 0.54) !important;
|
||||
--quick-card-glow-hover: rgba(185, 203, 226, 0.7) !important;
|
||||
--quick-card-icon: #3e587f !important;
|
||||
--quick-card-text: #162231 !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--video {
|
||||
--quick-card-glow: rgba(214, 204, 250, 0.56) !important;
|
||||
--quick-card-glow-hover: rgba(196, 182, 244, 0.72) !important;
|
||||
--quick-card-icon: #6b50b6 !important;
|
||||
--quick-card-text: #1b2132 !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-quick-board .ecom-command-quick-card--more {
|
||||
--quick-card-glow: rgba(219, 226, 232, 0.56) !important;
|
||||
--quick-card-glow-hover: rgba(201, 211, 220, 0.72) !important;
|
||||
--quick-card-icon: #52606f !important;
|
||||
--quick-card-text: #17212c !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card {
|
||||
--quick-card-glow: rgba(205, 231, 238, 0.5);
|
||||
--quick-card-glow-hover: rgba(181, 221, 231, 0.68);
|
||||
--quick-card-icon: #1073cc;
|
||||
--quick-card-text: #10202c;
|
||||
min-height: 58px !important;
|
||||
gap: 10px !important;
|
||||
justify-content: flex-start !important;
|
||||
padding: 12px 14px !important;
|
||||
border: 1px solid rgba(16, 32, 44, 0.08) !important;
|
||||
border-radius: 15px !important;
|
||||
background:
|
||||
radial-gradient(circle at 18% 12%, var(--quick-card-glow), transparent 54%),
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(255, 255, 255, 0.86)) !important;
|
||||
color: var(--quick-card-text) !important;
|
||||
box-shadow: none !important;
|
||||
transform: none !important;
|
||||
transition:
|
||||
background 180ms ease,
|
||||
border-color 180ms ease,
|
||||
box-shadow 180ms ease,
|
||||
color 180ms ease,
|
||||
transform 180ms ease !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card:hover,
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card:focus-visible {
|
||||
border-color: rgba(16, 32, 44, 0.1) !important;
|
||||
background:
|
||||
radial-gradient(circle at 18% 12%, var(--quick-card-glow-hover), transparent 58%),
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.9)) !important;
|
||||
color: var(--quick-card-icon) !important;
|
||||
box-shadow: 0 10px 24px rgba(16, 32, 44, 0.045) !important;
|
||||
transform: translateY(-1px) !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card > span {
|
||||
position: relative !important;
|
||||
display: grid !important;
|
||||
place-items: center !important;
|
||||
width: 30px !important;
|
||||
height: 30px !important;
|
||||
flex: 0 0 30px !important;
|
||||
border: 0 !important;
|
||||
border-radius: 10px !important;
|
||||
background: transparent !important;
|
||||
color: var(--quick-card-icon) !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card > span::after {
|
||||
content: "→";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
color: var(--quick-card-icon);
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
line-height: 1;
|
||||
opacity: 0;
|
||||
transform: translateX(-4px);
|
||||
transition: opacity 160ms ease, transform 160ms ease;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card > span .anticon,
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card > span svg {
|
||||
width: 17px !important;
|
||||
height: 17px !important;
|
||||
color: inherit !important;
|
||||
fill: currentColor !important;
|
||||
transition: opacity 160ms ease, transform 160ms ease !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card:hover > span .anticon,
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card:hover > span svg,
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card:focus-visible > span .anticon,
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card:focus-visible > span svg {
|
||||
opacity: 0 !important;
|
||||
transform: translateX(4px) scale(0.92) !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card:hover > span::after,
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card:focus-visible > span::after {
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card strong {
|
||||
color: var(--quick-card-text) !important;
|
||||
font-size: 14px !important;
|
||||
font-weight: 750 !important;
|
||||
}
|
||||
|
||||
@media (max-width: 760px) {
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board {
|
||||
gap: 8px !important;
|
||||
padding: 6px !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card {
|
||||
min-height: 54px !important;
|
||||
gap: 8px !important;
|
||||
padding: 10px !important;
|
||||
border-radius: 14px !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card > span {
|
||||
width: 26px !important;
|
||||
height: 26px !important;
|
||||
flex-basis: 26px !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap:has(.ecom-inspiration-lab) .ecom-command-quick-board button.ecom-command-quick-card strong {
|
||||
font-size: 13px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Ecommerce home hero rhythm: bring the command area closer to the topbar. */
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap.is-before-generate:has(.ecom-inspiration-lab) {
|
||||
top: -18px !important;
|
||||
}
|
||||
|
||||
@media (max-width: 760px) {
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap.ecom-command-composer-wrap.is-before-generate:has(.ecom-inspiration-lab) {
|
||||
top: -10px !important;
|
||||
}
|
||||
}
|
||||
|
||||
+171
-27
@@ -11281,50 +11281,155 @@
|
||||
}
|
||||
|
||||
.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: #feffff !important;
|
||||
box-shadow: 0 22px 58px rgba(16, 115, 204, 0.08) !important;
|
||||
gap: 10px !important;
|
||||
padding: 12px !important;
|
||||
border: 1px solid rgba(30, 189, 219, 0.14) !important;
|
||||
border-radius: 18px !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.78), rgba(247, 252, 253, 0.58)) !important;
|
||||
box-shadow:
|
||||
0 18px 46px rgba(16, 115, 204, 0.07),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.82) !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;
|
||||
--quick-accent: #1073cc;
|
||||
--quick-tint: rgba(16, 115, 204, 0.1);
|
||||
--quick-line: rgba(16, 115, 204, 0.14);
|
||||
min-height: 58px !important;
|
||||
gap: 10px !important;
|
||||
justify-content: flex-start !important;
|
||||
padding: 12px 14px !important;
|
||||
border: 1px solid var(--quick-line) !important;
|
||||
border-radius: 14px !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(247, 252, 253, 0.88)) !important;
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(250, 253, 254, 0.78)) !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;
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.9),
|
||||
0 8px 22px rgba(16, 115, 204, 0.045) !important;
|
||||
transition:
|
||||
border-color 180ms ease,
|
||||
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;
|
||||
border-color: color-mix(in srgb, var(--quick-accent) 34%, transparent) !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);
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(247, 252, 253, 0.92)) !important;
|
||||
color: #0f2533 !important;
|
||||
box-shadow:
|
||||
0 14px 30px rgba(16, 115, 204, 0.09),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.94) !important;
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.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-card--detail {
|
||||
--quick-accent: #4f70d9;
|
||||
--quick-tint: rgba(79, 112, 217, 0.12);
|
||||
--quick-line: rgba(79, 112, 217, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-card--hot {
|
||||
--quick-accent: #c66b1f;
|
||||
--quick-tint: rgba(198, 107, 31, 0.12);
|
||||
--quick-line: rgba(198, 107, 31, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-card--edit {
|
||||
--quick-accent: #8d6cdb;
|
||||
--quick-tint: rgba(141, 108, 219, 0.12);
|
||||
--quick-line: rgba(141, 108, 219, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-card--cutout {
|
||||
--quick-accent: #0a7ca8;
|
||||
--quick-tint: rgba(10, 124, 168, 0.12);
|
||||
--quick-line: rgba(10, 124, 168, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-card--watermark {
|
||||
--quick-accent: #b14f6f;
|
||||
--quick-tint: rgba(177, 79, 111, 0.12);
|
||||
--quick-line: rgba(177, 79, 111, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-card--translate {
|
||||
--quick-accent: #0a8a8a;
|
||||
--quick-tint: rgba(10, 138, 138, 0.12);
|
||||
--quick-line: rgba(10, 138, 138, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-card--product {
|
||||
--quick-accent: #19856d;
|
||||
--quick-tint: rgba(25, 133, 109, 0.12);
|
||||
--quick-line: rgba(25, 133, 109, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-card--copywriting {
|
||||
--quick-accent: #3f64cf;
|
||||
--quick-tint: rgba(63, 100, 207, 0.12);
|
||||
--quick-line: rgba(63, 100, 207, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-card--video {
|
||||
--quick-accent: #2878a8;
|
||||
--quick-tint: rgba(40, 120, 168, 0.12);
|
||||
--quick-line: rgba(40, 120, 168, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-card--more {
|
||||
--quick-accent: #778894;
|
||||
--quick-tint: rgba(119, 136, 148, 0.12);
|
||||
--quick-line: rgba(119, 136, 148, 0.16);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board strong {
|
||||
color: var(--ecom-entry-text) !important;
|
||||
font-size: 15px !important;
|
||||
font-size: 14px !important;
|
||||
font-weight: 800 !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;
|
||||
display: grid !important;
|
||||
place-items: center !important;
|
||||
width: 28px !important;
|
||||
height: 28px !important;
|
||||
min-width: 28px !important;
|
||||
border: 1px solid color-mix(in srgb, var(--quick-accent) 18%, transparent) !important;
|
||||
border-radius: 10px !important;
|
||||
color: var(--quick-accent) !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.66), var(--quick-tint)) !important;
|
||||
font-size: 14px !important;
|
||||
line-height: 1 !important;
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.74) !important;
|
||||
transition:
|
||||
background 180ms ease,
|
||||
border-color 180ms ease,
|
||||
transform 180ms ease !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button:hover span {
|
||||
border-color: color-mix(in srgb, var(--quick-accent) 30%, transparent) !important;
|
||||
background:
|
||||
linear-gradient(180deg, rgba(255, 255, 255, 0.82), color-mix(in srgb, var(--quick-accent) 17%, white)) !important;
|
||||
transform: scale(1.04);
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board span svg {
|
||||
width: 14px !important;
|
||||
height: 14px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover,
|
||||
@@ -11361,7 +11466,7 @@
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button {
|
||||
min-height: 72px !important;
|
||||
min-height: 58px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -11427,22 +11532,28 @@
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board {
|
||||
border-radius: 20px !important;
|
||||
padding: 10px !important;
|
||||
gap: 8px !important;
|
||||
border-radius: 16px !important;
|
||||
padding: 8px !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;
|
||||
min-height: 54px !important;
|
||||
gap: 8px !important;
|
||||
padding: 10px !important;
|
||||
border-radius: 13px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board strong {
|
||||
font-size: 14px !important;
|
||||
font-size: 13px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board span {
|
||||
font-size: 11px !important;
|
||||
width: 26px !important;
|
||||
height: 26px !important;
|
||||
min-width: 26px !important;
|
||||
border-radius: 9px !important;
|
||||
font-size: 13px !important;
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-popover,
|
||||
@@ -11484,7 +11595,8 @@
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button {
|
||||
min-height: 58px !important;
|
||||
min-height: 52px !important;
|
||||
padding-inline: 9px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -11498,7 +11610,7 @@
|
||||
}
|
||||
|
||||
.ecommerce-standalone .product-clone-page[data-tool="clone"] .ecom-command-quick-board button {
|
||||
min-height: 64px !important;
|
||||
min-height: 54px !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -12782,10 +12894,22 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-composer-wrap {
|
||||
width: min(100%, calc(100vw - 24px)) !important;
|
||||
max-width: calc(100vw - 24px) !important;
|
||||
min-width: 0 !important;
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .clone-ai-input-wrapper.ecom-command-composer {
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
min-width: 0 !important;
|
||||
gap: 12px !important;
|
||||
min-height: 318px !important;
|
||||
padding: 18px 16px 16px !important;
|
||||
overflow: hidden !important;
|
||||
box-sizing: border-box !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) {
|
||||
@@ -12794,17 +12918,33 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
|
||||
|
||||
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 {
|
||||
align-self: stretch !important;
|
||||
gap: 10px !important;
|
||||
width: 100% !important;
|
||||
max-width: 100% !important;
|
||||
min-width: 0 !important;
|
||||
min-height: 58px !important;
|
||||
flex-wrap: nowrap !important;
|
||||
overflow-x: auto !important;
|
||||
overflow-y: hidden !important;
|
||||
overscroll-behavior-inline: contain !important;
|
||||
scrollbar-width: none !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::-webkit-scrollbar,
|
||||
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::-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-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: 0 0 58px !important;
|
||||
flex-basis: 58px !important;
|
||||
width: 58px !important;
|
||||
height: 58px !important;
|
||||
min-width: 58px !important;
|
||||
min-height: 58px !important;
|
||||
border-radius: 14px !important;
|
||||
}
|
||||
@@ -12823,6 +12963,8 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
|
||||
}
|
||||
|
||||
html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[data-tool="clone"][data-tool="clone"] .ecom-command-toolbar {
|
||||
width: 100% !important;
|
||||
min-width: 0 !important;
|
||||
min-height: 58px !important;
|
||||
padding-top: 12px !important;
|
||||
}
|
||||
@@ -12842,9 +12984,11 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
|
||||
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: 0 0 54px !important;
|
||||
flex-basis: 54px !important;
|
||||
width: 54px !important;
|
||||
height: 54px !important;
|
||||
min-width: 54px !important;
|
||||
min-height: 54px !important;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user