OmniAI/omniai-ds-code-package
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: redesign transparent topbar with readable inner elements

Browse Source
This commit is contained in:
Stringadmin
2026-06-16 14:51:12 +08:00
parent f1be7d8d66
commit f0ac1ffbcf
1 changed files with 45 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/styles/ecommerce-standalone.css
+45
View File
@@ -17433,3 +17433,48 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
margin-left: 0 !important; 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;
}
/* Redesign topbar inner elements for readability on transparent background. */
html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__brand strong {
color: #10202c !important;
font-weight: 800 !important;
letter-spacing: -0.02em !important;
}
html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__credits {
color: #3a5a6a !important;
font-weight: 600 !important;
}
html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__account button {
gap: 8px !important;
min-height: 36px !important;
padding: 0 13px !important;
border: 1px solid rgba(30, 189, 219, 0.18) !important;
border-radius: 999px !important;
color: #10202c !important;
background: rgba(255, 255, 255, 0.78) !important;
box-shadow: 0 4px 14px rgba(16, 115, 204, 0.06) !important;
backdrop-filter: blur(8px) !important;
-webkit-backdrop-filter: blur(8px) !important;
transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease !important;
}
html body #root div.ecommerce-standalone.web-shell[data-view="ecommerce"] .ecommerce-standalone__account button:hover {
background: rgba(255, 255, 255, 0.96) !important;
border-color: rgba(30, 189, 219, 0.34) !important;
box-shadow: 0 6px 20px rgba(16, 115, 204, 0.1) !important;
}