mirror of
https://github.com/mozilla/pdf.js.git
synced 2025-04-19 22:58:07 +02:00
Fix the rendering of the different separators we've in the UI
Currently, the css for a separator is something like { height: 1px; background-color: ... }. But its rendering depends on its position on the screen. So instead of setting the height to 1px, we just set something like { border-top: 1px solid ...; }, this way the final rendering is exactly the same for all the separators.
This commit is contained in:
parent
19151feb5f
commit
b29278efb8
4 changed files with 21 additions and 14 deletions
|
@ -309,11 +309,12 @@
|
|||
height: 100%;
|
||||
|
||||
.divider {
|
||||
width: 1px;
|
||||
width: 0;
|
||||
height: calc(
|
||||
2 * var(--editor-toolbar-padding) + var(--editor-toolbar-height)
|
||||
);
|
||||
background-color: var(--editor-toolbar-border-color);
|
||||
border-left: 1px solid var(--editor-toolbar-border-color);
|
||||
border-right: none;
|
||||
display: inline-block;
|
||||
margin-inline: 2px;
|
||||
}
|
||||
|
|
|
@ -140,9 +140,10 @@
|
|||
|
||||
.dialogSeparator {
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
height: 0;
|
||||
margin-block: 4px;
|
||||
background-color: var(--separator-color);
|
||||
border-top: 1px solid var(--separator-color);
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.dialogButtonsGroup {
|
||||
|
|
|
@ -272,9 +272,10 @@ dialog .toolbarField {
|
|||
dialog .separator {
|
||||
display: block;
|
||||
margin: 4px 0;
|
||||
height: 1px;
|
||||
height: 0;
|
||||
width: 100%;
|
||||
background-color: var(--separator-color);
|
||||
border-top: 1px solid var(--separator-color);
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
dialog .buttonRow {
|
||||
|
|
|
@ -662,9 +662,10 @@ body {
|
|||
.splitToolbarButtonSeparator {
|
||||
float: var(--inline-start);
|
||||
margin: 4px 0;
|
||||
width: 1px;
|
||||
width: 0;
|
||||
height: 20px;
|
||||
background-color: var(--separator-color);
|
||||
border-left: 1px solid var(--separator-color);
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.toolbarButton,
|
||||
|
@ -870,16 +871,18 @@ body {
|
|||
.verticalToolbarSeparator {
|
||||
display: block;
|
||||
margin: 5px 2px;
|
||||
width: 1px;
|
||||
width: 0;
|
||||
height: 22px;
|
||||
background-color: var(--separator-color);
|
||||
border-left: 1px solid var(--separator-color);
|
||||
border-right: none;
|
||||
}
|
||||
.horizontalToolbarSeparator {
|
||||
display: block;
|
||||
margin: 6px 0;
|
||||
height: 1px;
|
||||
border-top: 1px solid var(--doorhanger-separator-color);
|
||||
border-bottom: none;
|
||||
height: 0;
|
||||
width: 100%;
|
||||
background-color: var(--doorhanger-separator-color);
|
||||
}
|
||||
|
||||
.toolbarField {
|
||||
|
@ -1153,9 +1156,10 @@ dialog .toolbarField {
|
|||
dialog .separator {
|
||||
display: block;
|
||||
margin: 4px 0;
|
||||
height: 1px;
|
||||
height: 0;
|
||||
width: 100%;
|
||||
background-color: var(--separator-color);
|
||||
border-top: 1px solid var(--separator-color);
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
dialog .buttonRow {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue