Enable some Stylelint color-related rules to slightly reduce file sizes
- Use a consistent format for all alpha-values (this rule didn't require any code changes); see https://stylelint.io/user-guide/rules/alpha-value-notation - Use modern and slightly shorter color notation, since [according to MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/color_value/rgb#browser_compatibility) that should be supported "everywhere" nowadays; see https://stylelint.io/user-guide/rules/color-function-notation/ - Use "short" hexadecimal colors whenever possible; see https://stylelint.io/user-guide/rules/color-hex-length/ - Help avoid adding broken hexadecimal colors (this rule didn't require any code changes); see https://stylelint.io/user-guide/rules/color-no-invalid-hex/
This commit is contained in:
Jonas Jenwald
parent
a60f90ae94
commit
4277205d78
@ -6,7 +6,11 @@
|
||||
"rules": {
|
||||
"prettier/prettier": true,
|
||||
|
||||
"alpha-value-notation": "number",
|
||||
"block-no-empty": true,
|
||||
"color-function-notation": "modern",
|
||||
"color-hex-length": "short",
|
||||
"color-no-invalid-hex": true,
|
||||
"declaration-block-no-duplicate-properties": true,
|
||||
"declaration-block-no-redundant-longhand-properties": true,
|
||||
"declaration-property-value-disallowed-list": {
|
||||
|
||||
@ -26,12 +26,12 @@ html {
|
||||
}
|
||||
|
||||
header {
|
||||
background-color: rgba(244, 244, 244, 1);
|
||||
background-color: rgb(244 244 244 / 1);
|
||||
}
|
||||
|
||||
header h1 {
|
||||
border-bottom: 1px solid rgba(216, 216, 216, 1);
|
||||
color: rgba(133, 133, 133, 1);
|
||||
border-bottom: 1px solid rgb(216 216 216 / 1);
|
||||
color: rgb(133 133 133 / 1);
|
||||
font-size: 23px;
|
||||
font-style: italic;
|
||||
font-weight: normal;
|
||||
@ -44,7 +44,7 @@ header h1 {
|
||||
|
||||
body {
|
||||
background: url(images/document_bg.png);
|
||||
color: rgba(255, 255, 255, 1);
|
||||
color: rgb(255 255 255 / 1);
|
||||
font-family: sans-serif;
|
||||
font-size: 10px;
|
||||
height: 100%;
|
||||
@ -71,7 +71,7 @@ footer {
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 1;
|
||||
box-shadow: 0 -0.2rem 0.5rem rgba(50, 50, 50, 0.75);
|
||||
box-shadow: 0 -0.2rem 0.5rem rgb(50 50 50 / 0.75);
|
||||
}
|
||||
|
||||
.toolbarButton {
|
||||
@ -81,7 +81,7 @@ footer {
|
||||
border-width: 0;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
background-color: rgb(0 0 0 / 0);
|
||||
}
|
||||
|
||||
.toolbarButton.pageUp {
|
||||
@ -110,9 +110,9 @@ footer {
|
||||
left: 36%;
|
||||
text-align: center;
|
||||
border: 0;
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
background-color: rgb(0 0 0 / 0);
|
||||
font-size: 1.2rem;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
color: rgb(255 255 255 / 1);
|
||||
background-image: url(images/div_line_left.png),
|
||||
url(images/div_line_right.png);
|
||||
background-repeat: no-repeat;
|
||||
@ -190,8 +190,8 @@ canvas {
|
||||
|
||||
position: relative;
|
||||
height: 0.6rem;
|
||||
background-color: rgba(51, 51, 51, 1);
|
||||
border-bottom: 1px solid rgba(51, 51, 51, 1);
|
||||
background-color: rgb(51 51 51 / 1);
|
||||
border-bottom: 1px solid rgb(51 51 51 / 1);
|
||||
}
|
||||
|
||||
#loadingBar .progress {
|
||||
@ -201,7 +201,7 @@ canvas {
|
||||
transform: scaleX(var(--progressBar-percent));
|
||||
transform-origin: 0 0;
|
||||
height: 100%;
|
||||
background-color: rgba(221, 221, 221, 1);
|
||||
background-color: rgb(221 221 221 / 1);
|
||||
overflow: hidden;
|
||||
transition: transform 200ms;
|
||||
}
|
||||
@ -220,7 +220,7 @@ canvas {
|
||||
|
||||
#loadingBar.indeterminate .progress {
|
||||
transform: none;
|
||||
background-color: rgba(153, 153, 153, 1);
|
||||
background-color: rgb(153 153 153 / 1);
|
||||
transition: none;
|
||||
}
|
||||
|
||||
@ -232,9 +232,9 @@ canvas {
|
||||
width: 5rem;
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
rgba(153, 153, 153, 1) 0%,
|
||||
rgba(255, 255, 255, 1) 50%,
|
||||
rgba(153, 153, 153, 1) 100%
|
||||
rgb(153 153 153 / 1) 0%,
|
||||
rgb(255 255 255 / 1) 50%,
|
||||
rgb(153 153 153 / 1) 100%
|
||||
);
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
@ -242,8 +242,8 @@ canvas {
|
||||
}
|
||||
|
||||
#errorWrapper {
|
||||
background: none repeat scroll 0 0 rgba(255, 85, 85, 1);
|
||||
color: rgba(255, 255, 255, 1);
|
||||
background: none repeat scroll 0 0 rgb(255 85 85 / 1);
|
||||
color: rgb(255 255 255 / 1);
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
@ -262,8 +262,8 @@ canvas {
|
||||
}
|
||||
|
||||
#errorMoreInfo {
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
background-color: rgb(255 255 255 / 1);
|
||||
color: rgb(0 0 0 / 1);
|
||||
padding: 0.3rem;
|
||||
margin: 0.3rem;
|
||||
width: 98%;
|
||||
|
||||
@ -37,8 +37,8 @@
|
||||
.fileAttachmentAnnotation:not(.hasFillAlpha)
|
||||
.popupTriggerArea {
|
||||
opacity: 0.2;
|
||||
background: rgba(255, 255, 0, 1);
|
||||
box-shadow: 0 2px 10px rgba(255, 255, 0, 1);
|
||||
background: rgb(255 255 0 / 1);
|
||||
box-shadow: 0 2px 10px rgb(255 255 0 / 1);
|
||||
}
|
||||
.annotationLayer .fileAttachmentAnnotation.hasFillAlpha {
|
||||
outline: 2px solid yellow;
|
||||
@ -49,7 +49,7 @@
|
||||
}
|
||||
|
||||
.annotationLayer .linkAnnotation.hasBorder {
|
||||
background-color: rgba(255, 255, 0, 0.2);
|
||||
background-color: rgb(255 255 0 / 0.2);
|
||||
}
|
||||
|
||||
.annotationLayer .popupTriggerArea::after {
|
||||
|
||||
@ -26,8 +26,8 @@
|
||||
position: absolute;
|
||||
white-space: pre;
|
||||
transform-origin: 0% 0%;
|
||||
border: solid 1px rgba(255, 0, 0, 0.5);
|
||||
background-color: rgba(255, 255, 32, 0.1);
|
||||
border: solid 1px rgb(255 0 0 / 0.5);
|
||||
background-color: rgb(255 255 32 / 0.1);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
||||
@ -15,6 +15,6 @@
|
||||
|
||||
.xfaLink {
|
||||
opacity: 0.2;
|
||||
background: rgba(255, 255, 0, 1);
|
||||
box-shadow: 0 2px 10px rgba(255, 255, 0, 1);
|
||||
background: rgb(255 255 0 / 1);
|
||||
box-shadow: 0 2px 10px rgb(255 255 0 / 1);
|
||||
}
|
||||
|
||||
@ -45,18 +45,18 @@
|
||||
--alt-text-opacity: 0.8;
|
||||
--alt-text-add-image: url(images/altText_add.svg);
|
||||
--alt-text-done-image: url(images/altText_done.svg);
|
||||
--alt-text-bg-color: rgba(43, 42, 51, var(--alt-text-opacity));
|
||||
--alt-text-bg-color: rgb(43 42 51 / var(--alt-text-opacity));
|
||||
--alt-text-fg-color: #fbfbfe;
|
||||
--alt-text-border-color: var(--alt-text-bg-color);
|
||||
--alt-text-hover-bg-color: rgba(82, 82, 94, var(--alt-text-opacity));
|
||||
--alt-text-hover-bg-color: rgb(82 82 94 / var(--alt-text-opacity));
|
||||
--alt-text-hover-fg-color: var(--alt-text-fg-color);
|
||||
--alt-text-hover-border-color: var(--alt-text-hover-bg-color);
|
||||
--alt-text-active-bg-color: rgba(91, 91, 102, var(--alt-text-opacity));
|
||||
--alt-text-active-bg-color: rgb(91 91 102 / var(--alt-text-opacity));
|
||||
--alt-text-active-fg-color: var(--alt-text-fg-color);
|
||||
--alt-text-active-border-color: var(--alt-text-hover-bg-color);
|
||||
--alt-text-focus-outline-color: #0060df;
|
||||
--alt-text-focus-border-color: #f0f0f4;
|
||||
--alt-text-shadow: 0 2px 6px 0 rgba(28, 27, 34, 0.5);
|
||||
--alt-text-shadow: 0 2px 6px 0 rgb(28 27 34 / 0.5);
|
||||
}
|
||||
|
||||
@media (min-resolution: 1.1dppx) {
|
||||
@ -558,7 +558,7 @@
|
||||
--alt-text-tooltip-bg: #f0f0f4;
|
||||
--alt-text-tooltip-fg: #15141a;
|
||||
--alt-text-tooltip-border: #8f8f9d;
|
||||
--alt-text-tooltip-shadow: 0px 2px 6px 0px rgba(58, 57, 68, 0.2);
|
||||
--alt-text-tooltip-shadow: 0px 2px 6px 0px rgb(58 57 68 / 0.2);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
--alt-text-tooltip-bg: #1c1b22;
|
||||
@ -600,7 +600,7 @@
|
||||
#altTextDialog {
|
||||
--dialog-bg-color: white;
|
||||
--dialog-border-color: white;
|
||||
--dialog-shadow: 0 2px 14px 0 rgba(58, 57, 68, 0.2);
|
||||
--dialog-shadow: 0 2px 14px 0 rgb(58 57 68 / 0.2);
|
||||
--text-primary-color: #15141a;
|
||||
--text-secondary-color: #5b5b66;
|
||||
--hover-filter: brightness(0.9);
|
||||
@ -635,17 +635,17 @@
|
||||
--dialog-shadow: 0 2px 14px 0 #15141a;
|
||||
--text-primary-color: #fbfbfe;
|
||||
--text-secondary-color: #cfcfd8;
|
||||
--focus-ring-color: #00ddff;
|
||||
--focus-ring-color: #0df;
|
||||
--hover-filter: brightness(1.4);
|
||||
|
||||
--textarea-bg-color: #42414d;
|
||||
|
||||
--radio-bg-color: #2b2a33;
|
||||
--radio-checked-bg-color: #15141a;
|
||||
--radio-checked-border-color: #00ddff;
|
||||
--radio-checked-border-color: #0df;
|
||||
|
||||
--button-cancel-bg-color: #2b2a33;
|
||||
--button-save-bg-color: #00ddff;
|
||||
--button-save-bg-color: #0df;
|
||||
--button-save-fg-color: #15141a;
|
||||
}
|
||||
|
||||
|
||||
@ -123,12 +123,12 @@
|
||||
:is(.linkAnnotation, .buttonWidgetAnnotation.pushButton):not(.hasBorder)
|
||||
> a:hover {
|
||||
opacity: 0.2;
|
||||
background-color: rgba(255, 255, 0, 1);
|
||||
box-shadow: 0 2px 10px rgba(255, 255, 0, 1);
|
||||
background-color: rgb(255 255 0 / 1);
|
||||
box-shadow: 0 2px 10px rgb(255 255 0 / 1);
|
||||
}
|
||||
|
||||
.annotationLayer .linkAnnotation.hasBorder:hover {
|
||||
background-color: rgba(255, 255, 0, 0.2);
|
||||
background-color: rgb(255 255 0 / 0.2);
|
||||
}
|
||||
|
||||
.annotationLayer .hasBorder {
|
||||
@ -291,11 +291,11 @@
|
||||
}
|
||||
|
||||
.annotationLayer .popup {
|
||||
background-color: rgba(255, 255, 153, 1);
|
||||
background-color: rgb(255 255 153 / 1);
|
||||
box-shadow: 0 calc(2px * var(--scale-factor)) calc(5px * var(--scale-factor))
|
||||
rgba(136, 136, 136, 1);
|
||||
rgb(136 136 136 / 1);
|
||||
border-radius: calc(2px * var(--scale-factor));
|
||||
outline: 1.5px solid rgb(255, 255, 74);
|
||||
outline: 1.5px solid rgb(255 255 74);
|
||||
padding: calc(6px * var(--scale-factor));
|
||||
cursor: pointer;
|
||||
font: message-box;
|
||||
@ -327,7 +327,7 @@
|
||||
}
|
||||
|
||||
.annotationLayer .popupContent {
|
||||
border-top: 1px solid rgba(51, 51, 51, 1);
|
||||
border-top: 1px solid rgb(51 51 51 / 1);
|
||||
margin-top: calc(2px * var(--scale-factor));
|
||||
padding-top: calc(2px * var(--scale-factor));
|
||||
}
|
||||
|
||||
@ -22,8 +22,8 @@
|
||||
font: message-box;
|
||||
}
|
||||
#PDFBug {
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
border: 1px solid rgba(102, 102, 102, 1);
|
||||
background-color: rgb(255 255 255 / 1);
|
||||
border: 1px solid rgb(102 102 102 / 1);
|
||||
position: fixed;
|
||||
top: 32px;
|
||||
right: 0;
|
||||
@ -33,8 +33,8 @@
|
||||
width: var(--panel-width);
|
||||
}
|
||||
#PDFBug .controls {
|
||||
background: rgba(238, 238, 238, 1);
|
||||
border-bottom: 1px solid rgba(102, 102, 102, 1);
|
||||
background: rgb(238 238 238 / 1);
|
||||
border-bottom: 1px solid rgb(102 102 102 / 1);
|
||||
padding: 3px;
|
||||
}
|
||||
#PDFBug .panels {
|
||||
@ -50,7 +50,7 @@
|
||||
}
|
||||
.debuggerShowText,
|
||||
.debuggerHideText:hover {
|
||||
background-color: rgba(255, 255, 0, 1);
|
||||
background-color: rgb(255 255 0 / 1);
|
||||
}
|
||||
#PDFBug .stats {
|
||||
font-family: courier;
|
||||
@ -82,7 +82,7 @@
|
||||
}
|
||||
|
||||
#viewer.textLayer-visible .canvasWrapper {
|
||||
background-color: rgba(128, 255, 128, 1);
|
||||
background-color: rgb(128 255 128 / 1);
|
||||
}
|
||||
|
||||
#viewer.textLayer-visible .canvasWrapper canvas {
|
||||
@ -90,22 +90,22 @@
|
||||
}
|
||||
|
||||
#viewer.textLayer-visible .textLayer span {
|
||||
background-color: rgba(255, 255, 0, 0.1);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
border: solid 1px rgba(255, 0, 0, 0.5);
|
||||
background-color: rgb(255 255 0 / 0.1);
|
||||
color: rgb(0 0 0 / 1);
|
||||
border: solid 1px rgb(255 0 0 / 0.5);
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
#viewer.textLayer-visible .textLayer span[aria-owns] {
|
||||
background-color: rgba(255, 0, 0, 0.3);
|
||||
background-color: rgb(255 0 0 / 0.3);
|
||||
}
|
||||
|
||||
#viewer.textLayer-hover .textLayer span:hover {
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
background-color: rgb(255 255 255 / 1);
|
||||
color: rgb(0 0 0 / 1);
|
||||
}
|
||||
|
||||
#viewer.textLayer-shadow .textLayer span {
|
||||
background-color: rgba(255, 255, 255, 0.6);
|
||||
color: rgba(0, 0, 0, 1);
|
||||
background-color: rgb(255 255 255 / 0.6);
|
||||
color: rgb(0 0 0 / 1);
|
||||
}
|
||||
|
||||
@ -79,7 +79,7 @@
|
||||
overflow: visible;
|
||||
border: var(--page-border);
|
||||
background-clip: content-box;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
background-color: rgb(255 255 255 / 1);
|
||||
}
|
||||
|
||||
.pdfViewer .dummyPage {
|
||||
|
||||
@ -14,8 +14,8 @@
|
||||
*/
|
||||
|
||||
:root {
|
||||
--highlight-bg-color: rgba(180, 0, 170, 1);
|
||||
--highlight-selected-bg-color: rgba(0, 100, 0, 1);
|
||||
--highlight-bg-color: rgb(180 0 170 / 1);
|
||||
--highlight-selected-bg-color: rgb(0 100 0 / 1);
|
||||
}
|
||||
|
||||
@media screen and (forced-colors: active) {
|
||||
|
||||
@ -22,17 +22,17 @@
|
||||
--toolbar-icon-opacity: 1;
|
||||
--doorhanger-icon-opacity: 0.9;
|
||||
|
||||
--main-color: rgba(12, 12, 13, 1);
|
||||
--body-bg-color: rgba(212, 212, 215, 1);
|
||||
--main-color: rgb(12 12 13 / 1);
|
||||
--body-bg-color: rgb(212 212 215 / 1);
|
||||
--scrollbar-color: auto;
|
||||
--scrollbar-bg-color: auto;
|
||||
--field-color: rgba(6, 6, 6, 1);
|
||||
--field-bg-color: rgba(255, 255, 255, 1);
|
||||
--field-border-color: rgba(187, 187, 188, 1);
|
||||
--doorhanger-bg-color: rgba(255, 255, 255, 1);
|
||||
--field-color: rgb(6 6 6 / 1);
|
||||
--field-bg-color: rgb(255 255 255 / 1);
|
||||
--field-border-color: rgb(187 187 188 / 1);
|
||||
--doorhanger-bg-color: rgb(255 255 255 / 1);
|
||||
--dialog-button-border: none;
|
||||
--dialog-button-bg-color: rgba(12, 12, 13, 0.1);
|
||||
--dialog-button-hover-bg-color: rgba(12, 12, 13, 0.3);
|
||||
--dialog-button-bg-color: rgb(12 12 13 / 0.1);
|
||||
--dialog-button-hover-bg-color: rgb(12 12 13 / 0.3);
|
||||
|
||||
--toolbar-bg-color: #f9f9fb;
|
||||
--toolbar-divider-color: #e0e0e6;
|
||||
@ -48,16 +48,16 @@
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--main-color: rgba(249, 249, 250, 1);
|
||||
--body-bg-color: rgba(42, 42, 46, 1);
|
||||
--scrollbar-color: rgba(121, 121, 123, 1);
|
||||
--scrollbar-bg-color: rgba(35, 35, 39, 1);
|
||||
--field-color: rgba(250, 250, 250, 1);
|
||||
--field-bg-color: rgba(64, 64, 68, 1);
|
||||
--field-border-color: rgba(115, 115, 115, 1);
|
||||
--doorhanger-bg-color: rgba(74, 74, 79, 1);
|
||||
--dialog-button-bg-color: rgba(92, 92, 97, 1);
|
||||
--dialog-button-hover-bg-color: rgba(115, 115, 115, 1);
|
||||
--main-color: rgb(249 249 250 / 1);
|
||||
--body-bg-color: rgb(42 42 46 / 1);
|
||||
--scrollbar-color: rgb(121 121 123 / 1);
|
||||
--scrollbar-bg-color: rgb(35 35 39 / 1);
|
||||
--field-color: rgb(250 250 250 / 1);
|
||||
--field-bg-color: rgb(64 64 68 / 1);
|
||||
--field-border-color: rgb(115 115 115 / 1);
|
||||
--doorhanger-bg-color: rgb(74 74 79 / 1);
|
||||
--dialog-button-bg-color: rgb(92 92 97 / 1);
|
||||
--dialog-button-hover-bg-color: rgb(115 115 115 / 1);
|
||||
|
||||
--toolbar-bg-color: #2b2a33;
|
||||
--toolbar-divider-color: #5b5b66;
|
||||
@ -254,12 +254,12 @@ dialog {
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
background-color: var(--doorhanger-bg-color);
|
||||
border: 1px solid rgba(0, 0, 0, 0.5);
|
||||
border: 1px solid rgb(0 0 0 / 0.5);
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
|
||||
box-shadow: 0 1px 4px rgb(0 0 0 / 0.3);
|
||||
}
|
||||
dialog::backdrop {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
background-color: rgb(0 0 0 / 0.2);
|
||||
}
|
||||
|
||||
dialog > .row {
|
||||
@ -288,7 +288,7 @@ dialog .buttonRow {
|
||||
}
|
||||
|
||||
dialog :link {
|
||||
color: rgba(255, 255, 255, 1);
|
||||
color: rgb(255 255 255 / 1);
|
||||
}
|
||||
|
||||
#passwordDialog {
|
||||
@ -308,7 +308,7 @@ dialog :link {
|
||||
|
||||
@media print {
|
||||
body {
|
||||
background: rgba(0, 0, 0, 0) none;
|
||||
background: rgb(0 0 0 / 0) none;
|
||||
}
|
||||
body[data-pdfjsprinting] #outerContainer {
|
||||
display: none;
|
||||
|
||||
178
web/viewer.css
178
web/viewer.css
@ -29,52 +29,52 @@
|
||||
--toolbar-icon-opacity: 0.7;
|
||||
--doorhanger-icon-opacity: 0.9;
|
||||
|
||||
--main-color: rgba(12, 12, 13, 1);
|
||||
--body-bg-color: rgba(212, 212, 215, 1);
|
||||
--progressBar-color: rgba(10, 132, 255, 1);
|
||||
--progressBar-bg-color: rgba(221, 221, 222, 1);
|
||||
--progressBar-blend-color: rgba(116, 177, 239, 1);
|
||||
--main-color: rgb(12 12 13 / 1);
|
||||
--body-bg-color: rgb(212 212 215 / 1);
|
||||
--progressBar-color: rgb(10 132 255 / 1);
|
||||
--progressBar-bg-color: rgb(221 221 222 / 1);
|
||||
--progressBar-blend-color: rgb(116 177 239 / 1);
|
||||
--scrollbar-color: auto;
|
||||
--scrollbar-bg-color: auto;
|
||||
--toolbar-icon-bg-color: rgba(0, 0, 0, 1);
|
||||
--toolbar-icon-hover-bg-color: rgba(0, 0, 0, 1);
|
||||
--toolbar-icon-bg-color: rgb(0 0 0 / 1);
|
||||
--toolbar-icon-hover-bg-color: rgb(0 0 0 / 1);
|
||||
|
||||
--sidebar-narrow-bg-color: rgba(212, 212, 215, 0.9);
|
||||
--sidebar-toolbar-bg-color: rgba(245, 246, 247, 1);
|
||||
--toolbar-bg-color: rgba(249, 249, 250, 1);
|
||||
--toolbar-border-color: rgba(184, 184, 184, 1);
|
||||
--sidebar-narrow-bg-color: rgb(212 212 215 / 0.9);
|
||||
--sidebar-toolbar-bg-color: rgb(245 246 247 / 1);
|
||||
--toolbar-bg-color: rgb(249 249 250 / 1);
|
||||
--toolbar-border-color: rgb(184 184 184 / 1);
|
||||
--toolbar-box-shadow: 0 1px 0 var(--toolbar-border-color);
|
||||
--toolbar-border-bottom: none;
|
||||
--toolbarSidebar-box-shadow: inset calc(-1px * var(--dir-factor)) 0 0
|
||||
rgba(0, 0, 0, 0.25),
|
||||
0 1px 0 rgba(0, 0, 0, 0.15), 0 0 1px rgba(0, 0, 0, 0.1);
|
||||
rgb(0 0 0 / 0.25),
|
||||
0 1px 0 rgb(0 0 0 / 0.15), 0 0 1px rgb(0 0 0 / 0.1);
|
||||
--toolbarSidebar-border-bottom: none;
|
||||
--button-hover-color: rgba(221, 222, 223, 1);
|
||||
--toggled-btn-color: rgba(0, 0, 0, 1);
|
||||
--toggled-btn-bg-color: rgba(0, 0, 0, 0.3);
|
||||
--toggled-hover-active-btn-color: rgba(0, 0, 0, 0.4);
|
||||
--button-hover-color: rgb(221 222 223 / 1);
|
||||
--toggled-btn-color: rgb(0 0 0 / 1);
|
||||
--toggled-btn-bg-color: rgb(0 0 0 / 0.3);
|
||||
--toggled-hover-active-btn-color: rgb(0 0 0 / 0.4);
|
||||
--toggled-hover-btn-outline: none;
|
||||
--dropdown-btn-bg-color: rgba(215, 215, 219, 1);
|
||||
--dropdown-btn-bg-color: rgb(215 215 219 / 1);
|
||||
--dropdown-btn-border: none;
|
||||
--separator-color: rgba(0, 0, 0, 0.3);
|
||||
--field-color: rgba(6, 6, 6, 1);
|
||||
--field-bg-color: rgba(255, 255, 255, 1);
|
||||
--field-border-color: rgba(187, 187, 188, 1);
|
||||
--treeitem-color: rgba(0, 0, 0, 0.8);
|
||||
--treeitem-bg-color: rgba(0, 0, 0, 0.15);
|
||||
--treeitem-hover-color: rgba(0, 0, 0, 0.9);
|
||||
--treeitem-selected-color: rgba(0, 0, 0, 0.9);
|
||||
--treeitem-selected-bg-color: rgba(0, 0, 0, 0.25);
|
||||
--thumbnail-hover-color: rgba(0, 0, 0, 0.1);
|
||||
--thumbnail-selected-color: rgba(0, 0, 0, 0.2);
|
||||
--doorhanger-bg-color: rgba(255, 255, 255, 1);
|
||||
--doorhanger-border-color: rgba(12, 12, 13, 0.2);
|
||||
--doorhanger-hover-color: rgba(12, 12, 13, 1);
|
||||
--doorhanger-hover-bg-color: rgba(237, 237, 237, 1);
|
||||
--doorhanger-separator-color: rgba(222, 222, 222, 1);
|
||||
--separator-color: rgb(0 0 0 / 0.3);
|
||||
--field-color: rgb(6 6 6 / 1);
|
||||
--field-bg-color: rgb(255 255 255 / 1);
|
||||
--field-border-color: rgb(187 187 188 / 1);
|
||||
--treeitem-color: rgb(0 0 0 / 0.8);
|
||||
--treeitem-bg-color: rgb(0 0 0 / 0.15);
|
||||
--treeitem-hover-color: rgb(0 0 0 / 0.9);
|
||||
--treeitem-selected-color: rgb(0 0 0 / 0.9);
|
||||
--treeitem-selected-bg-color: rgb(0 0 0 / 0.25);
|
||||
--thumbnail-hover-color: rgb(0 0 0 / 0.1);
|
||||
--thumbnail-selected-color: rgb(0 0 0 / 0.2);
|
||||
--doorhanger-bg-color: rgb(255 255 255 / 1);
|
||||
--doorhanger-border-color: rgb(12 12 13 / 0.2);
|
||||
--doorhanger-hover-color: rgb(12 12 13 / 1);
|
||||
--doorhanger-hover-bg-color: rgb(237 237 237 / 1);
|
||||
--doorhanger-separator-color: rgb(222 222 222 / 1);
|
||||
--dialog-button-border: none;
|
||||
--dialog-button-bg-color: rgba(12, 12, 13, 0.1);
|
||||
--dialog-button-hover-bg-color: rgba(12, 12, 13, 0.3);
|
||||
--dialog-button-bg-color: rgb(12 12 13 / 0.1);
|
||||
--dialog-button-hover-bg-color: rgb(12 12 13 / 0.3);
|
||||
|
||||
--loading-icon: url(images/loading.svg);
|
||||
--treeitem-expanded-icon: url(images/treeitem-expanded.svg);
|
||||
@ -131,43 +131,43 @@
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--main-color: rgba(249, 249, 250, 1);
|
||||
--body-bg-color: rgba(42, 42, 46, 1);
|
||||
--progressBar-color: rgba(0, 96, 223, 1);
|
||||
--progressBar-bg-color: rgba(40, 40, 43, 1);
|
||||
--progressBar-blend-color: rgba(20, 68, 133, 1);
|
||||
--scrollbar-color: rgba(121, 121, 123, 1);
|
||||
--scrollbar-bg-color: rgba(35, 35, 39, 1);
|
||||
--toolbar-icon-bg-color: rgba(255, 255, 255, 1);
|
||||
--toolbar-icon-hover-bg-color: rgba(255, 255, 255, 1);
|
||||
--main-color: rgb(249 249 250 / 1);
|
||||
--body-bg-color: rgb(42 42 46 / 1);
|
||||
--progressBar-color: rgb(0 96 223 / 1);
|
||||
--progressBar-bg-color: rgb(40 40 43 / 1);
|
||||
--progressBar-blend-color: rgb(20 68 133 / 1);
|
||||
--scrollbar-color: rgb(121 121 123 / 1);
|
||||
--scrollbar-bg-color: rgb(35 35 39 / 1);
|
||||
--toolbar-icon-bg-color: rgb(255 255 255 / 1);
|
||||
--toolbar-icon-hover-bg-color: rgb(255 255 255 / 1);
|
||||
|
||||
--sidebar-narrow-bg-color: rgba(42, 42, 46, 0.9);
|
||||
--sidebar-toolbar-bg-color: rgba(50, 50, 52, 1);
|
||||
--toolbar-bg-color: rgba(56, 56, 61, 1);
|
||||
--toolbar-border-color: rgba(12, 12, 13, 1);
|
||||
--button-hover-color: rgba(102, 102, 103, 1);
|
||||
--toggled-btn-color: rgba(255, 255, 255, 1);
|
||||
--toggled-btn-bg-color: rgba(0, 0, 0, 0.3);
|
||||
--toggled-hover-active-btn-color: rgba(0, 0, 0, 0.4);
|
||||
--dropdown-btn-bg-color: rgba(74, 74, 79, 1);
|
||||
--separator-color: rgba(0, 0, 0, 0.3);
|
||||
--field-color: rgba(250, 250, 250, 1);
|
||||
--field-bg-color: rgba(64, 64, 68, 1);
|
||||
--field-border-color: rgba(115, 115, 115, 1);
|
||||
--treeitem-color: rgba(255, 255, 255, 0.8);
|
||||
--treeitem-bg-color: rgba(255, 255, 255, 0.15);
|
||||
--treeitem-hover-color: rgba(255, 255, 255, 0.9);
|
||||
--treeitem-selected-color: rgba(255, 255, 255, 0.9);
|
||||
--treeitem-selected-bg-color: rgba(255, 255, 255, 0.25);
|
||||
--thumbnail-hover-color: rgba(255, 255, 255, 0.1);
|
||||
--thumbnail-selected-color: rgba(255, 255, 255, 0.2);
|
||||
--doorhanger-bg-color: rgba(74, 74, 79, 1);
|
||||
--doorhanger-border-color: rgba(39, 39, 43, 1);
|
||||
--doorhanger-hover-color: rgba(249, 249, 250, 1);
|
||||
--doorhanger-hover-bg-color: rgba(93, 94, 98, 1);
|
||||
--doorhanger-separator-color: rgba(92, 92, 97, 1);
|
||||
--dialog-button-bg-color: rgba(92, 92, 97, 1);
|
||||
--dialog-button-hover-bg-color: rgba(115, 115, 115, 1);
|
||||
--sidebar-narrow-bg-color: rgb(42 42 46 / 0.9);
|
||||
--sidebar-toolbar-bg-color: rgb(50 50 52 / 1);
|
||||
--toolbar-bg-color: rgb(56 56 61 / 1);
|
||||
--toolbar-border-color: rgb(12 12 13 / 1);
|
||||
--button-hover-color: rgb(102 102 103 / 1);
|
||||
--toggled-btn-color: rgb(255 255 255 / 1);
|
||||
--toggled-btn-bg-color: rgb(0 0 0 / 0.3);
|
||||
--toggled-hover-active-btn-color: rgb(0 0 0 / 0.4);
|
||||
--dropdown-btn-bg-color: rgb(74 74 79 / 1);
|
||||
--separator-color: rgb(0 0 0 / 0.3);
|
||||
--field-color: rgb(250 250 250 / 1);
|
||||
--field-bg-color: rgb(64 64 68 / 1);
|
||||
--field-border-color: rgb(115 115 115 / 1);
|
||||
--treeitem-color: rgb(255 255 255 / 0.8);
|
||||
--treeitem-bg-color: rgb(255 255 255 / 0.15);
|
||||
--treeitem-hover-color: rgb(255 255 255 / 0.9);
|
||||
--treeitem-selected-color: rgb(255 255 255 / 0.9);
|
||||
--treeitem-selected-bg-color: rgb(255 255 255 / 0.25);
|
||||
--thumbnail-hover-color: rgb(255 255 255 / 0.1);
|
||||
--thumbnail-selected-color: rgb(255 255 255 / 0.2);
|
||||
--doorhanger-bg-color: rgb(74 74 79 / 1);
|
||||
--doorhanger-border-color: rgb(39 39 43 / 1);
|
||||
--doorhanger-hover-color: rgb(249 249 250 / 1);
|
||||
--doorhanger-hover-bg-color: rgb(93 94 98 / 1);
|
||||
--doorhanger-separator-color: rgb(92 92 97 / 1);
|
||||
--dialog-button-bg-color: rgb(92 92 97 / 1);
|
||||
--dialog-button-hover-bg-color: rgb(115 115 115 / 1);
|
||||
|
||||
/* This image is used in <input> elements, which unfortunately means that
|
||||
* the `mask-image` approach used with all of the other images doesn't work
|
||||
@ -235,7 +235,7 @@ body {
|
||||
|
||||
#viewerContainer.pdfPresentationMode:fullscreen {
|
||||
top: 0;
|
||||
background-color: rgba(0, 0, 0, 1);
|
||||
background-color: rgb(0 0 0 / 1);
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
@ -270,7 +270,7 @@ body {
|
||||
visibility: hidden;
|
||||
z-index: 100;
|
||||
font: message-box;
|
||||
border-top: 1px solid rgba(51, 51, 51, 1);
|
||||
border-top: 1px solid rgb(51 51 51 / 1);
|
||||
border-inline-end: var(--doorhanger-border-color-whcm);
|
||||
transition-property: inset-inline-start;
|
||||
transition-duration: var(--sidebar-transition-duration);
|
||||
@ -296,7 +296,7 @@ body {
|
||||
overflow: auto;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
box-shadow: inset calc(-1px * var(--dir-factor)) 0 0 rgba(0, 0, 0, 0.25);
|
||||
box-shadow: inset calc(-1px * var(--dir-factor)) 0 0 rgb(0 0 0 / 0.25);
|
||||
}
|
||||
|
||||
#viewerContainer {
|
||||
@ -497,7 +497,7 @@ body {
|
||||
}
|
||||
/*#if !MOZCENTRAL*/
|
||||
#findInput::-webkit-input-placeholder {
|
||||
color: rgba(191, 191, 191, 1);
|
||||
color: rgb(191 191 191 / 1);
|
||||
}
|
||||
/*#endif*/
|
||||
#findInput::placeholder {
|
||||
@ -509,7 +509,7 @@ body {
|
||||
background-position: calc(50% + 48% * var(--dir-factor));
|
||||
}
|
||||
#findInput[data-status="notFound"] {
|
||||
background-color: rgba(255, 102, 102, 1);
|
||||
background-color: rgb(255 102 102 / 1);
|
||||
}
|
||||
|
||||
.secondaryToolbar,
|
||||
@ -607,7 +607,7 @@ body {
|
||||
:is(.doorHanger, .doorHangerRight)::after,
|
||||
:is(.doorHanger, .doorHangerRight)::before {
|
||||
bottom: 100%;
|
||||
border: 8px solid rgba(0, 0, 0, 0);
|
||||
border: 8px solid rgb(0 0 0 / 0);
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
@ -639,8 +639,8 @@ body {
|
||||
}
|
||||
|
||||
#findResultsCount {
|
||||
background-color: rgba(217, 217, 217, 1);
|
||||
color: rgba(82, 82, 82, 1);
|
||||
background-color: rgb(217 217 217 / 1);
|
||||
color: rgb(82 82 82 / 1);
|
||||
text-align: center;
|
||||
padding: 4px 5px;
|
||||
margin: 5px;
|
||||
@ -981,7 +981,7 @@ a:is(.toolbarButton, .secondaryToolbarButton)[href="#"] {
|
||||
inset-inline-end: 2px;
|
||||
/* Create a filled circle, with a diameter of 9 pixels, using only CSS: */
|
||||
content: "";
|
||||
background-color: rgba(112, 219, 85, 1);
|
||||
background-color: rgb(112 219 85 / 1);
|
||||
height: 9px;
|
||||
width: 9px;
|
||||
border-radius: 50%;
|
||||
@ -1206,7 +1206,7 @@ a:focus > .thumbnail > .thumbnailImage,
|
||||
.thumbnail:not([data-loaded]) > .thumbnailImage {
|
||||
width: calc(var(--thumbnail-width) - 2px);
|
||||
height: calc(var(--thumbnail-height) - 2px);
|
||||
border: 1px dashed rgba(132, 132, 132, 1);
|
||||
border: 1px dashed rgb(132 132 132 / 1);
|
||||
}
|
||||
|
||||
.treeWithDeepNesting > .treeItem,
|
||||
@ -1248,7 +1248,7 @@ a:focus > .thumbnail > .thumbnailImage,
|
||||
float: var(--inline-start);
|
||||
height: 0;
|
||||
width: 0;
|
||||
color: rgba(255, 255, 255, 0.5);
|
||||
color: rgb(255 255 255 / 0.5);
|
||||
}
|
||||
.treeItemToggler::before {
|
||||
inset-inline-end: 4px;
|
||||
@ -1295,12 +1295,12 @@ dialog {
|
||||
font-size: 12px;
|
||||
line-height: 14px;
|
||||
background-color: var(--doorhanger-bg-color);
|
||||
border: 1px solid rgba(0, 0, 0, 0.5);
|
||||
border: 1px solid rgb(0 0 0 / 0.5);
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
|
||||
box-shadow: 0 1px 4px rgb(0 0 0 / 0.3);
|
||||
}
|
||||
dialog::backdrop {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
background-color: rgb(0 0 0 / 0.2);
|
||||
}
|
||||
|
||||
dialog > .row {
|
||||
@ -1329,7 +1329,7 @@ dialog .buttonRow {
|
||||
}
|
||||
|
||||
dialog :link {
|
||||
color: rgba(255, 255, 255, 1);
|
||||
color: rgb(255 255 255 / 1);
|
||||
}
|
||||
|
||||
#passwordDialog {
|
||||
@ -1371,7 +1371,7 @@ dialog :link {
|
||||
}
|
||||
.grab-to-pan-grabbing {
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, 0);
|
||||
background: rgb(0 0 0 / 0);
|
||||
display: block;
|
||||
inset: 0;
|
||||
overflow: hidden;
|
||||
@ -1388,7 +1388,7 @@ dialog :link {
|
||||
|
||||
@media print {
|
||||
body {
|
||||
background: rgba(0, 0, 0, 0) none;
|
||||
background: rgb(0 0 0 / 0) none;
|
||||
}
|
||||
body[data-pdfjsprinting] #outerContainer {
|
||||
display: none;
|
||||
|
||||
@ -34,7 +34,7 @@
|
||||
.xfaLayer .highlight {
|
||||
margin: -1px;
|
||||
padding: 1px;
|
||||
background-color: rgba(239, 203, 237, 1);
|
||||
background-color: rgb(239 203 237 / 1);
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@ -55,7 +55,7 @@
|
||||
}
|
||||
|
||||
.xfaLayer .highlight.selected {
|
||||
background-color: rgba(203, 223, 203, 1);
|
||||
background-color: rgb(203 223 203 / 1);
|
||||
}
|
||||
|
||||
.xfaPage {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user