From cc4e084dc88804080f9cf679743889bc87c92cc9 Mon Sep 17 00:00:00 2001
From: Stringadmin <admin@omniai.net.cn>
Date: Tue, 16 Jun 2026 14:51:12 +0800
Subject: [PATCH] style: remove web-shell topbar banner and page top gradient

---
 src/App.tsx                         |  6 ++-
 src/styles/ecommerce-standalone.css | 69 +++++++++++++++++------------
 2 files changed, 45 insertions(+), 30 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 70ebc81..70965d7 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -350,7 +350,10 @@ function App() {
 
   return (
     <div className="ecommerce-standalone web-shell" data-theme="dark" data-ui-theme="dark-green" data-view="ecommerce">
-      <header className="ecommerce-standalone__topbar">
+      <header
+        className="ecommerce-standalone__topbar"
+        style={{ background: "transparent !important", border: "none !important", boxShadow: "none !important", backdropFilter: "none !important" }}
+      >
         <button type="button" className="ecommerce-standalone__brand" onClick={handleOpenWorkspace}>
           <span className="ecommerce-standalone__logo" aria-hidden="true">
             <img src="https://stringtest.oss-cn-hangzhou.aliyuncs.com/logo.png" alt="" />
@@ -366,6 +369,7 @@ function App() {
               <button
                 type="button"
                 className="ecommerce-profile-menu__trigger"
+                style={{ background: "transparent !important", border: "none !important", boxShadow: "none !important" }}
                 onClick={() => setProfileMenuOpen((open) => !open)}
                 aria-haspopup="dialog"
                 aria-expanded={profileMenuOpen}
diff --git a/src/styles/ecommerce-standalone.css b/src/styles/ecommerce-standalone.css
index 043e658..b1cbef5 100644
--- a/src/styles/ecommerce-standalone.css
+++ b/src/styles/ecommerce-standalone.css
@@ -12,9 +12,7 @@
 }
 
 .ecommerce-standalone__topbar {
-  position: fixed;
-  inset: 0 0 auto;
-  z-index: 80;
+  position: relative;
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -22,8 +20,7 @@
   min-height: 64px;
   padding: 10px clamp(16px, 3vw, 32px);
   border-bottom: 1px solid rgba(255, 255, 255, 0.08);
-  background: rgba(8, 12, 10, 0.78);
-  backdrop-filter: blur(18px);
+  background: transparent;
 }
 
 .ecommerce-standalone__brand,
@@ -66,7 +63,6 @@
 
 .ecommerce-standalone__content {
   height: 100vh;
-  padding-top: 64px;
 }
 
 /* 工作台与个人中心常驻同层，用 hidden 切换以保活生成任务状态。
@@ -230,7 +226,6 @@
   }
 
   .ecommerce-standalone__content {
-    padding-top: 58px;
   }
 }
 
@@ -249,8 +244,7 @@
 
 .ecommerce-standalone__topbar {
   border-bottom-color: rgba(126, 235, 255, 0.22);
-  background:
-    linear-gradient(90deg, rgba(7, 72, 121, 0.94), rgba(4, 37, 75, 0.92));
+  background: transparent;
 }
 
 .ecommerce-standalone__brand::before {
@@ -318,7 +312,7 @@
 
 .ecommerce-standalone__topbar {
   border-bottom-color: rgba(30, 189, 219, 0.16) !important;
-  background: #f8f9fa !important;
+  background: transparent !important;
 }
 
 .ecommerce-standalone__brand::before {
@@ -12263,26 +12257,12 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
 /* #/imageWorkbench detail popover and topbar blend: no inner scrollbar, no hard header split. */
 html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__topbar {
   border-bottom-color: transparent !important;
-  background:
-    radial-gradient(48rem 14rem at 50% 100%, rgba(30, 189, 219, 0.09), transparent 72%),
-    radial-gradient(28rem 12rem at 12% 100%, rgba(16, 115, 204, 0.045), transparent 68%),
-    linear-gradient(180deg, #fbfdfe 0%, #f8fbfc 100%) !important;
+  background: transparent !important;
   box-shadow: none !important;
   backdrop-filter: none !important;
   -webkit-backdrop-filter: none !important;
 }
 
-html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__topbar::after {
-  position: absolute !important;
-  right: 0 !important;
-  bottom: -1px !important;
-  left: 0 !important;
-  height: 1px !important;
-  background: linear-gradient(90deg, transparent, rgba(30, 189, 219, 0.08), transparent) !important;
-  content: "" !important;
-  pointer-events: 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-popover.ecom-command-popover--settings-detail {
   width: min(468px, calc(100vw - 48px)) !important;
   max-width: min(468px, calc(100vw - 48px)) !important;
@@ -12352,10 +12332,7 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
 
 /* #/imageWorkbench topbar seamless blend: the header floats over the same canvas instead of reading as a separate band. */
 html body #root .ecommerce-standalone.web-shell {
-  background:
-    radial-gradient(circle at 19% 8%, rgba(30, 189, 219, 0.13), transparent 24rem),
-    radial-gradient(circle at 82% 11%, rgba(16, 115, 204, 0.09), transparent 26rem),
-    linear-gradient(180deg, #fbfdfe 0%, #f8f9fa 54%, #f5f9fb 100%) !important;
+  background: #f8f9fa !important;
 }
 
 html body #root .ecommerce-standalone.web-shell .ecommerce-standalone__topbar {
@@ -17433,3 +17410,37 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
     margin-left: 0 !important;
   }
 }
+
+/* Hide the topbar banner background while keeping brand and account in place. */
+html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__topbar {
+  border-bottom: none !important;
+  background: transparent !important;
+  box-shadow: none !important;
+  backdrop-filter: none !important;
+  -webkit-backdrop-filter: none !important;
+}
+
+html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__topbar::after {
+  content: none !important;
+}
+
+/* Keep topbar transparent and remove any background/border from inner controls. */
+html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__brand,
+html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__brand strong,
+html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__credits,
+html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__account button,
+html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-profile-menu__trigger {
+  color: #10202c !important;
+  background: transparent !important;
+  background-color: transparent !important;
+  background-image: none !important;
+  border: none !important;
+  border-color: transparent !important;
+  box-shadow: none !important;
+  backdrop-filter: none !important;
+  -webkit-backdrop-filter: none !important;
+}
+
+html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__credits {
+  color: #3a5a6a !important;
+}