diff --git a/web/viewer.css b/web/viewer.css index f2e313a13..832439af4 100644 --- a/web/viewer.css +++ b/web/viewer.css @@ -1360,9 +1360,13 @@ dialog :link { height: 1px; } - #toolbarViewerLeft #numPages.toolbarLabel { - padding-inline-start: 3px; - flex: none; + #toolbarViewerLeft { + margin-inline-start: 8px; + + #numPages.toolbarLabel { + padding-inline-start: 3px; + flex: none; + } } } diff --git a/web/views_manager.css b/web/views_manager.css index f3d08d75f..dc1210216 100644 --- a/web/views_manager.css +++ b/web/views_manager.css @@ -23,7 +23,7 @@ &.viewsManagerOpen { #viewsManager { visibility: visible; - inset-inline-start: 1px; + inset-inline-start: 8px; } #viewerContainer:not(.pdfPresentationMode) { @@ -53,7 +53,7 @@ --pages-selected-icon: url(images/pages_selected.svg); --spinner-icon: url(images/altText_spinner.svg); - --sidebar-bg-color: light-dark(rgb(255 255 255 / 0.92), rgb(35 34 43 / 0.92)); + --sidebar-bg-color: light-dark(rgb(255 255 255 / 0.92), rgb(66 65 77 / 0.92)); --sidebar-backdrop-filter: blur(7px); --sidebar-width: 230px; --sidebar-min-width: min-content; @@ -86,13 +86,14 @@ --header-shadow: 0 0.25px 0.75px -0.75px light-dark(rgb(0 0 0 / 0.05), rgb(0 0 0 / 0.2)), 0 2px 6px -6px light-dark(rgb(0 0 0 / 0.1), rgb(0 0 0 / 0.4)); + --header-bg: light-dark(rgb(255 255 255 / 0.92), #42414e); --image-outline: none; --image-border-width: 6px; --image-border-color: light-dark(#cfcfd8, #3a3944); --image-hover-border-color: #bfbfc9; --image-current-border-color: var(--button-focus-outline-color); --image-current-focused-outline-color: var(--image-hover-border-color); - --image-page-number-bg: light-dark(#f0f0f4, #23222b); + --image-page-number-bg: light-dark(#f0f0f4, #42414d); --image-page-number-fg: var(--text-color); --image-page-number-border-color: transparent; --image-hover-page-number-bg: var(--image-page-number-bg); @@ -243,6 +244,7 @@ width: 100%; box-shadow: var(--header-shadow); flex: 0 0 auto; + background-color: var(--header-bg); .viewsManagerLabel { flex: 1 0 0;