v0.36.9

src/admin/web/css/30-overview.css

@@ -1442,6 +1442,32 @@ html[data-chart-style] :is(#workspace, dialog) svg polyline {
   font-size: 10px;
 }
 
+/* "Fit to screen" switch in the unlocked layout toolbar. */
+.overview-inline-autofit {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+  min-height: 28px;
+  padding: 0 8px;
+  border: 1px solid var(--line);
+  border-radius: var(--rp-radius-control, 0);
+  color: var(--text);
+  font-size: 12px;
+  white-space: nowrap;
+  cursor: pointer;
+}
+
+.overview-inline-autofit input {
+  margin: 0;
+}
+
+/* Width shown wider on this screen by Fit to screen. */
+#panel-overview .overview-inline-width-value.is-fitted {
+  color: var(--accent);
+  text-decoration: underline dotted;
+  text-underline-offset: 3px;
+}
+
 /* Height value: readable between its − / + buttons. Automatic height (fits the
    content) is slightly dimmed, a fixed height is shown in full colour. */
 #panel-overview .dashboard-overview-grid.is-unlocked.has-row-units .overview-inline-width-value.overview-inline-height-value {
@@ -2246,6 +2272,19 @@ html:is([data-corner-style=square], [data-corner-style=subtle], [data-corner-sty
   min-height: 0 !important;
 }
 
+/* Auto-fit: overview-rows.js packs the cards and places them explicitly. While a
+   block is being dragged the normal flow is used, so the drop placeholder works. */
+#panel-overview #dashboard-overview-grid.has-row-units.has-auto-placement:not(.is-overview-sorting)>[data-dashboard-widget]:not([hidden]) {
+  grid-column: var(--overview-col, auto)/span var(--overview-cols, 1);
+  grid-row: var(--overview-row, auto)/span var(--overview-rows, 1);
+}
+
+/* Until the account's layout is applied the grid stays invisible, so the page
+   never shows the factory arrangement first and then jumps (no browser storage). */
+#panel-overview .dashboard-overview-grid.is-layout-pending {
+  visibility: hidden;
+}
+
 #panel-overview .dashboard-overview-grid.is-measuring-rows>[data-dashboard-widget] {
   align-self: start !important;
 }