userContent.css
· 2.0 KiB · CSS
Raw
@-moz-document regexp("^.*\\.pdf(?:[?#].*)?$") {
/* === Variables === */
:root {
--bg-color: #292D32;
--input-bg-color: #2c2c2c;
--text-color: #ccc;
--border-color: #555;
--loading-bar-color: #333;
--icon-filter: invert(100%) brightness(200%);
}
/* === Page Inversion (for PDF content) === */
.page canvas {
filter: invert(100%) !important;
}
/* === General Backgrounds === */
body,
#outerContainer,
#mainContainer,
#viewerContainer,
#sidebarContainer,
#sidebarContent,
#thumbnailView,
#outlineView,
#attachmentsView,
#layersView,
.doorHangerRight,
.menu,
.editorParamsToolbar,
.menuContainer,
.dropdownToolbarButton select,
.dialog,
.dialog .mainContainer {
background-color: var(--bg-color) !important;
color: var(--text-color) !important;
}
/* === Toolbar Styling === */
#toolbarContainer,
.toolbar,
#toolbarSidebar {
background-color: var(--bg-color) !important;
color: var(--text-color) !important;
}
.toolbarButton {
background-color: transparent !important;
color: var(--text-color) !important;
}
.toolbarButton > svg,
.toolbarButton::before,
.toolbarButton::after {
filter: var(--icon-filter) !important;
}
.toolbarButton > svg path {
fill: #ffffff !important;
}
/* === Inputs and Dropdowns === */
.toolbarField,
select,
#scaleSelect option,
.dropdown button,
.editorParamsLabel {
background-color: var(--input-bg-color) !important;
color: var(--text-color) !important;
}
/* Hover effects */
.dropdown button:hover {
background-color: var(--loading-bar-color) !important;
}
/* === Labels, Page Counters === */
.toolbarLabel,
#numPages,
#pageNumber {
color: var(--text-color) !important;
}
/* === Loading Bar === */
#loadingBar {
background-color: var(--loading-bar-color) !important;
}
}
| 1 | @-moz-document regexp("^.*\\.pdf(?:[?#].*)?$") { |
| 2 | /* === Variables === */ |
| 3 | :root { |
| 4 | --bg-color: #292D32; |
| 5 | --input-bg-color: #2c2c2c; |
| 6 | --text-color: #ccc; |
| 7 | --border-color: #555; |
| 8 | --loading-bar-color: #333; |
| 9 | --icon-filter: invert(100%) brightness(200%); |
| 10 | } |
| 11 | |
| 12 | /* === Page Inversion (for PDF content) === */ |
| 13 | .page canvas { |
| 14 | filter: invert(100%) !important; |
| 15 | } |
| 16 | |
| 17 | /* === General Backgrounds === */ |
| 18 | body, |
| 19 | #outerContainer, |
| 20 | #mainContainer, |
| 21 | #viewerContainer, |
| 22 | #sidebarContainer, |
| 23 | #sidebarContent, |
| 24 | #thumbnailView, |
| 25 | #outlineView, |
| 26 | #attachmentsView, |
| 27 | #layersView, |
| 28 | .doorHangerRight, |
| 29 | .menu, |
| 30 | .editorParamsToolbar, |
| 31 | .menuContainer, |
| 32 | .dropdownToolbarButton select, |
| 33 | .dialog, |
| 34 | .dialog .mainContainer { |
| 35 | background-color: var(--bg-color) !important; |
| 36 | color: var(--text-color) !important; |
| 37 | } |
| 38 | |
| 39 | /* === Toolbar Styling === */ |
| 40 | #toolbarContainer, |
| 41 | .toolbar, |
| 42 | #toolbarSidebar { |
| 43 | background-color: var(--bg-color) !important; |
| 44 | color: var(--text-color) !important; |
| 45 | } |
| 46 | |
| 47 | .toolbarButton { |
| 48 | background-color: transparent !important; |
| 49 | color: var(--text-color) !important; |
| 50 | } |
| 51 | |
| 52 | .toolbarButton > svg, |
| 53 | .toolbarButton::before, |
| 54 | .toolbarButton::after { |
| 55 | filter: var(--icon-filter) !important; |
| 56 | } |
| 57 | |
| 58 | .toolbarButton > svg path { |
| 59 | fill: #ffffff !important; |
| 60 | } |
| 61 | |
| 62 | /* === Inputs and Dropdowns === */ |
| 63 | .toolbarField, |
| 64 | select, |
| 65 | #scaleSelect option, |
| 66 | .dropdown button, |
| 67 | .editorParamsLabel { |
| 68 | background-color: var(--input-bg-color) !important; |
| 69 | color: var(--text-color) !important; |
| 70 | } |
| 71 | |
| 72 | /* Hover effects */ |
| 73 | .dropdown button:hover { |
| 74 | background-color: var(--loading-bar-color) !important; |
| 75 | } |
| 76 | |
| 77 | /* === Labels, Page Counters === */ |
| 78 | .toolbarLabel, |
| 79 | #numPages, |
| 80 | #pageNumber { |
| 81 | color: var(--text-color) !important; |
| 82 | } |
| 83 | |
| 84 | /* === Loading Bar === */ |
| 85 | #loadingBar { |
| 86 | background-color: var(--loading-bar-color) !important; |
| 87 | } |
| 88 | } |
| 89 |