diff --git a/src/viewer/navigation/minimap.css b/src/viewer/navigation/minimap.css index 833cc21..7c468ac 100644 --- a/src/viewer/navigation/minimap.css +++ b/src/viewer/navigation/minimap.css @@ -320,8 +320,8 @@ html.minimap-disabled body::-webkit-scrollbar-thumb { .minimap-collapsed .minimap-shell { top: auto; - /* Fixed-position insets exclude the native scrollbar gutter. */ - right: calc(100% - 100vw); + /* Stay on the layout side of the native scrollbar, not underneath it. */ + right: 0; width: 36px; height: 36px; min-height: 36px; @@ -333,6 +333,14 @@ html.minimap-disabled body::-webkit-scrollbar-thumb { .minimap-collapsed .minimap-controls { flex: 1 1 auto; + box-sizing: border-box; + /* Unlike the expanded strip, the standalone button needs every edge. */ + border: 1px solid var(--border); +} + +.minimap-collapsed.minimap-left .minimap-shell { + right: auto; + left: 0; } .minimap-collapsed .minimap-control:not(.minimap-collapse) { @@ -344,10 +352,10 @@ html.minimap-disabled body::-webkit-scrollbar-thumb { flex: 1 1 auto; } -/* The bottom-right corner of a split pane may be occupied by host chrome. - Raise both expanded and collapsed minimap controls out of that hit area. */ +/* Only the footnote scrubber needs clearance for the split-pane host chrome. + In documents without footnotes, anchor the controls at the viewport bottom. */ @media (max-width: 1200px) { - :root { + :root:has(#document-scrubber:not([hidden])) { --split-view-bottom-clearance: 48px; } } diff --git a/tests/minimap.test.mjs b/tests/minimap.test.mjs index 714e03d..63126d4 100644 --- a/tests/minimap.test.mjs +++ b/tests/minimap.test.mjs @@ -458,7 +458,7 @@ test('native scrollbar gutter respects toolbar rows, the scrubber, and split-vie styles, /:root\s*\{\s*--native-scrollbar-top:\s*52px;\s*--split-view-bottom-clearance:\s*0px;\s*--native-scrollbar-bottom:\s*calc\(var\(--document-scrubber-height, 0px\) \+ var\(--split-view-bottom-clearance\)\);/, ); - assert.match(styles, /@media\s*\(max-width:\s*1200px\)\s*\{\s*:root\s*\{\s*--split-view-bottom-clearance:\s*48px;/); + assert.match(styles, /@media\s*\(max-width:\s*1200px\)\s*\{\s*:root:has\(#document-scrubber:not\(\[hidden\]\)\)\s*\{\s*--split-view-bottom-clearance:\s*48px;/); assert.match(styles, /:root\.toolbar-two-rows\s*\{\s*--native-scrollbar-top:\s*100px;/); assert.match( styles, @@ -472,6 +472,13 @@ test('native scrollbar gutter respects toolbar rows, the scrubber, and split-vie }); +test('collapsed minimap toggle stays outside the native scrollbar and keeps its border', () => { + assert.match(styles, /\.minimap-collapsed \.minimap-shell\s*\{[^}]*?right:\s*0;/); + assert.doesNotMatch(styles, /right:\s*calc\(100% - 100vw\)/); + assert.match(styles, /\.minimap-collapsed \.minimap-controls\s*\{[^}]*?border:\s*1px solid var\(--border\);/); + assert.match(styles, /\.minimap-collapsed\.minimap-left \.minimap-shell\s*\{[^}]*?right:\s*auto;[^}]*?left:\s*0;/); +}); + test('minimap has a dedicated collapse button without a duplicate settings toggle', () => { const f = fixture(3); assert.doesNotMatch(viewerMarkup, /id="show-minimap"/);