From f23d197a35f9042b5d922e341b1f69e633a9383a Mon Sep 17 00:00:00 2001 From: ajnart Date: Tue, 8 Sep 2026 17:23:10 +0200 Subject: [PATCH] fix: remove extra fixed canvas top margin --- apps/docs/docs/management/boards/index.mdx | 3 ++- .../src/components/board/board-layout-thumbnail-canvas.tsx | 3 +-- .../components/board/items/widget-hover-overlay.module.css | 5 +++++ .../components/board/layout/scaled-board-canvas.module.css | 5 ----- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/apps/docs/docs/management/boards/index.mdx b/apps/docs/docs/management/boards/index.mdx index f2e128109..d81c47290 100644 --- a/apps/docs/docs/management/boards/index.mdx +++ b/apps/docs/docs/management/boards/index.mdx @@ -29,7 +29,8 @@ the current viewport. By default, Homarr fits the complete fixed-proportion tile grid to the available width. Enable **Fixed scaling** in the board's Layout settings to render each top-level `1 × 1` tile at the configured CSS-pixel size instead. A fixed dashboard is -centred when it fits and scrolls both horizontally and vertically when it does not. +centred when it fits and scrolls both horizontally and vertically when it does not, without adding extra space above +the board. The column count is the maximum total for that layout, including any fixed sidebars. For example, a Base layout with five columns and no sidebars remains a centred five-column dashboard on an ultrawide screen. **Reset from Base** diff --git a/apps/nextjs/src/components/board/board-layout-thumbnail-canvas.tsx b/apps/nextjs/src/components/board/board-layout-thumbnail-canvas.tsx index cb04b2460..f11f5fe5f 100644 --- a/apps/nextjs/src/components/board/board-layout-thumbnail-canvas.tsx +++ b/apps/nextjs/src/components/board/board-layout-thumbnail-canvas.tsx @@ -57,8 +57,7 @@ export const BoardLayoutThumbnailCanvas = ({ preview, label, canvas, className } const pitch = LOGICAL_GRID_PITCH * metrics.scale; const canvasOffset = Math.max(0, (screenWidth - 32 - metrics.width) / 2); const contentWidth = Math.max(screenWidth, metrics.width + 32); - let canvasTop = 16; - if (settings.fixedScaling) canvasTop += 32 * metrics.scale; + const canvasTop = 16; const contentHeight = rowCount * pitch + canvasTop + 16; const itemsById = new Map(preview.items.map((item) => [item.id, item])); const stationaryBackground = settings.fixedScaling || settings.backgroundImageAttachment === "fixed"; diff --git a/apps/nextjs/src/components/board/items/widget-hover-overlay.module.css b/apps/nextjs/src/components/board/items/widget-hover-overlay.module.css index 5d8e95f59..18be0c9ce 100644 --- a/apps/nextjs/src/components/board/items/widget-hover-overlay.module.css +++ b/apps/nextjs/src/components/board/items/widget-hover-overlay.module.css @@ -18,6 +18,11 @@ transform: translateY(calc(-100% - 8px)); } +/* Keep first-row labels inside the scrollport without adding space above the board. */ +:global([data-canvas-scaling="fixed"] [data-grid-y="0"] > .board-grid-content-mount) > .wrapper { + transform: translateY(8px); +} + .panel { @mixin dark { --background-color: rgb(from var(--mantine-color-dark-7) r g b / 0.96); diff --git a/apps/nextjs/src/components/board/layout/scaled-board-canvas.module.css b/apps/nextjs/src/components/board/layout/scaled-board-canvas.module.css index 1cee907c9..a29ef5251 100644 --- a/apps/nextjs/src/components/board/layout/scaled-board-canvas.module.css +++ b/apps/nextjs/src/components/board/layout/scaled-board-canvas.module.css @@ -31,11 +31,6 @@ margin-inline: auto; } -.viewport[data-canvas-scaling="fixed"] .sizer { - /* Leave room for edit labels and controls that intentionally sit above first-row tiles. */ - margin-block-start: calc(2rem * var(--board-canvas-scale, 1)); -} - .viewport[data-canvas-scaling="fixed"] .canvas { /* Fixed size describes every painted tile, including container sections. */ --board-grid-item-inset: calc(var(--board-grid-card-inset, 10px) * var(--board-canvas-inverse-scale, 1));