feat: 收口组件样式并调整移动端侧栏

2026-09-04 17:19:34 +08:00
parent d252d5513f
commit e6e0f08072
68 changed files with 2717 additions and 2775 deletions
@@ -619,3 +619,99 @@ watch(
        />
    </WorkspacePage>
 </template>
+
+<style>
+/* 本组件专属布局与 Naive 内部结构覆盖。 */
+@reference "../../styles/styles.css";
+.production-controls {
+    @apply grid grid-cols-[minmax(220px,_1.6fr)_minmax(110px,_0.5fr)_minmax(230px,_1fr)_auto] items-end gap-[18px];
+}
+.production-pipeline {
+    @apply grid grid-cols-[repeat(3,_minmax(0,_1fr))] gap-3.5;
+}
+.production-pipeline-card {
+    @apply p-5;
+}
+.production-stats {
+    @apply grid grid-cols-[repeat(3,_1fr)] gap-2;
+}
+.production-stats div,
+.production-status-grid div {
+    @apply p-2.5 rounded-none bg-(--app-subtle);
+}
+.production-stats dt,
+.production-status-grid dt {
+    @apply text-muted text-[10px];
+}
+.production-stats dd,
+.production-status-grid dd {
+    @apply mt-[5px] text-[13px] font-mono;
+}
+.production-status-grid {
+    @apply grid grid-cols-[repeat(5,_minmax(0,_1fr))] gap-2.5;
+}
+.production-workspace {
+    @apply grid grid-cols-[220px_minmax(0,_1fr)] items-start overflow-hidden;
+}
+.production-shot-list {
+    @apply max-h-[760px] overflow-hidden bg-(--app-surface) py-2;
+}
+@media (max-width: 1100px) {
+    .production-pipeline {
+        @apply grid-cols-[1fr];
+    }
+    .production-controls {
+        @apply grid-cols-[repeat(2,_minmax(0,_1fr))];
+    }
+}
+@media (max-width: 760px) {
+    .production-controls,
+    .production-workspace {
+        @apply grid-cols-[minmax(0,_1fr)];
+    }
+    .production-shot-list {
+        @apply flex max-h-none overflow-hidden;
+        border-right: none;
+    }
+    .production-status-grid {
+        @apply grid-cols-[repeat(2,_minmax(0,_1fr))];
+    }
+}
+.workspace-inline-status {
+    @apply flex items-center flex-wrap justify-between gap-y-2 gap-x-4 py-[7px] px-3 shrink-0 rounded-none bg-(--app-subtle) text-xs;
+}
+.production-pipeline-card > .confirm-action {
+    @apply mt-4 mb-1;
+}
+.production-workspace {
+    @apply flex-1 min-h-0 items-stretch overflow-hidden;
+}
+.production-workspace {
+    @apply grid-cols-[clamp(240px,_22%,_280px)_minmax(0,_1fr)];
+}
+.production-shot-list {
+    @apply max-h-none overflow-hidden min-h-0;
+}
+.production-workspace > article {
+    @apply overflow-hidden min-h-0 overscroll-contain;
+}
+.production-shot-list-content {
+    @apply gap-3 pt-0 px-0 pb-3;
+}
+.production-shot-list {
+    @apply p-0;
+}
+@media (max-width: 1000px) {
+    .production-controls {
+        @apply grid-cols-[minmax(130px,_1fr)_90px];
+    }
+}
+@media (max-width: 760px) {
+    .production-workspace {
+        @apply grid-cols-[minmax(0,_1fr)] grid-rows-[184px_minmax(0,_1fr)];
+    }
+    .production-pipeline {
+        @apply grid-cols-[1fr];
+    }
+}
+</style>