Merge pull request #14671 from Snuffleupagus/float-inline

Replace `dir`-dependent `float` with logical properties
This commit is contained in:
Tim van der Meij 2022-03-19 14:12:34 +01:00 committed by GitHub
commit 6381738a65
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 22 additions and 88 deletions

View File

@ -17,7 +17,6 @@
"use strict";
const autoprefixer = require("autoprefixer");
const postcssCalc = require("postcss-calc");
const postcssDirPseudoClass = require("postcss-dir-pseudo-class");
const postcssLogical = require("postcss-logical");
const fs = require("fs");
@ -853,7 +852,6 @@ function buildGeneric(defines, dir) {
preprocessCSS("web/viewer.css", defines)
.pipe(
postcss([
postcssCalc(),
postcssLogical({ preserve: true }),
postcssDirPseudoClass(),
autoprefixer(AUTOPREFIXER_CONFIG),
@ -936,7 +934,6 @@ function buildComponents(defines, dir) {
preprocessCSS("web/pdf_viewer.css", defines)
.pipe(
postcss([
postcssCalc(),
postcssLogical({ preserve: true }),
postcssDirPseudoClass(),
autoprefixer(AUTOPREFIXER_CONFIG),
@ -1033,7 +1030,6 @@ function buildMinified(defines, dir) {
preprocessCSS("web/viewer.css", defines)
.pipe(
postcss([
postcssCalc(),
postcssLogical({ preserve: true }),
postcssDirPseudoClass(),
autoprefixer(AUTOPREFIXER_CONFIG),

24
package-lock.json generated
View File

@ -47,7 +47,6 @@
"mkdirp": "^1.0.4",
"needle": "^3.0.0",
"postcss": "^8.4.7",
"postcss-calc": "^8.2.4",
"postcss-dir-pseudo-class": "^6.0.4",
"postcss-logical": "^5.0.4",
"prettier": "^2.5.1",
@ -14969,19 +14968,6 @@
"url": "https://opencollective.com/postcss/"
}
},
"node_modules/postcss-calc": {
"version": "8.2.4",
"resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-8.2.4.tgz",
"integrity": "sha512-SmWMSJmB8MRnnULldx0lQIyhSNvuDl9HfrZkaqqE/WHAhToYsAvDq+yAsA/kIyINDszOp3Rh0GFoNuH5Ypsm3Q==",
"dev": true,
"dependencies": {
"postcss-selector-parser": "^6.0.9",
"postcss-value-parser": "^4.2.0"
},
"peerDependencies": {
"postcss": "^8.2.2"
}
},
"node_modules/postcss-dir-pseudo-class": {
"version": "6.0.4",
"resolved": "https://registry.npmjs.org/postcss-dir-pseudo-class/-/postcss-dir-pseudo-class-6.0.4.tgz",
@ -30241,16 +30227,6 @@
"source-map-js": "^1.0.2"
}
},
"postcss-calc": {
"version": "8.2.4",
"resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-8.2.4.tgz",
"integrity": "sha512-SmWMSJmB8MRnnULldx0lQIyhSNvuDl9HfrZkaqqE/WHAhToYsAvDq+yAsA/kIyINDszOp3Rh0GFoNuH5Ypsm3Q==",
"dev": true,
"requires": {
"postcss-selector-parser": "^6.0.9",
"postcss-value-parser": "^4.2.0"
}
},
"postcss-dir-pseudo-class": {
"version": "6.0.4",
"resolved": "https://registry.npmjs.org/postcss-dir-pseudo-class/-/postcss-dir-pseudo-class-6.0.4.tgz",

View File

@ -40,7 +40,6 @@
"mkdirp": "^1.0.4",
"needle": "^3.0.0",
"postcss": "^8.4.7",
"postcss-calc": "^8.2.4",
"postcss-dir-pseudo-class": "^6.0.4",
"postcss-logical": "^5.0.4",
"prettier": "^2.5.1",

View File

@ -244,12 +244,12 @@ select {
}
html[dir="ltr"] #sidebarContainer {
transition-property: left;
left: calc(0px - var(--sidebar-width));
left: calc(-1 * var(--sidebar-width));
border-right: var(--doorhanger-border-color-whcm);
}
html[dir="rtl"] #sidebarContainer {
transition-property: right;
right: calc(0px - var(--sidebar-width));
right: calc(-1 * var(--sidebar-width));
border-left: var(--doorhanger-border-color-whcm);
}
@ -668,46 +668,31 @@ html[dir="rtl"] .secondaryToolbar {
transform: translateX(-50%);
}
html[dir="ltr"] #toolbarViewerLeft,
html[dir="rtl"] #toolbarViewerRight,
html[dir="ltr"] #toolbarSidebarLeft,
html[dir="rtl"] #toolbarSidebarRight {
float: left;
#toolbarViewerLeft,
#toolbarSidebarLeft {
float: inline-start;
}
html[dir="ltr"] #toolbarViewerRight,
html[dir="rtl"] #toolbarViewerLeft,
html[dir="ltr"] #toolbarSidebarRight,
html[dir="rtl"] #toolbarSidebarLeft {
float: right;
#toolbarViewerRight,
#toolbarSidebarRight {
float: inline-end;
}
html[dir="ltr"] #toolbarViewerLeft > *,
html[dir="ltr"] #toolbarViewerMiddle > *,
html[dir="ltr"] #toolbarViewerRight > *,
html[dir="ltr"] #toolbarSidebarLeft *,
html[dir="ltr"] #toolbarSidebarRight *,
html[dir="ltr"] .findbar * {
#toolbarViewerLeft > *,
#toolbarViewerMiddle > *,
#toolbarViewerRight > *,
#toolbarSidebarLeft *,
#toolbarSidebarRight *,
.findbar * {
position: relative;
float: left;
}
html[dir="rtl"] #toolbarViewerLeft > *,
html[dir="rtl"] #toolbarViewerMiddle > *,
html[dir="rtl"] #toolbarViewerRight > *,
html[dir="rtl"] #toolbarSidebarLeft *,
html[dir="rtl"] #toolbarSidebarRight *,
html[dir="rtl"] .findbar * {
position: relative;
float: right;
float: inline-start;
}
.splitToolbarButton {
margin: 2px 2px 0;
display: inline-block;
}
html[dir="ltr"] .splitToolbarButton > .toolbarButton {
float: left;
}
html[dir="rtl"] .splitToolbarButton > .toolbarButton {
float: right;
.splitToolbarButton > .toolbarButton {
float: inline-start;
}
.toolbarButton,
@ -764,6 +749,7 @@ html[dir="rtl"] .splitToolbarButton > .toolbarButton:first-child {
margin: 0;
}
.splitToolbarButtonSeparator {
float: inline-start;
padding: 10px 0;
width: 1px;
background-color: var(--separator-color);
@ -778,13 +764,6 @@ html[dir="rtl"] .splitToolbarButton > .toolbarButton:first-child {
padding: 13px 0;
}
html[dir="ltr"] .splitToolbarButtonSeparator {
float: left;
}
html[dir="rtl"] .splitToolbarButtonSeparator {
float: right;
}
.toolbarButton,
.dropdownToolbarButton,
.secondaryToolbarButton,
@ -1230,14 +1209,9 @@ html[dir="rtl"] .toolbarButton.pdfSidebarNotification::after {
}
.thumbnail {
float: inline-start;
margin: 0 10px 5px;
}
html[dir="ltr"] .thumbnail {
float: left;
}
html[dir="rtl"] .thumbnail {
float: right;
}
#thumbnailView > a:last-of-type > .thumbnail {
margin-bottom: 10px;
@ -1332,11 +1306,13 @@ a:focus > .thumbnail > .thumbnailSelectionRing,
.treeItemToggler {
position: relative;
float: inline-start;
height: 0;
width: 0;
color: rgba(255, 255, 255, 0.5);
}
.treeItemToggler::before {
inset-inline-end: 4px;
mask-image: var(--treeitem-expanded-icon);
}
.treeItemToggler.treeItemsHidden::before {
@ -1348,18 +1324,6 @@ html[dir="rtl"] .treeItemToggler.treeItemsHidden::before {
.treeItemToggler.treeItemsHidden ~ .treeItems {
display: none;
}
html[dir="ltr"] .treeItemToggler {
float: left;
}
html[dir="rtl"] .treeItemToggler {
float: right;
}
html[dir="ltr"] .treeItemToggler::before {
right: 4px;
}
html[dir="rtl"] .treeItemToggler::before {
left: 4px;
}
.treeItem.selected > a {
background-color: var(--treeitem-selected-bg-color);
@ -1396,7 +1360,6 @@ html[dir="rtl"] .treeItemToggler::before {
#errorMessageLeft {
float: left;
}
#errorMessageRight {
float: right;
}