@7365admin1/layer-common 4.84.1-staging.481 → 4.84.1-staging.482

package/assets/css/primitives.css

@@ -1187,9 +1187,23 @@ select option {
     border-bottom: 1px solid var(--border);
   }
 
-  .v-data-table__tr--mobile > td {
+  /* One line per field: the desktop row height (52px) and the table-card
+     cell padding (`.table-card tbody td`, !important) made every field of a
+     card a tall block with big gaps (owner 2026-10-02). */
+  .v-data-table .v-table__wrapper > table tbody > tr.v-data-table__tr--mobile > td {
     grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
     column-gap: 12px;
+    min-height: 0;
+    height: auto;
+    padding: 4px 16px !important;
+  }
+
+  .v-data-table .v-table__wrapper > table tbody > tr.v-data-table__tr--mobile > td:first-child {
+    padding-top: 12px !important;
+  }
+
+  .v-data-table .v-table__wrapper > table tbody > tr.v-data-table__tr--mobile > td:last-child {
+    padding-bottom: 12px !important;
   }
 
   .v-data-table__td-title {
@@ -1201,6 +1215,15 @@ select option {
     min-width: 0;
     overflow-wrap: anywhere;
   }
+
+  /* Long values (emails, sync messages) wrap inside the card instead of
+     running off it; chips and buttons keep their one-line shape. */
+  .v-data-table__td-value :is(span, div, p, a):not(.v-chip):not(.v-chip *):not(.v-btn):not(.v-btn *) {
+    white-space: normal !important;
+    overflow: visible;
+    text-overflow: clip;
+    max-width: 100%;
+  }
 }
 
 /* ------------------------------------------------------------------ */

package/components/DashboardEmptyState.vue

@@ -60,4 +60,12 @@ defineProps({
   color: var(--text2);
   max-width: 34ch;
 }
+
+/* Phones (owner 2026-10-02, "big gap"): a fixed-height panel or empty state
+   left a tall blank block under one line of content; fit the content instead. */
+@media (max-width: 599.98px) {
+  .dashboard-empty {
+    min-height: 72px !important;
+  }
+}
 </style>

package/components/DashboardMain.vue

@@ -5149,4 +5149,18 @@ function formatDashboardTime(value?: string) {
   padding: 0;
   white-space: nowrap;
 }
+
+/* Phones (owner 2026-10-02, "big gap"): a fixed-height panel or empty state
+   left a tall blank block under one line of content; fit the content instead. */
+@media (max-width: 599.98px) {
+  .dashboard-panel {
+    height: auto;
+    min-height: 0;
+  }
+
+  .figma-panel {
+    min-height: 0;
+    padding: 18px 18px 16px;
+  }
+}
 </style>

package/components/DashboardPanel.vue

@@ -104,4 +104,14 @@ defineEmits(["action"]);
   margin-top: 20px;
   min-width: 0;
 }
+
+/* Phones (owner 2026-10-02, "big gap"): a fixed-height panel or empty state
+   left a tall blank block under one line of content; fit the content instead. */
+@media (max-width: 599.98px) {
+  .dashboard-panel {
+    height: auto;
+    min-height: 0;
+    padding: 18px 18px 16px;
+  }
+}
 </style>

package/package.json

@@ -2,7 +2,7 @@
   "name": "@7365admin1/layer-common",
   "license": "MIT",
   "type": "module",
-  "version": "4.84.1-staging.481",
+  "version": "4.84.1-staging.482",
   "author": "7365admin1",
   "main": "./nuxt.config.ts",
   "//files": "What a consumer extending this layer actually loads. Without this npm ships the whole working tree - the changesets, the CI workflows, the render harness in tools/ and any scratch directory that happened to exist at publish time. Nuxt resolves a layer by directory, so every runtime directory below has to stay listed; adding a new top-level runtime directory means adding it here too.",