Beanz/pdf.js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[Editor] Slightly move the resizer in the sidebar comment in order to make it easier to use (bug 1992385)

Browse Source 
And highlight the resizer when hovering it.
This commit is contained in:
Calixte Denizet 2025-10-03 17:07:39 +02:00
parent e1de28c866
commit 3ecefa5e0c
1 changed files with 14 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
web/sidebar.css
View File

@ -27,11 +27,14 @@
--sidebar-min-width: 180px; --sidebar-min-width: 180px;
--sidebar-max-width: 632px; --sidebar-max-width: 632px;
--sidebar-width: 239px; --sidebar-width: 239px;
--resizer-width: 4px;
--resizer-hover-bg-color: light-dark(#0062fa, #00cadb);
@media screen and (forced-colors: active) { @media screen and (forced-colors: active) {
--sidebar-bg-color: Canvas; --sidebar-bg-color: Canvas;
--sidebar-border-color: CanvasText; --sidebar-border-color: CanvasText;
--sidebar-box-shadow: none; --sidebar-box-shadow: none;
--resizer-hover-bg-color: CanvasText;
} }
border-radius: var(--sidebar-border-radius); border-radius: var(--sidebar-border-radius);
@ -45,12 +48,22 @@
max-width: var(--sidebar-max-width); max-width: var(--sidebar-max-width);
.sidebarResizer { .sidebarResizer {
width: 4px; width: var(--resizer-width);
background-color: transparent; background-color: transparent;
forced-color-adjust: none; forced-color-adjust: none;
cursor: ew-resize; cursor: ew-resize;
position: absolute; position: absolute;
inset-block: calc(var(--sidebar-padding) + var(--sidebar-border-radius)); inset-block: calc(var(--sidebar-padding) + var(--sidebar-border-radius));
inset-inline-start: calc(0px - var(--resizer-width) / 2);
transition: background-color 0.5s ease-in-out;
box-sizing: border-box;
border: 1px solid transparent;
border-block-width: 0;
background-clip: content-box;
&:hover {
background-color: var(--resizer-hover-bg-color);
}
} }
&.resizing { &.resizing {