feat: localize ecommerce quick tool pages

2026-06-18 16:19:59 +08:00
parent 207f05ac86
commit d7e6f03157
4 changed files with 313 additions and 43 deletions
@@ -20993,3 +20993,135 @@ html body #root .ecommerce-standalone.ecommerce-standalone .product-clone-page[d
    top: -10px !important;
  }
 }
+
+/* Responsive coverage for the recently localized quick/visual tool pages. */
+.ecom-hot-material-zoom-portal.is-right {
+  transform: translateY(-50%) !important;
+}
+
+.ecom-hot-material-zoom-portal.is-left {
+  transform: translate(-100%, -50%) !important;
+}
+
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-hot-material-zoom-portal.is-above,
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-hot-material-zoom-portal.is-below {
+  transform: translateY(-50%) !important;
+}
+
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-quick-hot-material.has-images .ecom-command-asset-thumb.ecom-quick-upload-thumb > button.ecom-hot-material-delete {
+  position: absolute !important;
+  top: -8px !important;
+  right: -8px !important;
+  z-index: 20 !important;
+  display: inline-flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  width: 24px !important;
+  height: 24px !important;
+  min-width: 24px !important;
+  min-height: 24px !important;
+  padding: 0 !important;
+  border: 1px solid rgba(239, 68, 68, 0.62) !important;
+  border-radius: 999px !important;
+  color: #ef4444 !important;
+  background: #ffffff !important;
+  box-shadow: 0 8px 18px rgba(239, 68, 68, 0.16) !important;
+  font-size: 16px !important;
+  font-weight: 700 !important;
+  line-height: 1 !important;
+}
+
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-quick-hot-material.has-images .ecom-command-asset-thumb.ecom-quick-upload-thumb > button.ecom-hot-material-delete:hover {
+  border-color: #dc2626 !important;
+  color: #dc2626 !important;
+  background: #fff1f2 !important;
+  box-shadow: 0 10px 22px rgba(220, 38, 38, 0.24) !important;
+  transform: scale(1.04) !important;
+}
+
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-quick-hot-material.has-images .ecom-command-asset-thumb.ecom-quick-upload-thumb > button.ecom-hot-material-delete svg {
+  display: none !important;
+}
+
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-quick-hot-add-btn,
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-quick-hot-add-btn:hover {
+  color: #1073cc !important;
+  background: #ffffff !important;
+}
+
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-visual-workspace-head.ecom-copywriting-preview-head {
+  display: grid !important;
+  gap: 6px !important;
+  margin-bottom: 16px !important;
+  padding: 0 !important;
+}
+
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-visual-workspace-head.ecom-copywriting-preview-head h1 {
+  margin: 0 !important;
+  color: #172636 !important;
+  font-size: 21px !important;
+  font-weight: 950 !important;
+  line-height: 1.25 !important;
+}
+
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-visual-workspace-head.ecom-copywriting-preview-head p {
+  margin: 0 !important;
+  color: #657686 !important;
+  font-size: 13px !important;
+  font-weight: 750 !important;
+  line-height: 1.5 !important;
+}
+
+.ecommerce-standalone .ecom-quick-page-wrap .ecom-visual-workspace-head.ecom-copywriting-preview-head p span {
+  color: #1073cc !important;
+  font-weight: 800 !important;
+}
+
+@media (max-width: 960px) {
+  .ecommerce-standalone .ecom-quick-page-wrap {
+    flex-direction: column !important;
+    overflow: hidden !important;
+  }
+
+  .ecommerce-standalone .ecom-quick-page-sidebar {
+    flex: 0 0 auto !important;
+    width: 100% !important;
+    min-height: 68px !important;
+    flex-direction: row !important;
+    justify-content: flex-start !important;
+    gap: 6px !important;
+    padding: 8px 10px !important;
+    border-right: 0 !important;
+    border-bottom: 1px solid rgba(30, 189, 219, 0.1) !important;
+    overflow-x: auto !important;
+  }
+
+  .ecommerce-standalone .ecom-quick-page-sidebar button {
+    flex: 0 0 76px !important;
+    width: 76px !important;
+    min-height: 52px !important;
+    padding: 7px 6px !important;
+  }
+
+  .ecommerce-standalone .ecom-quick-page-wrap .ecom-quick-set-body,
+  .ecommerce-standalone .ecom-quick-page-wrap .ecom-copywriting-body,
+  .ecommerce-standalone .ecom-quick-page-wrap .ecom-image-workbench-page,
+  .ecommerce-standalone .ecom-quick-page-wrap .ecom-watermark-page {
+    grid-template-columns: 1fr !important;
+    grid-template-rows: auto minmax(0, 1fr) !important;
+  }
+
+  .ecommerce-standalone .ecom-quick-page-wrap .ecom-quick-set-panel,
+  .ecommerce-standalone .ecom-quick-page-wrap .ecom-copywriting-panel,
+  .ecommerce-standalone .ecom-quick-page-wrap .ecom-image-workbench-side,
+  .ecommerce-standalone .ecom-quick-page-wrap .ecom-watermark-side {
+    max-height: 46vh !important;
+    overflow-y: auto !important;
+  }
+}
+
+@media (max-width: 640px), (hover: none) {
+  .ecom-hot-material-zoom-portal {
+    display: none !important;
+  }
+}