mirror of
https://github.com/zen-browser/pdf.js.git
synced 2025-07-08 17:30:09 +02:00
Merge pull request #18518 from timvandermeij/viewer-toolbar-height
Introduce a CSS variable for the toolbar height (bug 1171799)
This commit is contained in:
commit
0269cf5b4d
1 changed files with 9 additions and 8 deletions
|
@ -46,6 +46,7 @@
|
||||||
--toolbar-border-color: rgb(184 184 184);
|
--toolbar-border-color: rgb(184 184 184);
|
||||||
--toolbar-box-shadow: 0 1px 0 var(--toolbar-border-color);
|
--toolbar-box-shadow: 0 1px 0 var(--toolbar-border-color);
|
||||||
--toolbar-border-bottom: none;
|
--toolbar-border-bottom: none;
|
||||||
|
--toolbar-height: 32px;
|
||||||
--toolbarSidebar-box-shadow: inset calc(-1px * var(--dir-factor)) 0 0
|
--toolbarSidebar-box-shadow: inset calc(-1px * var(--dir-factor)) 0 0
|
||||||
rgb(0 0 0 / 0.25),
|
rgb(0 0 0 / 0.25),
|
||||||
0 1px 0 rgb(0 0 0 / 0.15), 0 0 1px rgb(0 0 0 / 0.1);
|
0 1px 0 rgb(0 0 0 / 0.15), 0 0 1px rgb(0 0 0 / 0.1);
|
||||||
|
@ -270,7 +271,7 @@ body {
|
||||||
|
|
||||||
#sidebarContainer {
|
#sidebarContainer {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
inset-block: 32px 0;
|
inset-block: var(--toolbar-height) 0;
|
||||||
inset-inline-start: calc(-1 * var(--sidebar-width));
|
inset-inline-start: calc(-1 * var(--sidebar-width));
|
||||||
width: var(--sidebar-width);
|
width: var(--sidebar-width);
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
|
@ -297,7 +298,7 @@ body {
|
||||||
}
|
}
|
||||||
|
|
||||||
#sidebarContent {
|
#sidebarContent {
|
||||||
inset-block: 32px 0;
|
inset-block: var(--toolbar-height) 0;
|
||||||
inset-inline-start: 0;
|
inset-inline-start: 0;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -308,7 +309,7 @@ body {
|
||||||
#viewerContainer {
|
#viewerContainer {
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
inset: 32px 0 0;
|
inset: var(--toolbar-height) 0 0;
|
||||||
outline: none;
|
outline: none;
|
||||||
}
|
}
|
||||||
#viewerContainer:not(.pdfPresentationMode) {
|
#viewerContainer:not(.pdfPresentationMode) {
|
||||||
|
@ -342,7 +343,7 @@ body {
|
||||||
|
|
||||||
#toolbarSidebar {
|
#toolbarSidebar {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 32px;
|
height: var(--toolbar-height);
|
||||||
background-color: var(--sidebar-toolbar-bg-color);
|
background-color: var(--sidebar-toolbar-bg-color);
|
||||||
box-shadow: var(--toolbarSidebar-box-shadow);
|
box-shadow: var(--toolbarSidebar-box-shadow);
|
||||||
border-bottom: var(--toolbarSidebar-border-bottom);
|
border-bottom: var(--toolbarSidebar-border-bottom);
|
||||||
|
@ -362,14 +363,14 @@ body {
|
||||||
.secondaryToolbar,
|
.secondaryToolbar,
|
||||||
.editorParamsToolbar {
|
.editorParamsToolbar {
|
||||||
position: relative;
|
position: relative;
|
||||||
height: 32px;
|
height: var(--toolbar-height);
|
||||||
background-color: var(--toolbar-bg-color);
|
background-color: var(--toolbar-bg-color);
|
||||||
box-shadow: var(--toolbar-box-shadow);
|
box-shadow: var(--toolbar-box-shadow);
|
||||||
border-bottom: var(--toolbar-border-bottom);
|
border-bottom: var(--toolbar-border-bottom);
|
||||||
}
|
}
|
||||||
|
|
||||||
#toolbarViewer {
|
#toolbarViewer {
|
||||||
height: 32px;
|
height: var(--toolbar-height);
|
||||||
}
|
}
|
||||||
|
|
||||||
#loadingBar {
|
#loadingBar {
|
||||||
|
@ -447,7 +448,7 @@ body {
|
||||||
.findbar,
|
.findbar,
|
||||||
.secondaryToolbar,
|
.secondaryToolbar,
|
||||||
.editorParamsToolbar {
|
.editorParamsToolbar {
|
||||||
top: 32px;
|
top: var(--toolbar-height);
|
||||||
position: absolute;
|
position: absolute;
|
||||||
z-index: 30000;
|
z-index: 30000;
|
||||||
height: auto;
|
height: auto;
|
||||||
|
@ -466,7 +467,7 @@ body {
|
||||||
background-color: var(--toolbar-bg-color);
|
background-color: var(--toolbar-bg-color);
|
||||||
}
|
}
|
||||||
.findbar > div {
|
.findbar > div {
|
||||||
height: 32px;
|
height: var(--toolbar-height);
|
||||||
}
|
}
|
||||||
.findbar > div#findbarInputContainer {
|
.findbar > div#findbarInputContainer {
|
||||||
margin-inline-end: 4px;
|
margin-inline-end: 4px;
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue