mich dann eventuell falsch ausgedrückt? Sorry
Alles ist gut.
Hast du denn im Script die richtige Farbe (grau) der Leiste angegeben?
mich dann eventuell falsch ausgedrückt? Sorry
Alles ist gut.
Hast du denn im Script die richtige Farbe (grau) der Leiste angegeben?
Welche Leiste meinst du jetzt? Die, die von dir kommt? Also die unten quasi? Da hab ich die Farbe von lightgrey zu
geändert. Allerdings falls du die Leiste meint, dass war ja die uc.js Datei.
In der userchrome.css von dem Full Theme, hab ich in der Hinsicht nichts geändert weil zu blöd das zu finden als Nichtswisser^^
Verstehe ich nicht
Script:
(function() {
if (location != 'chrome://browser/content/browser.xhtml')
return;
var tb = document.createXULElement('toolbar');
tb.id = 'new-toolbar';
tb.setAttribute('customizable', true);
tb.setAttribute('mode', 'icons');
var vbox = document.createXULElement('vbox');
document.getElementById('navigator-toolbox').parentNode.parentNode.insertBefore(
vbox, document.getElementById('browser-bottombox'));
vbox.style.backgroundColor = 'lightgrey';
vbox.appendChild(tb);
CustomizableUI.registerArea('new-toolbar', {legacy: true});
CustomizableUI.registerToolbarNode(tb);
})();
Alles anzeigen
CSS Code:
#statuspanel {
border: none !important;
margin-top: -20px !important;
-moz-box-ordinal-group: 100 !important;
}
#statuspanel-label {
border: none !important;
background: transparent !important;
}
/* You can find an updated version here: https://github.com/Izheil/Quantum-Nox-Firefox-Dark-Full-Theme */
/* Made by Izheil */
/* Last updated: 03/10/2020 */
/* COLORING PART STARTS HERE */
/* GENERAL COLORS */
/* This root class will modify the colors of toolbar background color (by default is transparent white
without this change) */
#main-window:not([lwt-toolbar-field-focus-brighttext]) {
--toolbar-bgcolor: rgba(0,0,0,.6) !important;
/* This changes the text color of all outside elements of all toolbars */
--lwt-text-color: #ccc !important;
/* You can change the lightweight theme header and footer images with this.
To use this, enable the "lightweight themes fix" below. Delete the final /* to use -> *//*
--lwt-header-image: url("file:///") !important;
--lwt-additional-images: var(--lwt-header-image) !important;
/* v Don't delete this ending bracket */
}
/* Url and search bars */
#nav-bar, #searchbar {
--lwt-toolbar-field-background-color: rgb(61,61,63) !important;
--lwt-toolbar-field-focus: rgb(71,71,73) !important;
--lwt-toolbar-field-color: #ccc !important;
--lwt-toolbar-field-focus-color: var(--lwt-toolbar-field-color) !important;
--lwt-toolbar-field-border-color: #333 !important;
--toolbar-field-focus-border-color: #666 !important;
--urlbar-popup-url-color: rgb(90,170,230) !important;
--urlbar-popup-action-color: var(--urlbar-popup-url-color) !important;
--urlbar-separator-color: #666 !important;
--autocomplete-popup-highlight-background: rgba(100,100,100,0.4) !important;
--autocomplete-popup-highlight-color: #ddd !important}
/* Search panel background gradient*/
.search-panel-one-offs-container {
--Search-engine-choices-gradient: linear-gradient(90deg, rgba(4,34,74,1) 5%, rgba(22,52,132,1) 50%, rgba(4,34,74,1) 95%);}
/* Fix for some lightweight themes not working properly when set manually here (appearing with a lot of padding to the left) *//*
:root:-moz-lwtheme[lwtheme-image], #tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab >
.tab-stack > .tab-background[selected="true"]:-moz-lwtheme {
background-position: left top !important}
/* This changes the background color behind tabs and the menu bar for those using the default dark theme on Windows 7. *//*
#TabsToolbar, #toolbar-menubar {
background-color: #111 !important
}
#main-menubar label {
color: #fff !important
}
/* Tab line color. Using -moz-win-accentcolor as the color value changes it to the current window color (on Windows)
but is disabled by default in this theme (Disable for the default tab line color). *//*
#tabbrowser-tabs {
--tab-line-color: #25a !important}
/* This gives a more notizable color background on hover of the close tab button */
.tab-close-button {
padding: 0 !important;
margin: auto !important}
.tab-close-button:hover {background: rgba(255,255,255,0.15) !important}
*|*:root {
/* Main menu colors */
--panel-separator-color: rgba(95,95,95, .6) !important;
--arrowpanel-background: #383838 !important;
--arrowpanel-color: #ccc !important;
--panel-disabled-color: #888 !important;
--in-content-box-background: #333 !important;
--in-content-box-background-hover: #444 !important;
--arrowpanel-dimmed: rgba(100,100,105, .25) !important;
--arrowpanel-dimmed-further: rgba(100,100,105, .4) !important;
--arrowpanel-dimmed-even-further: rgba(100,100,105, .6) !important;
/* These rules will modify most highlight (background on hover) colors inside Firefox (except sidebar items, which are
in the rule below) */
--bookmark-toolbar-text: var(--lwt-text-color); /* var(--lwt-text-color) for default color of the used theme */
--nav-bar-icons-color: var(--chrome-color); /* var(--chrome-color) for default color of the used theme */
--Min-max-buttons-hover-bg: rgba(255,255,255,0.2);
--Context-menu-highlight: #25a;
--Context-menu-background: rgba(60,60,60, 1); /* The last number changes the opacity %. Change that 1 for 0.9 for semitransparent backgrounds */
--Context-menu-text-color: #ccc;
--Autocomplete-popup-background: rgb(60,60,60);
--Autocomplete-popup-text-color: #ccc;
--Progress-bar-color: #3070dd;
--Input-field-focus-shadow: 0 0 4px #0050ff;
--Bookmark-folder-icon: #ffe793;
--Bookmark-favicon-icon: #ddd;
--Text-selection-bg-color: #0565af;
--Text-selection-color: #fff;
--Searched-item-text-color: #0FF;
--Lists-treechildren-hover-bg: rgba(0,149,221,0.25);
--Lists-treechildren-hover-border: rgb(0,149,221);
--Lists-treechildren-selected-bg: rgba(0,120,255,0.5);
--Lists-treechildren-selected-border: #0a84ff;
--Lists-treechildren-selected-txt: #fff;
--Sidebar-header: #252525;
--Window-bg: #353535;
/* Customization page */
--toolbar-bgcolor: #303030 !important;
--toolbar-non-lwt-bgcolor: #303030 !important;
--toolbar-non-lwt-textcolor: #fff !important;
/* These ones are used for the read/unread tabs styling. For italic rules use
either "normal" or "italic" without the quotes for either no italics or using italics,
and for bold, use either "bold" or "normal" in the same way. You'll want to use semi-transparent
colors (if any) for background colors, otherwise it will show as too bright opaque colors.
Requires the use of setAttribute_unread.uc.js for unread tabs editting. */
--Loaded-and-selected-text: #eee;
--Loaded-and-selected-italic: normal;
--Loaded-and-selected-bold: normal;
--Loaded-and-selected-background: transparent;
--Loaded-but-unread-text: #fff;
--Loaded-but-unread-italic: italic;
--Loaded-but-unread-bold: normal;
--Loaded-but-unread-background: transparent;
--Not-loaded-text: #ccc;
--Not-loaded-italic: italic;
--Not-loaded-bold: normal;
--Not-loaded-background: transparent;
--Loading-text: #0088ff;
--Loading-italic: normal;
--Loading-bold: normal;
--Loading-background: transparent;
}
/* These change the scrollbar color inside dialogs (not pages) */
scrollbar, *|*:root {
/* The first value changes the scrollbar thumb color, the other one the track */
scrollbar-color: #05a #252525 !important;
/* auto = default OS size | thin = half the width (will be hidden in about: pages) | none = hidden scrollbar */
scrollbar-width: auto !important;
}
/* This changes some of the tooltip colors */
tooltip {
-moz-appearance: none !important;
background: #111 !important;
color: #eee !important;
border: 1px solid #333 !important;
}
/* Highlight color on browser windows (url bar, library, search box, bookmarks properties...) */
#urlbar *|*::selection, #infoBox *|*::selection, window *|*::selection,
#editBMPanel_namePicker *|*::selection, #editBMPanel_tagsField *|*::selection,
#editBMPanel_tagsSelector *|*::selection, #placesToolbar *|*::selection,
#mainDeck *|*::selection, dialog *|*::selection, #certDetails *|*::selection,
#SignonViewerDialog *|*::selection, #CookiesDialog *|*::selection,
#searchbar *|*::selection, .findbar-textbox::selection {
/* This is the background color */
background: var(--Text-selection-bg-color) !important;
/* This is the text color */
color: var(--Text-selection-color) !important}
/* This changes the color of the sidebar panel text */
#bookmarks-view treechildren, #historyTree treechildren,
dialog richlistitem {color: var(--arrowpanel-color) !important}
/* This is a fix for treechildren that might look whiteish in linux */
treechildren::-moz-tree-row, dialog richlistitem {background: transparent !important}
/* This changes all treechildren elements highlights (list-like elements) */
treechildren::-moz-tree-row(hover), dialog richlistitem:hover {
background: var(--Lists-treechildren-hover-bg) !important;
border: 1px solid var(--Lists-treechildren-hover-border) !important}
treechildren::-moz-tree-row(selected), dialog richlistitem[selected] {
background: var(--Lists-treechildren-selected-bg) !important;
border: 1px solid var(--Lists-treechildren-selected-border) !important;
color: var(--Lists-treechildren-selected-txt) !important}
dialog richlistitem[clear-site-data-cookies-with-data] {border: 1px solid red !important}
/* v Fix to make the pre-render loading page dark instead of white v */
#tabbrowser-tabpanels {background-color: #202025 !important}
/* Tabs border color */
.tabbrowser-tab {border-right: 1px solid rgba(255,255,255, .15) !important}
/* Tabs close icon color always whiteish */
.tabbrowser-tab[selected="true"] .close-icon {fill: #ddd !important}
/* GLOW EFFECT ON TAB ICON */
/* toolbarbutton.bookmark-item:not([container=true]) .toolbarbutton-icon
for icons on the bookmarks bar under the url bar */
.tab-icon-image, .bookmark-item:not([container=true]) .menu-iconic-icon {
filter: drop-shadow(0 0 3px #fff);}
/* END OF GENERAL COLORS */
/* URL bar */
.searchbar-search-button, .urlbar-icon,
.search-setting-button-compact > .button-box > .button-icon {fill: var(--lwt-toolbar-field-color) !important}
#urlbar-input-container *[role="button"]:hover, #urlbar-input-container .urlbar-history-dropmarker:hover,
#urlbar-input-container *[role="button"][open], #urlbar-input-container .urlbar-history-dropmarker[open] {
background-color: var(--autocomplete-popup-highlight-background) !important}
/* Max, min and close buttons */
/* This prevents any custom windows theme to change the background color
of the minimize, maximize and close buttons */
.titlebar-min:not(:hover), .titlebar-max:not(:hover),
#main-window[sizemode="maximized"] .titlebar-max:not(:hover),
.titlebar-close:not(:hover), .titlebar-restore:not(:hover)
{background-color: transparent !important}
/* This changes the color on hover of the minimize and maximize buttons */
.titlebar-min:hover, .titlebar-max:hover,
#main-window[sizemode="maximized"] .titlebar-max:hover,
.titlebar-restore:hover
{background-color: var(--Min-max-buttons-hover-bg) !important}
/* This changes the close button hover color */
.titlebar-close:hover {background-color: #d00 !important}
/* Make tab background transparent */
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-arrowscrollbox > .tabbrowser-tab
> .tab-stack > .tab-background[multiselected="true"]:-moz-lwtheme,
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-arrowscrollbox > .tabbrowser-tab
> .tab-stack > .tab-background[selected="true"]:-moz-lwtheme {
background-image: none !important;
background-color: var(--toolbar-bgcolor) !important}
/* The downloads progress bar color */
.progress-bar {
-moz-appearance: none !important;
background-color: var(--Progress-bar-color) !important}
/* Bookmark toolbar text color */
#PersonalToolbar {color: var(--bookmark-toolbar-text) !important}
/* Thinner bookmarks toolbar */
#PersonalToolbar, #PlacesToolbarItems {
margin-bottom: -1px}
/* Nav bar button color */
#nav-bar {color: var(--nav-bar-icons-color) !important}
/* Search bar inside the content area */
findbar {
background: var(--in-content-box-background) !important;
color: #ddd !important;
border-top: 1px solid #000 !important;}
:root[lwtheme-image] findbar {
--lwt-toolbar-field-background-color: var(--in-content-box-background-hover) !important;
--lwt-toolbar-field-color: #fff !important;
}
findbar .findbar-textbox {
background: var(--in-content-box-background-hover) !important;
color: #fff !important;
border-color: #000 !important}
findbar .findbar-textbox[focused="true"], findbar .findbar-textbox:hover {
border-color: Highlight !important}
.findbar-textbox[status="notfound"] {background: #f66 !important}
.findbar-textbox[flash="true"] {
background-color: yellow !important;
color: black !important}
findbar .findbar-find-previous, findbar .findbar-find-next {
background: linear-gradient(var(--in-content-box-background-hover), var(--in-content-box-background)) !important;
border-top: 1px solid #000 !important;
border-right: 1px solid #000 !important;
border-bottom: 1px solid #000 !important;
border-left: none !important}
findbar .findbar-find-previous:active, findbar .findbar-find-next:active {
background: linear-gradient(var(--in-content-box-background), var(--in-content-box-background-hover)) !important}
/* Color for most dialogs */
dialog, dialog caption, dialog select, .tabmodalprompt-buttonContainer {
-moz-appearance: none !important;
background-color: #333 !important;
color: #ccc !important}
fieldset {border-color: #666 !important}
#printPageSetupDialog caption, .tabmodalprompt-mainContainer {background-color: #444 !important}
.tabmodalprompt-mainContainer {color: #ccc !important}
.tabmodalprompt-mainContainer button {
-moz-appearance: none !important;
border: 1px solid #111 !important;
background: linear-gradient(var(--in-content-box-background-hover), var(--in-content-box-background)) !important;
color: #ddd !important;
padding: 2px !important}
.tabmodalprompt-mainContainer button:hover {
background: linear-gradient(var(--in-content-box-background), var(--in-content-box-background-hover)) !important;
color: #fff !important}
/* Dialog Icons */
#infoIcon, .message-icon,
.alert-icon,
.error-icon,
.question-icon {filter: invert(80%)}
/* Checkbox coloring */
checkbox .checkbox-check {
-moz-appearance: none !important;
border: 1px solid #666 !important;
background-color: #444 !important;
transition: color 0.3s;
min-width: 12px;
min-height: 12px;}
checkbox:not([disabled]):hover .checkbox-check {
box-shadow: 0 0 4px #0084ff !important;
border-color: #0084ff !important}
checkbox[checked] .checkbox-check {
background: #444 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 16 16" ><path fill="rgb(200,200,200)" d="M 13.09,2.87 C 13.09,2.87 6.00,11.00 6.00,11.00 6.00,11.00 2.00,9.00 2.00,9.00 4.25,12.81 7.00,14.00 7.00,14.00 9.24,10.42 12.04,7.39 13.09,2.87 Z" /></svg>') no-repeat center center !important}
#main-menubar .menu-iconic-left, #toolbar-context-menu .menu-iconic-left {
-moz-appearance: none !important;
width: 28px !important;
height: 16px !important}
#main-menubar .menu-iconic-left[checked="true"], #toolbar-context-menu .menu-iconic-left[checked="true"] {
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 16 16" ><path fill="rgb(200,200,200)" d="M 13.09,2.87 C 13.09,2.87 6.00,11.00 6.00,11.00 6.00,11.00 2.00,9.00 2.00,9.00 4.25,12.81 7.00,14.00 7.00,14.00 9.24,10.42 12.04,7.39 13.09,2.87 Z" /></svg>') no-repeat center center !important;
}
/* Radio button coloring */
radio .radio-check, #printPageSetupDialog radio .radio-check {
-moz-appearance: none !important;
border: 1px solid #666 !important;
list-style-image: none !important;
border-radius: 10em;
background-color: #444 !important;
transition: color 0.3s;
min-width: 12px;
min-height: 12px;}
radio:not([disabled]):hover .radio-check,
#printPageSetupDialog radio:not([disabled]):hover .radio-check {
box-shadow: 0 0 4px #0084ff !important;
border-color: #0084ff !important}
radio[selected] .radio-check, #printPageSetupDialog radio[selected] .radio-check {
background: #444 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10px" height="10px" viewBox="0 0 16 16" ><path fill="rgb(200,200,200)" d="M 6.17,3.01 C -0.84,6.78 4.35,15.22 9.89,13.22 15.68,11.20 13.99,1.10 6.17,3.01 Z" /></svg>') no-repeat center center !important}
radio[disabled], checkbox[disabled] {opacity: 0.8}
/* Select boxes coloring */
dialog menulist, #print-preview-scale, #printPageSetupDialog menulist {
-moz-appearance: none !important;
background: #444 url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M434.574 488L430.5 492.147 426.428 488 425 489.399 430.5 494.999 436 489.399z' transform='translate(-425 -488)' fill='%23cccccc' fill-rule='evenodd'/%3E%3C/svg%3E") no-repeat calc(100% - 5px) 50% !important;
padding: 3px;
color: #ccc !important}
dialog menulist:hover, #print-preview-scale:hover, #printPageSetupDialog menulist:hover {
background: #252525 url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M434.574 488L430.5 492.147 426.428 488 425 489.399 430.5 494.999 436 489.399z' transform='translate(-425 -488)' fill='%23cccccc' fill-rule='evenodd'/%3E%3C/svg%3E") no-repeat calc(100% - 5px) 50% !important;
color: #fff !important}
#printPageSetupDialog menulist {background-color: #555 !important}
#printPageSetupDialog menulist:hover {background-color: #666 !important}
dropmarker[exportparts="icon: dropmarker-icon"] {
-moz-appearance: none !important}
/* Release version dialog */
#aboutDialog {
background-color: rgb(23,25,50) !important}
/* This is aimed for notification popups */
window:not(#main-window):not(#CookiesDialog):not(#SignonViewerDialog):not(.theme-dark):not(#aboutDialog):not(.sidebar-panel) > * {
background-color: var(--Window-bg) !important;
color: #fff !important}
/* Color for most buttons */
dialog button, toolbar[printpreview="true"] button,
#print-preview-toolbar button, .dialog-button-box button{
-moz-appearance: none !important;
border-radius: 3px !important;
background-color: #555 !important;
color: #ddd !important;
padding: 2px !important}
dialog button:hover, toolbar[printpreview="true"] button:hover,
#print-preview-toolbar button:hover, .dialog-button-box button:hover {
background-color: #222 !important;
color: #fff !important}
/* This changes the missing dialog buttons */
.dialog-button, .wizard-button {
-moz-appearance: none !important;
background: #444 !important;
color: #ccc !important;
padding: 2px 0px;
transition: all 0.15s ease-in-out}
.dialog-button[disabled], .wizard-button[disabled] {
opacity: 0.7}
.dialog-button:not([disabled]):hover, .wizard-button:not([disabled]):hover {
background: #555 !important;
color: #fff !important}
.dialog-button:not([disabled]):active, .wizard-button:not([disabled]):active {
background: #222 !important;
color: #fff !important}
/* Migration dialog header */
.wizard-header {
background: #222 !important;
color: #fff !important;
border-color: #000 !important}
/* Textboxes colors */
dialog textbox, toolbar[printpreview="true"] textbox, #printPageSetupDialog input {
transition: all 0.25s ease-in-out !important;
-moz-appearance: none !important;
border: 1px solid #666 !important;
background-color: #555 !important;
color: #ccc !important}
dialog textbox[focused="true"], toolbar[printpreview="true"] textbox[focused="true"],
#printPageSetupDialog input:focus {
box-shadow: var(--Input-field-focus-shadow) !important;
background-color: #666 !important;
color: #fff !important}
/* CUSTOMIZATION PAGE */
/* The windows default theme colors will mainly affect the customizing page (when
you aren't using the default dark theme of mozilla, that is) */
/* The customization page button colors */
.customizationmode-button {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #555 !important;
color: #ddd !important;
border: none !important}
.customizationmode-button:hover {
background: #444 !important;
color: #fff !important}
.customization-lwtheme-menu-footeritem {
border-right: 1px solid #222 !important;
background: linear-gradient(#555,#333) !important;
color: #ddd !important}
.customization-lwtheme-menu-footeritem:hover {
background: linear-gradient(#333,#555) !important;
color: #fff !important}
.button-menu-dropmarker .dropmarker-icon {filter: invert(75%) !important}
#customization-done-button {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #2050AA !important;
color: #fff !important;
border: none !important}
#customization-done-button:hover {
background: #1040A0 !important}
#customization-lwtheme-menu-footer {border-top: none !important}
/* This is a fix for systems with a custom OS theme */
.customizationmode-button {padding: 0.5em !important}
#customization-done-button {padding: 0.5em 3em 0.5em 3em !important}
/* CONTEXT MENUS */
/* Shortcut comments on main menu text color */
.subviewbutton[shortcut]::after, .subviewbutton[shortcut]::after,
.PanelUI-subView .subviewbutton-nav::after,
#appMenu-tp-category {color: var(--panel-disabled-color) !important}
/* Zoom reset button on the main menu */
#appMenu-zoomReset-button {background-color: var(--arrowpanel-dimmed) !important}
#appMenu-zoomReset-button:hover {background-color: rgba(0,0,0,0.1) !important}
#appMenu-zoomReset-button:active {background-color: rgba(0,0,0,0.3) !important}
/* This one changes the letters color of all context menus */
menu, menuitem, window menuitem {
color: var(--Context-menu-text-color) !important;
-moz-appearance: none !important}
/* Padding for all menu items (do NOT change unless you want an spaced or indented upon
selection effect). The open in tabs bookmark item is added here since it also needs the
padding that we remove in the next rule */
menuitem, .bookmark-item .openintabs-menuitem,
menupopup > menu {
padding-top: 1px !important;
padding-bottom: 1px !important}
#main-menubar menuitem, #main-menubar menu, menupopup > menuitem,
#placesToolbar #organizeButton > *, #placesToolbar #viewMenu > *,
#placesToolbar #maintenanceButton > * {
padding-top: 2px !important;
padding-bottom: 2px !important}
/* This removes the unnecesary padding from the bookmark items */
.bookmark-item menupopup:not([emptyplacesresult="true"]) menuitem {
padding-top: 0px !important;
padding-bottom: 0px !important}
.bookmark-item menupopup[emptyplacesresult="true"] menuitem {
min-height: 25px !important;
}
/* This changes the color on hover of the context-menu items */
menubar > menu[_moz-menuactive="true"],
menupopup > menu[_moz-menuactive="true"],
popup > menu[_moz-menuactive="true"],
menuitem[_moz-menuactive="true"]
{background-color: var(--Context-menu-highlight) !important}
/* This does the same but for disabled ones */
menubar > menu[_moz-menuactive="true"][disabled="true"],
menupopup > menu[_moz-menuactive="true"][disabled="true"],
popup > menu[_moz-menuactive="true"][disabled="true"],
menuitem[_moz-menuactive="true"][disabled="true"]
{background-color: rgba(0,0,0,0.3) !important}
/* This changes the text color of the greyed out actions on the context menus */
menuitem[disabled="true"], popup > menu[disabled="true"],
menupopup > menu[disabled="true"], menubar > menu[disabled="true"]{color: #777 !important}
/* This one applies to all context menus (If you want to theme the browser this one is better instead
of going one by one) */
menupopup:not(.PanelUI-subView) {
background-color: var(--Context-menu-background) !important}
/* The following code changes the borders of all the context menus (except the ones above mentioned),
as well as ignoring the bookmark menu context menu */
menupopup:not(.PanelUI-subView) {
-moz-appearance: none !important;
border: 1px solid #555 !important}
/* Context menu separator color override */
menuseparator {
-moz-appearance: none !important;
margin: 1px 0 1px 2.3em !important;
height: 1px !important;
border: none !important;
background: #555 !important;
padding: 0 !important}
/* Context menu navigation tools (back, forward, reload) background color */
#context-navigation {
-moz-appearance: none !important;
background-color: var(--Context-menu-background) !important;
padding-bottom: 0px !important}
/* This removes the borders for the bookmark menu button next to the url bar */
#BMB_bookmarksPopup, #BMB_bookmarksPopup menupopup {border: none !important}
/* This changes the text color of the hint text on the bookmarks popup menu */
.menu-accel-container .menu-iconic-accel {color: #808080 !important}
.menu-accel-container .menu-accel {color: #909090 !important}
/* Bookmark context menu > icon color and popup allow > icon color */
.bookmark-item .menu-right, menu .menu-right,
#identity-popup-popup-menulist .menulist-dropmarker {filter: brightness(300%) !important}
/* Drop indicator that appears when moving a bookmark in a bookmark folder color */
menupopup::part(drop-indicator) {background-color: #5af !important}
/* Color of default icons on bookmark bar and bookmark popup (folder icons mainly) */
.bookmark-item > .toolbarbutton-icon[type="menu"],
.bookmark-item[container="true"] .menu-iconic-icon {fill: var(--Bookmark-folder-icon) !important}
/* Color of default icons on bookmark bar and bookmark popup (world icon, aka not-favicon-found icon) */
.bookmark-item[scheme="http"], .bookmark-item[scheme="http"] .menu-iconic-icon {fill: var(--Bookmark-favicon-icon) !important}
/* Other colors of the bookmark popup */
.panel-header,
#identity-popup-mainView-panel-header {background-color: rgba(0,0,0,0.2) !important}
#editBookmarkPanelBottomButtons.panel-footer {background-color: #444 !important}
/* Remove cookies headers on url bar popup */
.identity-popup-cookiesView-list-header {color: #ddd !important}
#identity-popup-content-blocking-detected, .identity-popup-content-blocking-empty-label,
#identity-popup-permission-empty-hint {color: #aaa !important}
/* Fix for the space above the "save as" option after the navigation buttons have been eliminated. Change
if necessary depending on if you are using a custom OS theme (which may mess up the padding of the separators) */
#context-savepage {padding-top: 3px !important}
/* Protections popup text */
#protections-popup-category-list description[role="heading"] {
color: var(--arrowpanel-color) !important}
.text-link, .protections-popup-category,
#protections-popup-trackers-blocked-counter-description {
color: var(--panel-disabled-color) !important}
/* LIBRARY MENU */
/* These change top bar background color */
#placesToolbar {background-color: #333 !important}
#placesToolbar #organizeButton image, #placesToolbar #viewMenu image,
#placesToolbar #maintenanceButton image {filter: invert(70%) !important}
/* These change the lists background color */
#placesView, #placesView .scrollbox-innerbox,
#infoPane, #placesList, #placeContent,
/* This one changes the urlbar star bookmarking folder tree backgrund color */
#editBMPanel_folderTree {
-moz-appearance: none !important;
background: #555 !important;
color: #ddd !important}
/* These change the list header background and text colors */
#placeContent treecol {
-moz-appearance: none !important;
background: #444 !important;
padding: 3px !important;
color: #ddd !important;
border-left: 1px solid #333 !important;
border-bottom: 1px solid #333 !important}
#placeContent treecol:hover {
-moz-appearance: none !important;
background: rgba(255,255,255, 0.15) !important;
color: #fff !important}
/* This changes the right border on the left list panel */
#placesView > splitter {border-inline-end: 1px solid #333 !important}
/* These change the even rows of the lists */
#placeContent tree {background-color: var(--in-content-box-background) !important}
#placeContent treechildren::-moz-tree-row(even) {
background-image: linear-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.25)) !important}
#placeContent treechildren::-moz-tree-cell {border-right: 1px dotted rgba(0,0,0,0.4) !important}
#placeContent > splitter {border: 1px solid red !important}
/* This changes the forward and back buttons opacity when disabled */
#placesToolbar > toolbarbutton[disabled] > .toolbarbutton-icon {
opacity: .25 !important}
/* This changes the forward and back buttons color */
#back-button > .toolbarbutton-icon,
#forward-button > .toolbarbutton-icon {fill: #aaa !important; opacity: 1 !important}
/* This deletes the leftover border when clicking one of the top buttons */
#placesMenu > menu {border: none !important}
/* This changes the text color of the "clear downloads" button */
#clearDownloadsButton {color: #aaa !important}
#clearDownloadsButton[disabled] {color: #555 !important}
/* This themes the information box on the lower part of the library menu */
#detailsDeck {
background-color: var(--Window-bg) !important;
color: #aaa !important;
border-top: 1px solid #222 !important}
/* This changes the text boxes inside the library bottom information box */
#infoBox textbox, #infoBox listbox,
/* This changes the text boxes on the popup when bookmarking a page from the url box */
#editBMPanel_namePicker, #editBMPanel_tagsField,
#editBMPanel_tagsSelector, #editBMPanel_locationField,
#editBMPanel_keywordField, #searchFilter {
transition: all 0.25s ease-in-out !important;
-moz-appearance: none !important;
border: 1px solid #555 !important;
background-color: #404040 !important;
color: #ddd !important}
#editBMPanel_tagsSelector richlistitem[selected="true"] {
background-color: var(--Lists-treechildren-selected-bg) !important;
color: var(--Lists-treechildren-selected-txt) !important}
#editBMPanel_tagsSelector richlistitem[checked="true"] image {
-moz-appearance: none !important;
background: transparent url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="13px" height="13px" viewBox="0 0 14 14" ><path fill="rgb(200,200,200)" d="M 13.09,2.87 C 13.09,2.87 6.00,11.00 6.00,11.00 6.00,11.00 2.00,9.00 2.00,9.00 4.25,12.81 7.00,14.00 7.00,14.00 9.24,10.42 12.04,7.39 13.09,2.87 Z" /></svg>') no-repeat center center !important;
border: none !important}
/* This changes the input boxes of bookmark/library on focus */
#editBMPanel_namePicker:not([readonly]):focus,
#editBMPanel_tagsField:focus,
#editBMPanel_keywordField:focus,
#editBMPanel_locationField:not([readonly]):focus,
#searchFilter[focused="true"] {
box-shadow: var(--Input-field-focus-shadow) !important;
background-color: #555 !important;
color: #fff !important}
/* This changes the buttons inside the bookmarking popup at the url star */
#editBMPanel_newFolderButton, #editBookmarkPanelDoneButton,
#editBookmarkPanelRemoveButton, #tracking-action-unblock-private,
#identity-popup-popup-menulist, #tracking-action-block, #tracking-action-unblock {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #666 !important;
color: #ddd !important;
padding: 0.3em !important;
margin-top: 0.5em !important;
margin-bottom: 0.5em !important}
#editBMPanel_newFolderButton:hover,#editBookmarkPanelDoneButton:hover,
#editBookmarkPanelRemoveButton:hover, #tracking-action-unblock-private:hover,
#identity-popup-popup-menulist:hover, #tracking-action-block:hover,
#tracking-action-unblock:hover {
background: #333 !important;
color: #fff !important}
/* These change the expander buttons on the library and bookmarking popup */
#editBMPanel_folderMenuList, #editBMPanel_tagsSelectorExpander,
#editBMPanel_foldersExpander, #detailsDeck button {
-moz-appearance: none !important;
border: 1px solid #222 !important;
background: linear-gradient(#555,#333) !important;
color: #ddd !important}
#editBMPanel_folderMenuList:hover, #editBMPanel_tagsSelectorExpander:hover,
#editBMPanel_foldersExpander:hover, #detailsDeck button:hover {
background: linear-gradient(#333,#555) !important;
color: #fff !important}
#editBMPanel_folderMenuList {padding: 1px !important; color: #ddd !important}
/* These change the downloads history list background */
#downloadsRichListBox {background: #444 !important; color: #ccc !important}
/* BOOKMARK PROPERTIES WINDOW */
#bookmarkproperties {width: 55em}
/* PAGE INFORMATION WINDOW */
/* This themes the top bar and it's buttons */
#topBar, #certDetails {
background: #333 !important;
color: #ddd !important;
border-bottom: 1px solid #222 !important}
#viewGroup > radio:hover {
-moz-appearance: none !important;
background-color: rgba(255,255,255,0.15) !important;
color: #eee !important}
#viewGroup > radio[selected="true"] {
background-color: rgba(255,255,255,0.25) !important;
color: #fff !important}
/* This themes the base of the windows for all page information dialogs */
#mainDeck, #mainDeck caption, #CookiesDialog,
#SignonViewerDialog {
-moz-appearance: none !important;
background: #444 !important;
color: #ddd !important}
#mainDeck textbox, #cookieInfoBox textbox {color: #aaa !important}
#mainDeck groupbox, #cookieInfoBox {
-moz-appearance: none !important;
border: 1px solid #666 !important}
/* This changes the feeds items links */
#mainDeck richlistitem .text-link {-moz-appearance: none !important; color: #00aaff !important}
#mainDeck richlistitem .text-link:hover {-moz-appearance: none !important; color: #0ff !important}
#mainDeck richlistitem .text-link:active {-moz-appearance: none !important; color: #0050aa !important}
#mainDeck richlistitem .text-link:visited {-moz-appearance: none !important; color: #0050dd !important}
/* A fix for certificates textboxes */
#certDetails textbox {
border: none !important;
box-shadow: none !important;
background: #444 !important}
/* This changes the lists with a header on all windows related to the page info one */
#mainDeck tree, #imagecontainerbox, #brokenimagecontainer,
#mainDeck richlistbox, #certDetails tree, #removalList,
#certPrettyPrint textbox, #signonsTree {
-moz-appearance: none !important;
background: #555 !important;
color: #ddd !important;
border: 1px solid #222 !important}
#removalList > listitem {color: #fff !important}
#removalList > listitem:hover {
background: var(--Lists-treechildren-hover-bg) !important;
border: var(--Lists-treechildren-hover-border) !important}
#removalList > listitem[selected="true"], #removalList > listitem[focused="true"] {
background: var(--Lists-treechildren-selected-bg) !important;
border: var(--Lists-treechildren-selected-border) !important;
color: var(--Lists-treechildren-selected-txt) !important}
#mainDeck treechildren::-moz-tree-row(odd), #cookiesList treechildren::-moz-tree-row(odd),
#certDetails treechildren::-moz-tree-row(odd), #signonsTree treechildren::-moz-tree-row(odd) {
background-image: linear-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.25)) !important}
#nameCol, #certDetails {border: none !important}
/* These theme the header of the lists on all windows related to the page info one */
#mainDeck treecol, #cookiesList treecol, #signonsTree treecol {
-moz-appearance: none !important;
background: #333 !important;
padding: 3px !important;
color: #ddd !important;
border-right: 1px solid #222 !important;
border-bottom: 1px solid #222 !important}
#mainDeck treecol:hover, #cookiesList treecol:hover,
#signonsTree treecol:hover {
-moz-appearance: none !important;
background: rgba(255,255,255, 0.15) !important;
color: #fff !important}
#mediaPanel treecols *, #signonsTree treecols * {-moz-appearance: none !important}
#mediaPanel treecols, #signonsTree treecols {background: #333 !important}
/* This themes the buttons on the main information window */
#mainDeck button, #certDetails button {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #666 !important;
color: #ddd !important;
padding: 0.3em !important}
#mainDeck button:hover {
background: #333 !important;
color: #fff !important}
#certDetails button:hover {
background: #555 !important;
color: #fff !important}
/* This themes the permissions list */
#permList {
-moz-appearance: none !important;
border: 1px solid #222 !important;
background: #505050 !important;
color: #ddd !important}
#permList vbox:hover {
-moz-appearance: none !important;
background: rgba(0,0,0, 0.15) !important;
color: #fff !important}
/* This themes the cookies and the passwords window search box */
#CookiesDialog #filter, #SignonViewerDialog #filter {
transition: all 0.25s ease-in-out !important;
-moz-appearance: none !important;
border: 1px solid #666 !important;
background-color: #555 !important;
color: #aaa !important}
/* This themes the search box on hover */
#CookiesDialog #filter[focused="true"], #SignonViewerDialog #filter[focused="true"] {
box-shadow: var(--input-field-focus-shadow) !important;
background-color: #666 !important;
color: #fff !important}
/* This themes the buttons on the cookies and passwords window */
#CookiesDialog button, #SignonViewerDialog button {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #666 !important;
color: #ddd !important;
padding: 0.3em !important}
#CookiesDialog button:hover, #SignonViewerDialog button:hover {
background: #333 !important;
color: #fff !important}
/* These are the certificates window tabs */
#certDetails tabpanels, #certDetails tab, #printPageSetupDialog tab,
#printPageSetupDialog tabpanels {
-moz-appearance: none !important;
background: #444 !important;
color: #ddd !important;
border-left: 1px solid #555 !important;
border-right: 1px solid #555 !important}
#certDetails tab {
border-top: 1px solid #555 !important}
#certDetails tabpanels {
border-bottom: 1px solid #555 !important}
/* The certificate window text boxes*/
#certDetails tabpanels textbox {color: #aaa !important}
#verify_info_box textbox {
-moz-appearance: none !important;
background: #555 !important;
border: 1px solid #666 !important}
/* Sanitizer window */
#itemList, #sanitizeEverythingWarningBox {
-moz-appearance:none !important;
background-color: #333 !important;
border-color: transparent !important}
#itemList listitem {
color: #ccc !important}
#itemList listitem[selected="true"] {
background: #555 !important;
border-color: transparent !important}
/* AUTOCOMPLETE COLORS */
/* This changes the autocomplete popup borders */
#PopupAutoCompleteRichResult, #PopupSearchAutoComplete, #PopupAutoComplete {
border: 1px solid #222 !important}
/* Changes all autocomplete popups */
#PopupAutoComplete .autocomplete-richlistbox {
background-color: var(--Autocomplete-popup-background) !important;
color: var(--Autocomplete-popup-text-color) !important}
#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"] {
background-color: rgba(255,255,255,0.2) !important;
color: #ddd !important}
#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"]:hover {
background-color: rgba(255,255,255,0.3) !important;
color: #fff !important}
.line1-label {color: #ddd !important}
.line2-label {color: #aaa !important}
.ac-site-icon {fill: #ddd !important}
/* Changes the "Search with" label on the autocomplete popup in the URL bar and search box */
#urlbar .search-one-offs label,
#searchbar-one-offs-header-label {
color: var(--lwt-toolbar-field-color) !important}
/* Changes the color of the autocomplete links on the URL bar */
#PopupAutoCompleteRichResult .ac-url-text {
color: var(--url-autocomplete-links-color) !important}
/* Changes the color of header of the search option */
#PopupSearchAutoComplete .search-panel-current-engine {
background-color: rgba(0,0,0,0.2) !important;
color: var(--lwt-toolbar-field-color) !important}
#PopupSearchAutoComplete .search-panel-current-engine:hover {
background-color: var(--autocomplete-popup-highlight-background) !important;
color: var(--autocomplete-popup-highlight-color) !important}
/* Changes the color of search engines choices */
#PopupSearchAutoComplete .search-panel-one-offs {
background: var(--Search-engine-choices-gradient) !important}
/* Changes the color of search engine options button */
.search-setting-button {
background: #222 !important;
color: #777 !important;
border-top: 3px solid #333 !important;
border-left: 3px solid #333;
border-right: 3px solid #111;
border-bottom: 3px solid #111;}
.search-setting-button:hover {
background: #111 !important;
border-top: 3px solid #111 !important;
border-left: 3px solid #111;
border-right: 3px solid #333;
border-bottom: 3px solid #333;}
/* Changes the color of searched item on the search popup */
.search-panel-input-value {
color: var(--Searched-item-text-color) !important}
/* SIDEBAR */
/* These change the color of the sidebar */
#sidebar-header {
color: #fff !important;
background-color: var(--Sidebar-header) !important;
-moz-appearance: none !important;
border-bottom: 1px solid #111 !important}
#sidebar-search-container, #sidebar, .sidebar-placesTree {
-moz-appearance: none !important;
background-color: #333 !important;
color: #ccc !important}
.sidebar-splitter {
border-right: 2px solid #000 !important;
-moz-appearance: none !important}
treechildren::-moz-tree-separator {
border-color: #000 !important}
/* Items inside the sidebar (treechildren) are located in the general colors section of this file now */
/* This changes the sidebar searchbar */
#sidebar-search-container #search-box, .search-box {
-moz-appearance: none !important;
background-color: #222 !important;
border: 1px solid #464646 !important;
color: #fff !important}
/* Synced tabs sidebar */
#template-container, .content-header {
background-color: var(--Window-bg) !important}
.item.client > .item-title-container:first-child {
color: #fff !important}
.item-tabs-list .item-title-container {
color: #ccc !important}
.item-icon-container {fill: #fff !important}
.item-title-container:hover > .item-icon-container {fill: #fff !important}
.item-title-container:hover {
background: var(--Lists-treechildren-hover-bg) !important;
box-shadow: 0 0 0 1px var(--Lists-treechildren-hover-border) inset !important;
color: #fff !important}
.item-title-container:active > .item-icon-container,
.item.selected > .item-icon-container {fill: #fff !important}
.item-title-container:active,
.item.selected > .item-title-container {
background: var(--Lists-treechildren-selected-bg) !important;
box-shadow: 0 0 0 1px var(--Lists-treechildren-selected-border) inset !important;
color: var(--Lists-treechildren-selected-txt) !important}
.instructions {color: #ccc !important}
/* TAB READ/UNREAD COLORS */
/* You can bold the text of any tab adding "font-weight: bold !important" after their last rule, but before the "}" */
/* Selected (loaded) */
.tabbrowser-tab[selected="true"] .tab-label {
color: var(--Loaded-and-selected-text) !important;
font-style: var(--Loaded-and-selected-italic) !important;
font-weight: var(--Loaded-and-selected-bold) !important}
.tabbrowser-tab[selected="true"] .tab-content {
background-color: var(--Loaded-and-selected-background) !important;
clip-path: inset(3px 0 0 0);}
/* Loaded but unread (not selected) */
.tabbrowser-tab:not([selected="true"])[unread] .tab-label {
color: var(--Loaded-but-unread-text) !important;
font-style: var(--Loaded-but-unread-italic) !important;
font-weight: var(--Loaded-but-unread-bold) !important}
.tabbrowser-tab:not([selected="true"])[unread] .tab-content {
background-color: var(--Loaded-but-unread-background) !important}
/* Not loaded yet (also visited) */
.tabbrowser-tab:not([selected="true"])[pending] .tab-label,
.tabbrowser-tab:not([selected="true"])[visited] .tab-label {
color: var(--Not-loaded-text) !important;
font-style: var(--Not-loaded-italic) !important;
font-weight: var(--Not-loaded-bold) !important}
.tabbrowser-tab:not([selected="true"])[pending] .tab-content,
.tabbrowser-tab:not([selected="true"])[visited] .tab-content {
background-color: var(--Not-loaded-background) !important}
/* loading */
.tabbrowser-tab[busy] .tab-text.tab-label {
color: var(--Loading-text) !important;
font-style: var(--Loading-italic) !important;
font-weight: var(--Loading-bold) !important}
.tabbrowser-tab[busy] .tab-content {
background-color: var(--Loading-background) !important}
/* ADDON POPUPS */
/* This resets the color of addon popups before applying any other color (for better text readibility).
Enable this if you are having issues with some addon popup texts and you are not using addons.css file *//*
#customizationui-widget-panel .panel-arrow {fill: #fff !important}
.webextension-popup-browser {background: #fff !important}
/* Fix for the panel arrows for extensions (Only enable if using the addons file) *//*
#customizationui-widget-panel[viewId="PanelUI-webext-_b9db16a4-6edc-47ec-a1f4-b86292ed211d_-browser-action-view"] .panel-arrow,
#customizationui-widget-panel[viewId="PanelUI-webext-jid1-mnnxcxisbpnsxq_jetpack-browser-action-view"] .panel-arrow,
#customizationui-widget-panel[viewId="PanelUI-webext-s3download_statusbar-browser-action-view"] .panel-arrow {
fill: #333 !important}
#customizationui-widget-panel[viewId="PanelUI-webext-ublock0_raymondhill_net-browser-action-view"] .panel-arrow {
fill: #111 !important}
#customizationui-widget-panel[viewId="PanelUI-webext-artur_dubovoy_gmail_com-browser-action-view"] .panel-arrow {
fill: #222 !important}
#customizationui-widget-panel[viewId="PanelUI-webext-tab-session-manager_sienori-browser-action-view"] .panel-arrow {
fill: #36b2b2 !important}
*/
/* ^ COLORING PART ENDS HERE - FEATURES PART STARTS HERE v */
/* This deletes the space that comes before the min/max/close button (space where you can place addons), but
after the tabs section */
.titlebar-spacer {width: 10px !important}
/* SIDEBAR */
/* Allow sidebar to be closed completely using the slider */
#sidebar-box {overflow-x: hidden !important}
#sidebar {
min-width: 0px !important;
max-width: none !important;
overflow-x: hidden !important}
/* URL bar */
/* Resize the URL bar to a less intrusive size (unless open) */
#urlbar[breakout-extend]:not([open]) {
width: 100% !important;
top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
left: 0 !important;
height: var(--urlbar-height) !important;
}
#urlbar[breakout-extend]:not([open]) > #urlbar-input-container {
height: 100% !important;
padding-inline: 0 !important;
padding-block: 0 !important;
}
#urlbar[breakout-extend]:not([open]) > #urlbar-background {
box-shadow: none !important;
}
/* This allows you to change the font of the url to prevent ULR spoofing with a more
differentiable font (Thanks to BelladonnavGF for the tip) */
/* v Delete the "/*" after this comment to use it */
/*
#urlbar {font-family: Georgia !important}
/* TABS */
/* Tab bar below (You can set the order of each bar here. 1 for top, and 3 bottom).
Don't use this one if you are using the multirow version of tabs below */
/* #nav-bar is the ID for the URL bar, #PersonalToolbar the ID for the bookmarks bar, and
#TabsToolbar should be self-explanatory (The tabs on bottom are already set by default here) */
/* Don't change the #navigator-toolbox margin unless you want more margin on top */
/* v Delete the "/*" after this comment to use it */
/*
#nav-bar {-moz-box-ordinal-group: 2 !important}
#PersonalToolbar {-moz-box-ordinal-group: 1 !important}
#titlebar {-moz-box-ordinal-group: 3 !important}
#toolbar-menubar .titlebar-buttonbox-container {
float: right !important}
#main-window:not([sizemode="fullscreen"]) #navigator-toolbox {margin-top: 7px !important}
/* ^ Change the margin to 40px if you want to use the menu bar on top ^ */
/* This changes the menu bar on top of the screen intead of over the tab bar */
/*
#toolbar-menubar {
position: fixed !important;
width: 100% !important;
top: 5px !important;
margin-top: 7px !important}
#main-window[sizemode="fullscreen"] #toolbar-menubar {display: none !important}
#main-window:not([sizemode="fullscreen"]) #toolbar-menubar {display: block !important}
/* ^ There seems to be an issue with the "top: 0" rule inside #toolbar-menubar that would not allow fullscreen
to autohide, so it's safest to just hide it on fullscreen */
/* FULLSCREEN FIX */
/* This will enable the menu bar and bookmarks bar to appear on fullscreen. Do not enable if using bookmarks-toggle.uc.js *//*
#navigator-toolbox[inFullscreen="true"] #toolbar-menubar,
#navigator-toolbox[inFullscreen="true"] #PersonalToolbar[collapsed="false"] {visibility: visible !important}
/* ROUNDED TABS */
/* v Delete the "/*" after this comment to use it */
/*
.tab-content {
border-radius: 20px 20px 0px 0px !important;
border-image: none !important}
.tab-line {
margin-left: 12px;
margin-right: 12px}
/* TAB CLOSE BUTTON ALWAYS VISIBLE */
#TabsToolbar #tabbrowser-tabs .tabbrowser-tab:not([pinned]) .tab-close-button {
visibility: visible !important;
display: block !important}
#TabsToolbar #tabbrowser-tabs .tabbrowser-tab:not([pinned])[faviconized="true"] .tab-close-button {
visibility: collapse !important;
display: none !important}
/* MULTI-ROW BOOKMARKS TOOLBAR */
/* To use multirow bookmarks you have to delete the /* under this line */
/*
#PersonalToolbar {
max-height: unset !important}
#PlacesToolbar > hbox:first-child {
display: block}
#PlacesToolbarItems {
display: flex;
flex-wrap: wrap}
/* CONTEXT MENU COMMANDS */
/* These selectors target context menu commands so that you can hide them to make your context
menus in Firefox less cluttered with things you never or rarely use.
All of these commands are divided so that they can be explained, but they are all
part of the same rule. If you only use a few selectors, either delete the ones you want to be shown in firefox
from here, or comment out (explained in the repository in the FAQ) the ones you want to still view.
Make sure to NOT leave a comma before your last selector and the {display: none !important} rule, or none of them will apply.
*/
/* -----TABS CONTEXT MENU----- */
/* RELOAD TABS */
/* Reload tab *//*
#context_reloadTab,
/* Reload selected tabs *//*
#context_reloadSelectedTabs,
/* Reload selected tabs (title bar context menu) */
#toolbar-context-reloadSelectedTabs,
#toolbar-context-reloadSelectedTab,
/* MUTE TABS */
/* Mute tab */
#context_toggleMuteTab,
/* Mute selected tabs *//*
#context_toggleMuteSelectedTabs,
/* SELECT TABS */
/* Select all tabs */
#context_selectAllTabs,
/* Select all tabs (title bar context menu) *//*
#toolbar-context-selectAllTabs
/* PIN/UNPIN TABS */
/* Pin tab *//*
#context_pinTab,
/* Pin selected tabs *//*
#context_pinSelectedTabs,
/* Unpin tab *//*
#context_unpinTab,
/* Unpin selected tabs *//*
#context_unpinSelectedTabs,
/* OPEN/DUPLICATE/RE-OPEN TABS */
/* Duplicate tab *//*
#context_duplicateTab,
/* Duplicate selected tabs *//*
#context_duplicateTabs,
/* Open tab in new window */
#context_openTabInWindow,
/* Reopen in container *//*
#context_reopenInContainer,
/* BOOKMARK TABS */
/* Bookmark tab */
#context_bookmarkTab,
/* Bookmark selected tabs */
#context_bookmarkSelectedTabs,
/* Bookmark selected tabs (title bar context menu) */
#toolbar-context-bookmarkSelectedTab,
/* CLOSE/UNDO-CLOSE TABS */
/* Close multiple tabs *//*
#context_closeTabOptions,
/* Close all tabs to the right *//*
#context_closeTabsToTheEnd,
/* Close all other tabs *//*
#context_closeOtherTabs,
/* Close tab *//*
#context_closeTab,
/* Undo tab closing *//*
#context_undoCloseTab,
/* SEPARATORS */
/* Separator after "Duplicate tab" *//*
#context_duplicateTabs + menuseparator,
/* Separator after "Close tab" *//*
#context_closeTab + menuseparator,
/* Separator after "Send tab to device" */
#context_sendTabToDevice + menuseparator,
/* OTHER */
/* Move tab */
#context_moveTabOptions,
/* Send tab to device */
#context_sendTabToDevice,
/* -----BOOKMARK ITEMS CONTEXT MENU----- */
/* OPEN BOOKMARKS */
/* Open bookmark */
#placesContext_open,
/* Open bookmark in new tab *//*
#placesContext_open\:newtab,
/* Open bookmark in new window */
#placesContext_open\:newwindow,
/* Open bookmark in new private window */
#placesContext_open\:newprivatewindow,
/* Open all tabs in a bookmark folder & it's separator */
#placesContext_openContainer\:tabs,
#placesContext_open\:newprivatewindow[disabled="true"],
/* NEW ELEMENT */
/* Create new bookmark *//*
#placesContext_new\:bookmark,
/* Create new folder *//*
#placesContext_new\:folder,
/* Create new separator *//*
#placesContext_new\:separator,
/* EDIT ACTIONS */
/* Cut *//*
#placesContext_cut,
/* Copy *//*
#placesContext_copy,
/* Paste *//*
#placesContext_paste,
/* Delete & it's separator *//*
#placesContext_delete, #placesContext_deleteSeparator,
/* SEPARATORS (Only those with more than 1 element in their section) */
/* Separator after "Open in a new private window" */
#placesContext_openSeparator,
/* Separator after "Create new separator" *//*
#placesContext_newSeparator,
/* Separator after "Paste" *//*
#placesContext_editSeparator,
/* OTHER */
/* Sort by name & it's separator *//*
#placesContext_sortBy\:name, #placesContext_sortSeparator
/* Properties & it's separator *//*
#placesContext_show\:info, #placesContext_show\:info + menuseparator,
/* -----WEBAREA CONTEXT MENU----- */
/* NAVIGATION BUTTONS (individual) */
/* Navigation back arrow *//*
#context-back,
/* Navigation forward arrow *//*
#context-forward,
/* Navigation reload *//*
#context-reload,
/* Navigation stop reloading *//*
#context-stop,
/* Navigation bookmark this page *//*
#context-bookmarkpage,
/* NAVIGATION BUTTONS CONTAINER (All navigation buttons & it's separator) */
#context-navigation, #context-sep-navigation,
/* SAVE ELEMENT AS... */
/* Save Page As... *//*
#context-savepage,
/* Save Link As... *//*
#context-savelink,
/* Save Page to Pocket */
#context-pocket,
/* Save Link to Pocket */
#context-savelinktopocket,
/* Save image as... *//*
#context-saveimage,
/* Save video as... *//*
#context-savevideo,
/* Save video screenshot *//*
#context-video-saveimage,
/* Save audio as... *//*
#context-saveaudio,
/* COPY ELEMENT */
/* Copy link *//*
#context-copylink,
/* Copy email *//*
#context-copyemail,
/* Copy image *//*
#context-copyimage-contents,
/* Copy image location *//*
#context-copyimage,
/* Copy video location *//*
#context-copyvideourl,
/* Copy audio location *//*
#context-copyaudiourl,
/* SEND ELEMENT (via email) */
/* Send page... */
#context-sendpage,
/* Send video... */
#context-sendvideo,
/* Send image... */
#context-sendimage,
/* Send link... */
#context-sendlink,
/* SEND TAB TO DEVICE */
/* Send page to device... (including it's separator) */
#context-sendpagetodevice, #context-sep-sendpagetodevice,
/* Send link to device... (including it's separator) */
#context-sendlinktodevice, #context-sep-sendlinktodevice,
/* SEARCH ENGINE */
/* Search X on your default search engine *//*
#context-searchselect,
/* Search X on your default search engine privately */
#context-searchselect-private,
/* Add a keyword for this search... */
#context-keywordfield,
/* IMAGE RELATED */
/* Set image as desktop background... */
#context-setDesktopBackground,
/* View image Info */
#context-viewimageinfo,
/* View background image *//*
#context-viewbgimage,
/* INSPECT */
/* Inspect Element *//*
#context-inspect,
/* Inspect accessibility properties */
#context-inspect-a11y,
/* Inspect separator *//*
#inspect-separator,
/* View source code *//*
#context-viewsource,
/* View selected source code *//*
#context-viewpartialsource-selection,
/* View page info *//*
#context-viewinfo,
/* OPEN LINK IN *
/* Open link in a new tab */
#context-openlinkintab,
/* Open link in a new window */
#context-openlink,
/* Open link in a new private window */
#context-openlinkprivate,
/* Open Link in New Container Tab *//*
#context-openlinkinusercontext-menu,
/* EDIT ACTIONS */
/* Undo *//*
#context-undo,
/* Cut *//*
#context-cut,
/* Copy *//*
#context-copy,
/* Paste *//*
#context-paste,
/* Delete *//*
#context-delete,
/* IFRAME CONTEXT MENU */
/* This frame *//*
#contentAreaContextMenu #frame,
/* Show only this frame *//*
#context-showonlythisframe,
/* Open frame in a new window */
#context-openframe,
/* Reload frame & it's separator *//*
#context-reloadframe, #context-reloadframe + menuseparator,
/* Bookmark this frame */
#context-bookmarkframe,
/* Save frame as... */
#context-saveframe,
/* Separator after "Open this frame in..." actions */
#open-frame-sep,
/* Separator after "Save frame as..." */
#context-saveframe + menuseparator,
/* Print frame & it's separator */
#context-printframe, #context-printframe + menuseparator,
/* View frame source code *//*
#context-viewframesource,
/* View frame info *//*
#context-viewframeinfo,
/* SEPARATORS (Special context menus or sections with only 1 element not included here) */
/* Separator after navigation buttons *//*
#context-sep-navigation,
/* Separator after "Open link in..." commands *//*
#context-sep-open,
/* Separator after link manipulation (add to bookmarks, save link, copy link...) commands *//*
#context-sep-copylink,
/* Separator after "Copy media" section *//*
#context-sep-copyimage,
/* Separator after "Fill login" section *//*
#fill-login-and-generated-password-separator,
/* Separator afte edit actions section *//*
#context-sep-paste,
/* Separator after "Select all" *//*
#context-sep-selectall,
/* Separator before "This frame" *//*
#frame-sep,
/* MISC */
/* Bookmark this link */
#context-bookmarklink,
/* Select everything *//*
#context-selectall,
/* Fill login info *//*
#fill-login,
/* Use generated password *//*
#fill-login-generated-password,
/* Take a screenshot & it's separator *//*
#screenshots_mozilla_org-menuitem-_create-screenshot, #_context-media-eme-separator
/* Don't delete this last line */
{display: none !important}
Alles anzeigen
Hast du noch weitere Einträge in deiner userChrome.css Datei?
ja ist natürlich an, sonst würde das ja alles soweit garnicht gehen oder?^^
Ich habe bisher von dir immer nur gelesen, dass es nicht funktioniert. Oder sollte mir da etwas entgangen sein?
Hier mal die komplette userchrome.css. Was ich geändert habe, sind ein paar Farbcodes + leicht größere Googlesuchergebniss + tabs unten (von hier und dir) und deine Codes von jetzt + Lesezeichen-Ordnericontausch auf alte Icons
/* You can find an updated version here: https://github.com/Izheil/Quantum-Nox-Firefox-Dark-Full-Theme */
/* Made by Izheil */
/* Last updated: 03/10/2020 */
/* COLORING PART STARTS HERE */
/* GENERAL COLORS */
/* This root class will modify the colors of toolbar background color (by default is transparent white
without this change) */
@import url(userChrome_Fx56_bookmark_icons.css);
#main-window:not([lwt-toolbar-field-focus-brighttext]){
--toolbar-bgcolor: rgba(0,0,0,.6) !important;
/* This changes the text color of all outside elements of all toolbars */
--lwt-text-color: #fff !important;
/* You can change the lightweight theme header and footer images with this.
To use this, enable the "lightweight themes fix" below. Delete the final /* to use -> *//*
--lwt-header-image: url("file:///") !important;
--lwt-additional-images: var(--lwt-header-image) !important;
/* v Don't delete this ending bracket */
}
/* Url and search bars */
#nav-bar, #searchbar {
--lwt-toolbar-field-background-color: rgb(61,61,63) !important;
--lwt-toolbar-field-focus: rgb(71,71,73) !important;
--lwt-toolbar-field-color: #fff !important;
--lwt-toolbar-field-focus-color: var(--lwt-toolbar-field-color) !important;
--lwt-toolbar-field-border-color: #333 !important;
--toolbar-field-focus-border-color: #666 !important;
--urlbar-popup-url-color: rgb(90,170,230) !important;
--urlbar-popup-action-color: var(--urlbar-popup-url-color) !important;
--urlbar-separator-color: #666 !important;
--autocomplete-popup-highlight-background: rgba(100,100,100,0.4) !important;
--autocomplete-popup-highlight-color: #ddd !important}
/* Search panel background gradient*/
.search-panel-one-offs-container {
--Search-engine-choices-gradient: linear-gradient(90deg, rgba(4,34,74,1) 5%, rgba(22,52,132,1) 50%, rgba(4,34,74,1) 95%);}
/* Fix for some lightweight themes not working properly when set manually here (appearing with a lot of padding to the left) *//*
:root:-moz-lwtheme[lwtheme-image], #tabbrowser-tabs:not([movingtab]) > .tabbrowser-tab >
.tab-stack > .tab-background[selected="true"]:-moz-lwtheme {
background-position: left top !important}
/* This changes the background color behind tabs and the menu bar for those using the default dark theme on Windows 7. *//*
#TabsToolbar, #toolbar-menubar {
background-color: #111 !important
}
#main-menubar label {
color: #fff !important
}
/* Tab line color. Using -moz-win-accentcolor as the color value changes it to the current window color (on Windows)
but is disabled by default in this theme (Disable for the default tab line color). *//*
#tabbrowser-tabs {
--tab-line-color: #25a !important}
/* This gives a more notizable color background on hover of the close tab button */
.tab-close-button {
padding: 0 !important;
margin: auto !important}
.tab-close-button:hover {background: rgba(255,255,255,0.15) !important}
*|*:root {
/* Main menu colors */
--panel-separator-color: rgba(95,95,95, .6) !important;
--arrowpanel-background: #383838 !important;
--arrowpanel-color: #fff !important;
--panel-disabled-color: #888 !important;
--in-content-box-background: #333 !important;
--in-content-box-background-hover: #444 !important;
--arrowpanel-dimmed: rgba(100,100,105, .25) !important;
--arrowpanel-dimmed-further: rgba(100,100,105, .4) !important;
--arrowpanel-dimmed-even-further: rgba(100,100,105, .6) !important;
/* These rules will modify most highlight (background on hover) colors inside Firefox (except sidebar items, which are
in the rule below) */
--bookmark-toolbar-text: var(--lwt-text-color); /* var(--lwt-text-color) for default color of the used theme */
--nav-bar-icons-color: var(--chrome-color); /* var(--chrome-color) for default color of the used theme */
--Min-max-buttons-hover-bg: rgba(255,255,255,0.2);
--Context-menu-highlight: #25a;
--Context-menu-background: rgba(60,60,60, 1); /* The last number changes the opacity %. Change that 1 for 0.9 for semitransparent backgrounds */
--Context-menu-text-color: #fff;
--Autocomplete-popup-background: rgb(60,60,60);
--Autocomplete-popup-text-color: #fff;
--Progress-bar-color: #3070dd;
--Input-field-focus-shadow: 0 0 4px #0050ff;
--Bookmark-folder-icon: #ffe793;
--Bookmark-favicon-icon: #ddd;
--Text-selection-bg-color: #0565af;
--Text-selection-color: #fff;
--Searched-item-text-color: #0FF;
--Lists-treechildren-hover-bg: rgba(0,149,221,0.25);
--Lists-treechildren-hover-border: rgb(0,149,221);
--Lists-treechildren-selected-bg: rgba(0,120,255,0.5);
--Lists-treechildren-selected-border: #0a84ff;
--Lists-treechildren-selected-txt: #fff;
--Sidebar-header: #252525;
--Window-bg: #353535;
/* Customization page */
--toolbar-bgcolor: #303030 !important;
--toolbar-non-lwt-bgcolor: #303030 !important;
--toolbar-non-lwt-textcolor: #fff !important;
/* These ones are used for the read/unread tabs styling. For italic rules use
either "normal" or "italic" without the quotes for either no italics or using italics,
and for bold, use either "bold" or "normal" in the same way. You'll want to use semi-transparent
colors (if any) for background colors, otherwise it will show as too bright opaque colors.
Requires the use of setAttribute_unread.uc.js for unread tabs editting. */
--Loaded-and-selected-text: #eee;
--Loaded-and-selected-italic: normal;
--Loaded-and-selected-bold: normal;
--Loaded-and-selected-background: transparent;
--Loaded-but-unread-text: #fff;
--Loaded-but-unread-italic: italic;
--Loaded-but-unread-bold: normal;
--Loaded-but-unread-background: transparent;
--Not-loaded-text: #fff;
--Not-loaded-italic: italic;
--Not-loaded-bold: normal;
--Not-loaded-background: transparent;
--Loading-text: #ffffff;
--Loading-italic: normal;
--Loading-bold: normal;
--Loading-background: transparent;
}
/* These change the scrollbar color inside dialogs (not pages) */
scrollbar, *|*:root {
/* The first value changes the scrollbar thumb color, the other one the track */
scrollbar-color: #05a #252525 !important;
/* auto = default OS size | thin = half the width (will be hidden in about: pages) | none = hidden scrollbar */
scrollbar-width: auto !important;
}
/* This changes some of the tooltip colors */
tooltip {
-moz-appearance: none !important;
background: #111 !important;
color: #eee !important;
border: 1px solid #333 !important;
}
/* Highlight color on browser windows (url bar, library, search box, bookmarks properties...) */
#urlbar *|*::selection, #infoBox *|*::selection, window *|*::selection,
#editBMPanel_namePicker *|*::selection, #editBMPanel_tagsField *|*::selection,
#editBMPanel_tagsSelector *|*::selection, #placesToolbar *|*::selection,
#mainDeck *|*::selection, dialog *|*::selection, #certDetails *|*::selection,
#SignonViewerDialog *|*::selection, #CookiesDialog *|*::selection,
#searchbar *|*::selection, .findbar-textbox::selection {
/* This is the background color */
background: var(--Text-selection-bg-color) !important;
/* This is the text color */
color: var(--Text-selection-color) !important}
/* This changes the color of the sidebar panel text */
#bookmarks-view treechildren, #historyTree treechildren,
dialog richlistitem {color: var(--arrowpanel-color) !important}
/* This is a fix for treechildren that might look whiteish in linux */
treechildren::-moz-tree-row, dialog richlistitem {background: transparent !important}
/* This changes all treechildren elements highlights (list-like elements) */
treechildren::-moz-tree-row(hover), dialog richlistitem:hover {
background: var(--Lists-treechildren-hover-bg) !important;
border: 1px solid var(--Lists-treechildren-hover-border) !important}
treechildren::-moz-tree-row(selected), dialog richlistitem[selected] {
background: var(--Lists-treechildren-selected-bg) !important;
border: 1px solid var(--Lists-treechildren-selected-border) !important;
color: var(--Lists-treechildren-selected-txt) !important}
dialog richlistitem[clear-site-data-cookies-with-data] {border: 1px solid red !important}
/* v Fix to make the pre-render loading page dark instead of white v */
#tabbrowser-tabpanels {background-color: #202025 !important}
/* Tabs border color */
.tabbrowser-tab {border-right: 1px solid rgba(255,255,255, .15) !important}
/* Tabs close icon color always whiteish */
.tabbrowser-tab[selected="true"] .close-icon {fill: #ddd !important}
/* GLOW EFFECT ON TAB ICON */
/* toolbarbutton.bookmark-item:not([container=true]) .toolbarbutton-icon
for icons on the bookmarks bar under the url bar */
/* .tab-icon-image, .bookmark-item:not([container=true]) .menu-iconic-icon {
filter: drop-shadow(0 0 3px #fff);}
/* END OF GENERAL COLORS */
/* URL bar */
.searchbar-search-button, .urlbar-icon,
.search-setting-button-compact > .button-box > .button-icon {fill: var(--lwt-toolbar-field-color) !important}
#urlbar-input-container *[role="button"]:hover, #urlbar-input-container .urlbar-history-dropmarker:hover,
#urlbar-input-container *[role="button"][open], #urlbar-input-container .urlbar-history-dropmarker[open] {
background-color: var(--autocomplete-popup-highlight-background) !important}
/* Max, min and close buttons */
/* This prevents any custom windows theme to change the background color
of the minimize, maximize and close buttons */
.titlebar-min:not(:hover), .titlebar-max:not(:hover),
#main-window[sizemode="maximized"] .titlebar-max:not(:hover),
.titlebar-close:not(:hover), .titlebar-restore:not(:hover)
{background-color: transparent !important}
/* This changes the color on hover of the minimize and maximize buttons */
.titlebar-min:hover, .titlebar-max:hover,
#main-window[sizemode="maximized"] .titlebar-max:hover,
.titlebar-restore:hover
{background-color: var(--Min-max-buttons-hover-bg) !important}
/* This changes the close button hover color */
.titlebar-close:hover {background-color: #d00 !important}
/* Make tab background transparent */
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-arrowscrollbox > .tabbrowser-tab
> .tab-stack > .tab-background[multiselected="true"]:-moz-lwtheme,
#tabbrowser-tabs:not([movingtab]) > .tabbrowser-arrowscrollbox > .tabbrowser-tab
> .tab-stack > .tab-background[selected="true"]:-moz-lwtheme {
background-image: none !important;
background-color: var(--toolbar-bgcolor) !important}
/* The downloads progress bar color */
.progress-bar {
-moz-appearance: none !important;
background-color: var(--Progress-bar-color) !important}
/* Bookmark toolbar text color */
#PersonalToolbar {color: var(--bookmark-toolbar-text) !important}
/* Thinner bookmarks toolbar */
#PersonalToolbar, #PlacesToolbarItems {
margin-bottom: -1px}
/* Nav bar button color */
#nav-bar {color: var(--nav-bar-icons-color) !important}
/* Search bar inside the content area */
findbar {
background: var(--in-content-box-background) !important;
color: #ddd !important;
border-top: 1px solid #000 !important;}
:root[lwtheme-image] findbar {
--lwt-toolbar-field-background-color: var(--in-content-box-background-hover) !important;
--lwt-toolbar-field-color: #fff !important;
}
findbar .findbar-textbox {
background: var(--in-content-box-background-hover) !important;
color: #fff !important;
border-color: #000 !important}
findbar .findbar-textbox[focused="true"], findbar .findbar-textbox:hover {
border-color: Highlight !important}
.findbar-textbox[status="notfound"] {background: #f66 !important}
.findbar-textbox[flash="true"] {
background-color: yellow !important;
color: black !important}
findbar .findbar-find-previous, findbar .findbar-find-next {
background: linear-gradient(var(--in-content-box-background-hover), var(--in-content-box-background)) !important;
border-top: 1px solid #000 !important;
border-right: 1px solid #000 !important;
border-bottom: 1px solid #000 !important;
border-left: none !important}
findbar .findbar-find-previous:active, findbar .findbar-find-next:active {
background: linear-gradient(var(--in-content-box-background), var(--in-content-box-background-hover)) !important}
/* Color for most dialogs */
dialog, dialog caption, dialog select, .tabmodalprompt-buttonContainer {
-moz-appearance: none !important;
background-color: #333 !important;
color: #fff !important}
fieldset {border-color: #666 !important}
#printPageSetupDialog caption, .tabmodalprompt-mainContainer {background-color: #444 !important}
.tabmodalprompt-mainContainer {color: #fff !important}
.tabmodalprompt-mainContainer button {
-moz-appearance: none !important;
border: 1px solid #111 !important;
background: linear-gradient(var(--in-content-box-background-hover), var(--in-content-box-background)) !important;
color: #ddd !important;
padding: 2px !important}
.tabmodalprompt-mainContainer button:hover {
background: linear-gradient(var(--in-content-box-background), var(--in-content-box-background-hover)) !important;
color: #fff !important}
/* Dialog Icons */
#infoIcon, .message-icon,
.alert-icon,
.error-icon,
.question-icon {filter: invert(80%)}
/* Checkbox coloring */
checkbox .checkbox-check {
-moz-appearance: none !important;
border: 1px solid #666 !important;
background-color: #444 !important;
transition: color 0.3s;
min-width: 12px;
min-height: 12px;}
checkbox:not([disabled]):hover .checkbox-check {
box-shadow: 0 0 4px #0084ff !important;
border-color: #0084ff !important}
checkbox[checked] .checkbox-check {
background: #444 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 16 16" ><path fill="rgb(200,200,200)" d="M 13.09,2.87 C 13.09,2.87 6.00,11.00 6.00,11.00 6.00,11.00 2.00,9.00 2.00,9.00 4.25,12.81 7.00,14.00 7.00,14.00 9.24,10.42 12.04,7.39 13.09,2.87 Z" /></svg>') no-repeat center center !important}
#main-menubar .menu-iconic-left, #toolbar-context-menu .menu-iconic-left {
-moz-appearance: none !important;
width: 28px !important;
height: 16px !important}
#main-menubar .menu-iconic-left[checked="true"], #toolbar-context-menu .menu-iconic-left[checked="true"] {
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 16 16" ><path fill="rgb(200,200,200)" d="M 13.09,2.87 C 13.09,2.87 6.00,11.00 6.00,11.00 6.00,11.00 2.00,9.00 2.00,9.00 4.25,12.81 7.00,14.00 7.00,14.00 9.24,10.42 12.04,7.39 13.09,2.87 Z" /></svg>') no-repeat center center !important;
}
/* Radio button coloring */
radio .radio-check, #printPageSetupDialog radio .radio-check {
-moz-appearance: none !important;
border: 1px solid #666 !important;
list-style-image: none !important;
border-radius: 10em;
background-color: #444 !important;
transition: color 0.3s;
min-width: 12px;
min-height: 12px;}
radio:not([disabled]):hover .radio-check,
#printPageSetupDialog radio:not([disabled]):hover .radio-check {
box-shadow: 0 0 4px #0084ff !important;
border-color: #0084ff !important}
radio[selected] .radio-check, #printPageSetupDialog radio[selected] .radio-check {
background: #444 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10px" height="10px" viewBox="0 0 16 16" ><path fill="rgb(200,200,200)" d="M 6.17,3.01 C -0.84,6.78 4.35,15.22 9.89,13.22 15.68,11.20 13.99,1.10 6.17,3.01 Z" /></svg>') no-repeat center center !important}
radio[disabled], checkbox[disabled] {opacity: 0.8}
/* Select boxes coloring */
dialog menulist, #print-preview-scale, #printPageSetupDialog menulist {
-moz-appearance: none !important;
background: #444 url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M434.574 488L430.5 492.147 426.428 488 425 489.399 430.5 494.999 436 489.399z' transform='translate(-425 -488)' fill='%23cccccc' fill-rule='evenodd'/%3E%3C/svg%3E") no-repeat calc(100% - 5px) 50% !important;
padding: 3px;
color: #fff !important}
dialog menulist:hover, #print-preview-scale:hover, #printPageSetupDialog menulist:hover {
background: #252525 url("data:image/svg+xml;charset=utf-8,%3Csvg width='11' height='7' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M434.574 488L430.5 492.147 426.428 488 425 489.399 430.5 494.999 436 489.399z' transform='translate(-425 -488)' fill='%23cccccc' fill-rule='evenodd'/%3E%3C/svg%3E") no-repeat calc(100% - 5px) 50% !important;
color: #fff !important}
#printPageSetupDialog menulist {background-color: #555 !important}
#printPageSetupDialog menulist:hover {background-color: #666 !important}
dropmarker[exportparts="icon: dropmarker-icon"] {
-moz-appearance: none !important}
/* Release version dialog */
#aboutDialog {
background-color: rgb(23,25,50) !important}
/* This is aimed for notification popups */
window:not(#main-window):not(#CookiesDialog):not(#SignonViewerDialog):not(.theme-dark):not(#aboutDialog):not(.sidebar-panel) > * {
background-color: var(--Window-bg) !important;
color: #fff !important}
/* Color for most buttons */
dialog button, toolbar[printpreview="true"] button,
#print-preview-toolbar button, .dialog-button-box button{
-moz-appearance: none !important;
border-radius: 3px !important;
background-color: #555 !important;
color: #ddd !important;
padding: 2px !important}
dialog button:hover, toolbar[printpreview="true"] button:hover,
#print-preview-toolbar button:hover, .dialog-button-box button:hover {
background-color: #222 !important;
color: #fff !important}
/* This changes the missing dialog buttons */
.dialog-button, .wizard-button {
-moz-appearance: none !important;
background: #444 !important;
color: #fff !important;
padding: 2px 0px;
transition: all 0.15s ease-in-out}
.dialog-button[disabled], .wizard-button[disabled] {
opacity: 0.7}
.dialog-button:not([disabled]):hover, .wizard-button:not([disabled]):hover {
background: #555 !important;
color: #fff !important}
.dialog-button:not([disabled]):active, .wizard-button:not([disabled]):active {
background: #222 !important;
color: #fff !important}
/* Migration dialog header */
.wizard-header {
background: #222 !important;
color: #fff !important;
border-color: #000 !important}
/* Textboxes colors */
dialog textbox, toolbar[printpreview="true"] textbox, #printPageSetupDialog input {
transition: all 0.25s ease-in-out !important;
-moz-appearance: none !important;
border: 1px solid #666 !important;
background-color: #555 !important;
color: #fff !important}
dialog textbox[focused="true"], toolbar[printpreview="true"] textbox[focused="true"],
#printPageSetupDialog input:focus {
box-shadow: var(--Input-field-focus-shadow) !important;
background-color: #666 !important;
color: #fff !important}
/* CUSTOMIZATION PAGE */
/* The windows default theme colors will mainly affect the customizing page (when
you aren't using the default dark theme of mozilla, that is) */
/* The customization page button colors */
.customizationmode-button {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #555 !important;
color: #ddd !important;
border: none !important}
.customizationmode-button:hover {
background: #444 !important;
color: #fff !important}
.customization-lwtheme-menu-footeritem {
border-right: 1px solid #222 !important;
background: linear-gradient(#555,#333) !important;
color: #ddd !important}
.customization-lwtheme-menu-footeritem:hover {
background: linear-gradient(#333,#555) !important;
color: #fff !important}
.button-menu-dropmarker .dropmarker-icon {filter: invert(75%) !important}
#customization-done-button {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #2050AA !important;
color: #fff !important;
border: none !important}
#customization-done-button:hover {
background: #1040A0 !important}
#customization-lwtheme-menu-footer {border-top: none !important}
/* This is a fix for systems with a custom OS theme */
.customizationmode-button {padding: 0.5em !important}
#customization-done-button {padding: 0.5em 3em 0.5em 3em !important}
/* CONTEXT MENUS */
/* Shortcut comments on main menu text color */
.subviewbutton[shortcut]::after, .subviewbutton[shortcut]::after,
.PanelUI-subView .subviewbutton-nav::after,
#appMenu-tp-category {color: var(--panel-disabled-color) !important}
/* Zoom reset button on the main menu */
#appMenu-zoomReset-button {background-color: var(--arrowpanel-dimmed) !important}
#appMenu-zoomReset-button:hover {background-color: rgba(0,0,0,0.1) !important}
#appMenu-zoomReset-button:active {background-color: rgba(0,0,0,0.3) !important}
/* This one changes the letters color of all context menus */
menu, menuitem, window menuitem {
color: var(--Context-menu-text-color) !important;
-moz-appearance: none !important}
/* Padding for all menu items (do NOT change unless you want an spaced or indented upon
selection effect). The open in tabs bookmark item is added here since it also needs the
padding that we remove in the next rule */
menuitem, .bookmark-item .openintabs-menuitem,
menupopup > menu {
padding-top: 1px !important;
padding-bottom: 1px !important}
#main-menubar menuitem, #main-menubar menu, menupopup > menuitem,
#placesToolbar #organizeButton > *, #placesToolbar #viewMenu > *,
#placesToolbar #maintenanceButton > * {
padding-top: 2px !important;
padding-bottom: 2px !important}
/* This removes the unnecesary padding from the bookmark items */
.bookmark-item menupopup:not([emptyplacesresult="true"]) menuitem {
padding-top: 0px !important;
padding-bottom: 0px !important}
.bookmark-item menupopup[emptyplacesresult="true"] menuitem {
min-height: 25px !important;
}
/* This changes the color on hover of the context-menu items */
menubar > menu[_moz-menuactive="true"],
menupopup > menu[_moz-menuactive="true"],
popup > menu[_moz-menuactive="true"],
menuitem[_moz-menuactive="true"]
{background-color: var(--Context-menu-highlight) !important}
/* This does the same but for disabled ones */
menubar > menu[_moz-menuactive="true"][disabled="true"],
menupopup > menu[_moz-menuactive="true"][disabled="true"],
popup > menu[_moz-menuactive="true"][disabled="true"],
menuitem[_moz-menuactive="true"][disabled="true"]
{background-color: rgba(0,0,0,0.3) !important}
/* This changes the text color of the greyed out actions on the context menus */
menuitem[disabled="true"], popup > menu[disabled="true"],
menupopup > menu[disabled="true"], menubar > menu[disabled="true"]{color: #777 !important}
/* This one applies to all context menus (If you want to theme the browser this one is better instead
of going one by one) */
menupopup:not(.PanelUI-subView) {
background-color: var(--Context-menu-background) !important}
/* The following code changes the borders of all the context menus (except the ones above mentioned),
as well as ignoring the bookmark menu context menu */
menupopup:not(.PanelUI-subView) {
-moz-appearance: none !important;
border: 1px solid #555 !important}
/* Context menu separator color override */
menuseparator {
-moz-appearance: none !important;
margin: 1px 0 1px 2.3em !important;
height: 1px !important;
border: none !important;
background: #555 !important;
padding: 0 !important}
/* Context menu navigation tools (back, forward, reload) background color */
#context-navigation {
-moz-appearance: none !important;
background-color: var(--Context-menu-background) !important;
padding-bottom: 0px !important}
/* This removes the borders for the bookmark menu button next to the url bar */
#BMB_bookmarksPopup, #BMB_bookmarksPopup menupopup {border: none !important}
/* This changes the text color of the hint text on the bookmarks popup menu */
.menu-accel-container .menu-iconic-accel {color: #808080 !important}
.menu-accel-container .menu-accel {color: #909090 !important}
/* Bookmark context menu > icon color and popup allow > icon color */
.bookmark-item .menu-right, menu .menu-right,
#identity-popup-popup-menulist .menulist-dropmarker {filter: brightness(300%) !important}
/* Drop indicator that appears when moving a bookmark in a bookmark folder color */
menupopup::part(drop-indicator) {background-color: #5af !important}
/* Color of default icons on bookmark bar and bookmark popup (folder icons mainly) */
.bookmark-item > .toolbarbutton-icon[type="menu"],
.bookmark-item[container="true"] .menu-iconic-icon {fill: var(--Bookmark-folder-icon) !important}
/* Color of default icons on bookmark bar and bookmark popup (world icon, aka not-favicon-found icon) */
.bookmark-item[scheme="http"], .bookmark-item[scheme="http"] .menu-iconic-icon {fill: var(--Bookmark-favicon-icon) !important}
/* Other colors of the bookmark popup */
.panel-header,
#identity-popup-mainView-panel-header {background-color: rgba(0,0,0,0.2) !important}
#editBookmarkPanelBottomButtons.panel-footer {background-color: #444 !important}
/* Remove cookies headers on url bar popup */
.identity-popup-cookiesView-list-header {color: #ddd !important}
#identity-popup-content-blocking-detected, .identity-popup-content-blocking-empty-label,
#identity-popup-permission-empty-hint {color: #aaa !important}
/* Fix for the space above the "save as" option after the navigation buttons have been eliminated. Change
if necessary depending on if you are using a custom OS theme (which may mess up the padding of the separators) */
#context-savepage {padding-top: 3px !important}
/* Protections popup text */
#protections-popup-category-list description[role="heading"] {
color: var(--arrowpanel-color) !important}
.text-link, .protections-popup-category,
#protections-popup-trackers-blocked-counter-description {
color: var(--panel-disabled-color) !important}
/* LIBRARY MENU */
/* These change top bar background color */
#placesToolbar {background-color: #333 !important}
#placesToolbar #organizeButton image, #placesToolbar #viewMenu image,
#placesToolbar #maintenanceButton image {filter: invert(70%) !important}
/* These change the lists background color */
#placesView, #placesView .scrollbox-innerbox,
#infoPane, #placesList, #placeContent,
/* This one changes the urlbar star bookmarking folder tree backgrund color */
#editBMPanel_folderTree {
-moz-appearance: none !important;
background: #555 !important;
color: #ddd !important}
/* These change the list header background and text colors */
#placeContent treecol {
-moz-appearance: none !important;
background: #444 !important;
padding: 3px !important;
color: #ddd !important;
border-left: 1px solid #333 !important;
border-bottom: 1px solid #333 !important}
#placeContent treecol:hover {
-moz-appearance: none !important;
background: rgba(255,255,255, 0.15) !important;
color: #fff !important}
/* This changes the right border on the left list panel */
#placesView > splitter {border-inline-end: 1px solid #333 !important}
/* These change the even rows of the lists */
#placeContent tree {background-color: var(--in-content-box-background) !important}
#placeContent treechildren::-moz-tree-row(even) {
background-image: linear-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.25)) !important}
#placeContent treechildren::-moz-tree-cell {border-right: 1px dotted rgba(0,0,0,0.4) !important}
#placeContent > splitter {border: 1px solid red !important}
/* This changes the forward and back buttons opacity when disabled */
#placesToolbar > toolbarbutton[disabled] > .toolbarbutton-icon {
opacity: .25 !important}
/* This changes the forward and back buttons color */
#back-button > .toolbarbutton-icon,
#forward-button > .toolbarbutton-icon {fill: #aaa !important; opacity: 1 !important}
/* This deletes the leftover border when clicking one of the top buttons */
#placesMenu > menu {border: none !important}
/* This changes the text color of the "clear downloads" button */
#clearDownloadsButton {color: #aaa !important}
#clearDownloadsButton[disabled] {color: #555 !important}
/* This themes the information box on the lower part of the library menu */
#detailsDeck {
background-color: var(--Window-bg) !important;
color: #aaa !important;
border-top: 1px solid #222 !important}
/* This changes the text boxes inside the library bottom information box */
#infoBox textbox, #infoBox listbox,
/* This changes the text boxes on the popup when bookmarking a page from the url box */
#editBMPanel_namePicker, #editBMPanel_tagsField,
#editBMPanel_tagsSelector, #editBMPanel_locationField,
#editBMPanel_keywordField, #searchFilter {
transition: all 0.25s ease-in-out !important;
-moz-appearance: none !important;
border: 1px solid #555 !important;
background-color: #404040 !important;
color: #ddd !important}
#editBMPanel_tagsSelector richlistitem[selected="true"] {
background-color: var(--Lists-treechildren-selected-bg) !important;
color: var(--Lists-treechildren-selected-txt) !important}
#editBMPanel_tagsSelector richlistitem[checked="true"] image {
-moz-appearance: none !important;
background: transparent url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="13px" height="13px" viewBox="0 0 14 14" ><path fill="rgb(200,200,200)" d="M 13.09,2.87 C 13.09,2.87 6.00,11.00 6.00,11.00 6.00,11.00 2.00,9.00 2.00,9.00 4.25,12.81 7.00,14.00 7.00,14.00 9.24,10.42 12.04,7.39 13.09,2.87 Z" /></svg>') no-repeat center center !important;
border: none !important}
/* This changes the input boxes of bookmark/library on focus */
#editBMPanel_namePicker:not([readonly]):focus,
#editBMPanel_tagsField:focus,
#editBMPanel_keywordField:focus,
#editBMPanel_locationField:not([readonly]):focus,
#searchFilter[focused="true"] {
box-shadow: var(--Input-field-focus-shadow) !important;
background-color: #555 !important;
color: #fff !important}
/* This changes the buttons inside the bookmarking popup at the url star */
#editBMPanel_newFolderButton, #editBookmarkPanelDoneButton,
#editBookmarkPanelRemoveButton, #tracking-action-unblock-private,
#identity-popup-popup-menulist, #tracking-action-block, #tracking-action-unblock {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #666 !important;
color: #ddd !important;
padding: 0.3em !important;
margin-top: 0.5em !important;
margin-bottom: 0.5em !important}
#editBMPanel_newFolderButton:hover,#editBookmarkPanelDoneButton:hover,
#editBookmarkPanelRemoveButton:hover, #tracking-action-unblock-private:hover,
#identity-popup-popup-menulist:hover, #tracking-action-block:hover,
#tracking-action-unblock:hover {
background: #333 !important;
color: #fff !important}
/* These change the expander buttons on the library and bookmarking popup */
#editBMPanel_folderMenuList, #editBMPanel_tagsSelectorExpander,
#editBMPanel_foldersExpander, #detailsDeck button {
-moz-appearance: none !important;
border: 1px solid #222 !important;
background: linear-gradient(#555,#333) !important;
color: #ddd !important}
#editBMPanel_folderMenuList:hover, #editBMPanel_tagsSelectorExpander:hover,
#editBMPanel_foldersExpander:hover, #detailsDeck button:hover {
background: linear-gradient(#333,#555) !important;
color: #fff !important}
#editBMPanel_folderMenuList {padding: 1px !important; color: #ddd !important}
/* These change the downloads history list background */
#downloadsRichListBox {background: #444 !important; color: #fff !important}
/* BOOKMARK PROPERTIES WINDOW */
#bookmarkproperties {width: 55em}
/* PAGE INFORMATION WINDOW */
/* This themes the top bar and it's buttons */
#topBar, #certDetails {
background: #333 !important;
color: #ddd !important;
border-bottom: 1px solid #222 !important}
#viewGroup > radio:hover {
-moz-appearance: none !important;
background-color: rgba(255,255,255,0.15) !important;
color: #eee !important}
#viewGroup > radio[selected="true"] {
background-color: rgba(255,255,255,0.25) !important;
color: #fff !important}
/* This themes the base of the windows for all page information dialogs */
#mainDeck, #mainDeck caption, #CookiesDialog,
#SignonViewerDialog {
-moz-appearance: none !important;
background: #444 !important;
color: #ddd !important}
#mainDeck textbox, #cookieInfoBox textbox {color: #aaa !important}
#mainDeck groupbox, #cookieInfoBox {
-moz-appearance: none !important;
border: 1px solid #666 !important}
/* This changes the feeds items links */
#mainDeck richlistitem .text-link {-moz-appearance: none !important; color: #00aaff !important}
#mainDeck richlistitem .text-link:hover {-moz-appearance: none !important; color: #0ff !important}
#mainDeck richlistitem .text-link:active {-moz-appearance: none !important; color: #0050aa !important}
#mainDeck richlistitem .text-link:visited {-moz-appearance: none !important; color: #0050dd !important}
/* A fix for certificates textboxes */
#certDetails textbox {
border: none !important;
box-shadow: none !important;
background: #444 !important}
/* This changes the lists with a header on all windows related to the page info one */
#mainDeck tree, #imagecontainerbox, #brokenimagecontainer,
#mainDeck richlistbox, #certDetails tree, #removalList,
#certPrettyPrint textbox, #signonsTree {
-moz-appearance: none !important;
background: #555 !important;
color: #ddd !important;
border: 1px solid #222 !important}
#removalList > listitem {color: #fff !important}
#removalList > listitem:hover {
background: var(--Lists-treechildren-hover-bg) !important;
border: var(--Lists-treechildren-hover-border) !important}
#removalList > listitem[selected="true"], #removalList > listitem[focused="true"] {
background: var(--Lists-treechildren-selected-bg) !important;
border: var(--Lists-treechildren-selected-border) !important;
color: var(--Lists-treechildren-selected-txt) !important}
#mainDeck treechildren::-moz-tree-row(odd), #cookiesList treechildren::-moz-tree-row(odd),
#certDetails treechildren::-moz-tree-row(odd), #signonsTree treechildren::-moz-tree-row(odd) {
background-image: linear-gradient(rgba(0,0,0,0.25), rgba(0,0,0,0.25)) !important}
#nameCol, #certDetails {border: none !important}
/* These theme the header of the lists on all windows related to the page info one */
#mainDeck treecol, #cookiesList treecol, #signonsTree treecol {
-moz-appearance: none !important;
background: #333 !important;
padding: 3px !important;
color: #ddd !important;
border-right: 1px solid #222 !important;
border-bottom: 1px solid #222 !important}
#mainDeck treecol:hover, #cookiesList treecol:hover,
#signonsTree treecol:hover {
-moz-appearance: none !important;
background: rgba(255,255,255, 0.15) !important;
color: #fff !important}
#mediaPanel treecols *, #signonsTree treecols * {-moz-appearance: none !important}
#mediaPanel treecols, #signonsTree treecols {background: #333 !important}
/* This themes the buttons on the main information window */
#mainDeck button, #certDetails button {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #666 !important;
color: #ddd !important;
padding: 0.3em !important}
#mainDeck button:hover {
background: #333 !important;
color: #fff !important}
#certDetails button:hover {
background: #555 !important;
color: #fff !important}
/* This themes the permissions list */
#permList {
-moz-appearance: none !important;
border: 1px solid #222 !important;
background: #505050 !important;
color: #ddd !important}
#permList vbox:hover {
-moz-appearance: none !important;
background: rgba(0,0,0, 0.15) !important;
color: #fff !important}
/* This themes the cookies and the passwords window search box */
#CookiesDialog #filter, #SignonViewerDialog #filter {
transition: all 0.25s ease-in-out !important;
-moz-appearance: none !important;
border: 1px solid #666 !important;
background-color: #555 !important;
color: #aaa !important}
/* This themes the search box on hover */
#CookiesDialog #filter[focused="true"], #SignonViewerDialog #filter[focused="true"] {
box-shadow: var(--input-field-focus-shadow) !important;
background-color: #666 !important;
color: #fff !important}
/* This themes the buttons on the cookies and passwords window */
#CookiesDialog button, #SignonViewerDialog button {
-moz-appearance: none !important;
border-radius: 3px !important;
background: #666 !important;
color: #ddd !important;
padding: 0.3em !important}
#CookiesDialog button:hover, #SignonViewerDialog button:hover {
background: #333 !important;
color: #fff !important}
/* These are the certificates window tabs */
#certDetails tabpanels, #certDetails tab, #printPageSetupDialog tab,
#printPageSetupDialog tabpanels {
-moz-appearance: none !important;
background: #444 !important;
color: #ddd !important;
border-left: 1px solid #555 !important;
border-right: 1px solid #555 !important}
#certDetails tab {
border-top: 1px solid #555 !important}
#certDetails tabpanels {
border-bottom: 1px solid #555 !important}
/* The certificate window text boxes*/
#certDetails tabpanels textbox {color: #aaa !important}
#verify_info_box textbox {
-moz-appearance: none !important;
background: #555 !important;
border: 1px solid #666 !important}
/* Sanitizer window */
#itemList, #sanitizeEverythingWarningBox {
-moz-appearance:none !important;
background-color: #333 !important;
border-color: transparent !important}
#itemList listitem {
color: #fff !important}
#itemList listitem[selected="true"] {
background: #555 !important;
border-color: transparent !important}
/* AUTOCOMPLETE COLORS */
/* This changes the autocomplete popup borders */
#PopupAutoCompleteRichResult, #PopupSearchAutoComplete, #PopupAutoComplete {
border: 1px solid #222 !important}
/* Changes all autocomplete popups */
#PopupAutoComplete .autocomplete-richlistbox {
background-color: var(--Autocomplete-popup-background) !important;
color: var(--Autocomplete-popup-text-color) !important}
#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"] {
background-color: rgba(255,255,255,0.2) !important;
color: #ddd !important}
#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"]:hover {
background-color: rgba(255,255,255,0.3) !important;
color: #fff !important}
.line1-label {color: #ddd !important}
.line2-label {color: #aaa !important}
.ac-site-icon {fill: #ddd !important}
/* Changes the "Search with" label on the autocomplete popup in the URL bar and search box */
#urlbar .search-one-offs label,
#searchbar-one-offs-header-label {
color: var(--lwt-toolbar-field-color) !important}
/* Changes the color of the autocomplete links on the URL bar */
#PopupAutoCompleteRichResult .ac-url-text {
color: var(--url-autocomplete-links-color) !important}
/* Changes the color of header of the search option */
#PopupSearchAutoComplete .search-panel-current-engine {
background-color: rgba(0,0,0,0.2) !important;
color: var(--lwt-toolbar-field-color) !important}
#PopupSearchAutoComplete .search-panel-current-engine:hover {
background-color: var(--autocomplete-popup-highlight-background) !important;
color: var(--autocomplete-popup-highlight-color) !important}
/* Changes the color of search engines choices */
#PopupSearchAutoComplete .search-panel-one-offs {
background: var(--Search-engine-choices-gradient) !important}
/* Changes the color of search engine options button */
.search-setting-button {
background: #222 !important;
color: #777 !important;
border-top: 3px solid #333 !important;
border-left: 3px solid #333;
border-right: 3px solid #111;
border-bottom: 3px solid #111;}
.search-setting-button:hover {
background: #111 !important;
border-top: 3px solid #111 !important;
border-left: 3px solid #111;
border-right: 3px solid #333;
border-bottom: 3px solid #333;}
/* Changes the color of searched item on the search popup */
.search-panel-input-value {
color: var(--Searched-item-text-color) !important}
/* SIDEBAR */
/* These change the color of the sidebar */
#sidebar-header {
color: #fff !important;
background-color: var(--Sidebar-header) !important;
-moz-appearance: none !important;
border-bottom: 1px solid #111 !important}
#sidebar-search-container, #sidebar, .sidebar-placesTree {
-moz-appearance: none !important;
background-color: #333 !important;
color: #fff !important}
.sidebar-splitter {
border-right: 2px solid #000 !important;
-moz-appearance: none !important}
treechildren::-moz-tree-separator {
border-color: #000 !important}
/* Items inside the sidebar (treechildren) are located in the general colors section of this file now */
/* This changes the sidebar searchbar */
#sidebar-search-container #search-box, .search-box {
-moz-appearance: none !important;
background-color: #222 !important;
border: 1px solid #464646 !important;
color: #fff !important}
/* Synced tabs sidebar */
#template-container, .content-header {
background-color: var(--Window-bg) !important}
.item.client > .item-title-container:first-child {
color: #fff !important}
.item-tabs-list .item-title-container {
color: #fff !important}
.item-icon-container {fill: #fff !important}
.item-title-container:hover > .item-icon-container {fill: #fff !important}
.item-title-container:hover {
background: var(--Lists-treechildren-hover-bg) !important;
box-shadow: 0 0 0 1px var(--Lists-treechildren-hover-border) inset !important;
color: #fff !important}
.item-title-container:active > .item-icon-container,
.item.selected > .item-icon-container {fill: #fff !important}
.item-title-container:active,
.item.selected > .item-title-container {
background: var(--Lists-treechildren-selected-bg) !important;
box-shadow: 0 0 0 1px var(--Lists-treechildren-selected-border) inset !important;
color: var(--Lists-treechildren-selected-txt) !important}
.instructions {color: #fff !important}
/* TAB READ/UNREAD COLORS */
/* You can bold the text of any tab adding "font-weight: bold !important" after their last rule, but before the "}" */
/* Selected (loaded) */
.tabbrowser-tab[selected="true"] .tab-label {
color: var(--Loaded-and-selected-text) !important;
font-style: var(--Loaded-and-selected-italic) !important;
font-weight: var(--Loaded-and-selected-bold) !important}
.tabbrowser-tab[selected="true"] .tab-content {
background-color: var(--Loaded-and-selected-background) !important;
clip-path: inset(3px 0 0 0);}
/* Loaded but unread (not selected) */
.tabbrowser-tab:not([selected="true"])[unread] .tab-label {
color: var(--Loaded-but-unread-text) !important;
font-style: var(--Loaded-but-unread-italic) !important;
font-weight: var(--Loaded-but-unread-bold) !important}
.tabbrowser-tab:not([selected="true"])[unread] .tab-content {
background-color: var(--Loaded-but-unread-background) !important}
/* Not loaded yet (also visited) */
.tabbrowser-tab:not([selected="true"])[pending] .tab-label,
.tabbrowser-tab:not([selected="true"])[visited] .tab-label {
color: var(--Not-loaded-text) !important;
font-style: var(--Not-loaded-italic) !important;
font-weight: var(--Not-loaded-bold) !important}
.tabbrowser-tab:not([selected="true"])[pending] .tab-content,
.tabbrowser-tab:not([selected="true"])[visited] .tab-content {
background-color: var(--Not-loaded-background) !important}
/* loading */
.tabbrowser-tab[busy] .tab-text.tab-label {
color: var(--Loading-text) !important;
font-style: var(--Loading-italic) !important;
font-weight: var(--Loading-bold) !important}
.tabbrowser-tab[busy] .tab-content {
background-color: var(--Loading-background) !important}
/* ADDON POPUPS */
/* This resets the color of addon popups before applying any other color (for better text readibility).
Enable this if you are having issues with some addon popup texts and you are not using addons.css file *//*
#customizationui-widget-panel .panel-arrow {fill: #fff !important}
.webextension-popup-browser {background: #fff !important}
/* Fix for the panel arrows for extensions (Only enable if using the addons file) *//*
#customizationui-widget-panel[viewId="PanelUI-webext-_b9db16a4-6edc-47ec-a1f4-b86292ed211d_-browser-action-view"] .panel-arrow,
#customizationui-widget-panel[viewId="PanelUI-webext-jid1-mnnxcxisbpnsxq_jetpack-browser-action-view"] .panel-arrow,
#customizationui-widget-panel[viewId="PanelUI-webext-s3download_statusbar-browser-action-view"] .panel-arrow {
fill: #333 !important}
#customizationui-widget-panel[viewId="PanelUI-webext-ublock0_raymondhill_net-browser-action-view"] .panel-arrow {
fill: #111 !important}
#customizationui-widget-panel[viewId="PanelUI-webext-artur_dubovoy_gmail_com-browser-action-view"] .panel-arrow {
fill: #222 !important}
#customizationui-widget-panel[viewId="PanelUI-webext-tab-session-manager_sienori-browser-action-view"] .panel-arrow {
fill: #36b2b2 !important}
*/
/* Disables resizing of the URLbar completely */
#urlbar[breakout-extend] {
width: 100% !important;
top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
left: 0 !important;
}
#urlbar[breakout-extend] > #urlbar-input-container {
min-height: var(--urlbar-height) !important;
height: 100% !important;
padding-inline: 0 !important;
padding-block: 0 !important;
}
#urlbar[breakout-extend] > #urlbar-background {
box-shadow: none !important;
}
.searchbar-search-button[addengines="true"] > .searchbar-search-icon-overlay { display: none; }
.tab-line { display: none !important; }
/* Enlarge Search Bar Suggestions */
#PopupSearchAutoComplete .autocomplete-richlistbox {
font-size: 1.1em !important;
}
/* Statusleiste unten Aussehen */
#statuspanel {
-moz-box-ordinal-group: 100 !important;
border: none !important;
margin-top: -30px !important;
}
#statuspanel-label {
margin-bottom: -20px !important;
border: none !important;
background: transparent !important;
}
/* Tabs unter Lesezeichen */
@-moz-document url(chrome://browser/content/browser.xhtml) {
#TabsToolbar {
position: absolute !important;
display:block !important;
bottom: 0 !important;
width: 100vw !important;
}
#tabbrowser-tabs {
width: 100vw !important;
}
#main-window:not([chromehidden*="toolbar"]) #navigator-toolbox {
padding-bottom: var(--tab-min-height) !important;
}
:root {
--tab-min-height: 35px !important;
}
:root #tabbrowser-tabs {
--tab-min-height: 35px !important;
}
}
Alles anzeigen
css von der Lesezeichenänderung
/* Updated: Sept. 12, 2019 (for Firefox 69)
Classic bookmark folder, smart folder, and live mark icons for Quantum
Incorporate this file into userChrome.css by adding this on the top line:
@import url(userChrome_Fx56_bookmark_icons.css);
*/
/* Standard folder -- on Toolbar and Menus */
#PlacesToolbarItems toolbarbutton[container="true"] > .toolbarbutton-icon,
#PlacesToolbarItems menu[container="true"] .menu-iconic-left,
:-moz-any(
#PlacesToolbarItems,
#PlacesChevronPopup,
#BMB_bookmarksPopup,
#bookmarksMenu) menu[container="true"]:not([tagContainer="true"]) > .menu-iconic-left,
/* Standard folder -- in Sidebar, Library, Add/Edit Bookmark dialog */
:-moz-any(
#bookmarks-view,
#editBMPanel_folderTree,
#placesList) treechildren::-moz-tree-image(container),
#editBMPanel_folderMenuList > .menulist-label-box > .menulist-icon,
#editBMPanel_folderMenuList menupopup menuitem {
list-style-image: url(Fx56-yellow-folder.png) !important;
}
/* THIS WAS REMOVED BECAUSE IT CAUSES YELLOW FOLDER ICONS FOR BLANK
COLUMNS. AS A RESULT, FOLDERS ON THE RIGHT SIDE REMAIN GRAY.
#placeContent treechildren::-moz-tree-image(container) {
list-style-image: url(Fx56-yellow-folder.png) !important;
}
*/
/* Live Bookmark -- on Toolbar and Menus */ /* REMOVED */
/* Smart bookmark folder -- on Toolbar and Menus */
#PlacesToolbarItems toolbarbutton[container="true"][query="true"] > .toolbarbutton-icon,
#PlacesToolbarItems menu[container="true"][query="true"] .menu-iconic-left,
:-moz-any(
#PlacesToolbarItems,
#PlacesChevronPopup,
#BMB_bookmarksPopup,
#bookmarksMenu) menu[container="true"][query="true"]:not([tagContainer="true"]) > .menu-iconic-left > .menu-iconic-icon,
/* Smart bookmark folder -- in Sidebar, Library, Add/Edit Bookmark dialog */
:-moz-any(
#bookmarks-view,
#editBMPanel_folderTree,
#placesList,
#placeContent) treechildren::-moz-tree-image(container, query) {
list-style-image: url(Fx56-query.png) !important;
}
/* Tag containers (preserve the built-in icon) */
#PlacesToolbarItems toolbarbutton[container="true"][tagContainer="true"] > .toolbarbutton-icon,
#PlacesToolbarItems menu[container="true"][tagContainer="true"] .menu-iconic-left,
:-moz-any(
#PlacesToolbarItems,
#PlacesChevronPopup,
#BMB_bookmarksPopup,
#bookmarksMenu) menu[container="true"][tagContainer="true"] > .menu-iconic-left > .menu-iconic-icon,
/* Smart bookmark folder -- in Sidebar, Library, Add/Edit Bookmark dialog */
:-moz-any(
#bookmarks-view,
#editBMPanel_folderTree,
#placesList,
#placeContent) treechildren::-moz-tree-image(container, query, tagContainer) {
list-style-image: url(chrome://browser/skin/places/tag.svg) !important;
}
/*** Top-level "container" icons (otherwise would be Standard folder color) ***/
/* Bookmarks Menu -- in Sidebar, Library, Add/Edit Bookmark dialog */
:-moz-any(
#bookmarks-view,
#editBMPanel_folderTree,
#placesList,
#placeContent) treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksMenu),
:-moz-any(
#bookmarks-view,
#editBMPanel_folderTree,
#placesList,
#placeContent) treechildren::-moz-tree-image(container, queryFolder_menu________),
#editBMPanel_bmRootItem > .menu-iconic-left,
#editBMPanel_folderMenuList[selectedIndex="1"] > .menulist-label-box > .menulist-icon {
list-style-image: url(Fx56-bookmarksMenu.png) !important;
}
/* Bookmarks Toolbar -- on Menus */
#BMB_bookmarksPopup #BMB_bookmarksToolbar > .menu-iconic-left > .menu-iconic-icon,
#bookmarksMenuPopup #bookmarksToolbarFolderMenu > .menu-iconic-left > .menu-iconic-icon,
/* Bookmarks Toolbar -- in Sidebar, Library, Add/Edit Bookmark dialog */
:-moz-any(
#bookmarks-view,
#editBMPanel_folderTree,
#placesList,
#placeContent) treechildren::-moz-tree-image(container, OrganizerQuery_BookmarksToolbar),
:-moz-any(
#bookmarks-view,
#editBMPanel_folderTree,
#placesList,
#placeContent) treechildren::-moz-tree-image(container, queryFolder_toolbar_____),
#editBMPanel_toolbarFolderItem > .menu-iconic-left,
#editBMPanel_folderMenuList[selectedIndex="0"] > .menulist-label-box > .menulist-icon {
list-style-image: url(Fx56-bookmarksToolbar.png) !important;
}
/* Other Bookmarks -- on Menus */
#BMB_bookmarksPopup #BMB_unsortedBookmarks > .menu-iconic-left > .menu-iconic-icon,
#bookmarksMenuPopup #menu_unsortedBookmarks > .menu-iconic-left > .menu-iconic-icon,
/* Other Bookmarks -- in Sidebar, Library, Add/Edit Bookmark dialog */
:-moz-any(
#bookmarks-view,
#editBMPanel_folderTree,
#placesList,
#placeContent) treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks),
:-moz-any(
#bookmarks-view,
#editBMPanel_folderTree,
#placesList,
#placeContent) treechildren::-moz-tree-image(container, queryFolder_unfiled_____),
#editBMPanel_unfiledRootItem > .menu-iconic-left,
#editBMPanel_folderMenuList[selectedIndex="2"] > .menulist-label-box > .menulist-icon {
list-style-image: url(Fx56-unsortedBookmarks.png) !important;
}
/* Preserve Built-in History/Tags/All Bookmarks Icons in Library */
:-moz-any(
#placesList,
#placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_history____v),
:-moz-any(
#placesList,
#placeContent) treechildren::-moz-tree-image(title, query, dayContainer) {
list-style-image: url("chrome://browser/skin/places/history.svg") !important;
}
:-moz-any(
#placesList,
#placeContent) treechildren::-moz-tree-image(title, query, tagContainer),
:-moz-any(
#placesList,
#placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_tags_______v) {
list-style-image: url("chrome://browser/skin/places/tag.svg") !important;
}
:-moz-any(
#placesList,
#placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_allbms_____v) {
list-style-image: url(Fx56-allBookmarks.png) !important;
}
Alles anzeigen
Hier mal die komplette userchrome.css.
Sieht hier so aus damit:
Welchen Hintergrund hast du denn hier aktiviert?
Dunkel aber gerade auch mit hell probiert, bleibt gleich. Wenn es bei dir mit meiner .css geht dann weiß ich echt nicht wieso. Macht doch keinen Sinn?
geht dann weiß ich echt nicht wieso.
Mal abwarten ob evtl. ein anderer User Lust hat das auch mal zu testen.
Im Moment fällt mir sonst auch nichts weiter ein dazu
Hast du es mal ohne dein dunkles Theme versucht, ist die Leiste dann grau?
Versuche ich nachher / heute abend mal dann. Dank dir aber für deine Hilfe schon mal. Ich melde mich dann spätestens morgend wieder, vielleicht hat ja bis dahin noch einer eine Lösung.
/Ot
Gibt es vlt noch eine kurze Lösung um die, für mich, "neuen" gelben Eingabefelder bei Logins und co, wieder weiß zu bekommen?
Und die Scrollbars auch wieder in "normal" (trotz dunklen Themes? Vermutlich mehr Arbeit^^)
Grüße
Wenn ich das richtig verstanden habe, hat er im Skript die Hintergrundfarbe auf "#2a2a2e" geändert - also ein dunkles Grau (siehe Beitrag #382). Das paßt mit seinem Screenshot zusammen.
Warum jetzt allerdings beim #stauspanel-label der Hintergrund schwarz ist, obwohl im CSS-Code transparent steht, ist mir noch schleierhaft.
Warum jetzt allerdings beim
Weil das in dem von ihm genutzen Theme so eingestellt ist. Wobei bei ihm ja die ganze Leiste schwarz ist, und nicht nur der Hintergrund der Url.
Im Theme hatte ich den Eintrag für den Tooltip ja schon entfernt. Und hier funktioniert das in 2 verschiedenen Profilen
Ich bezog mich auf seinen Screenshot in Beitrag #376.
Auf jeden Fall funktioniert es auch bei mir. Ich habe, um das deutlicher zu machen, vbox.style.backgroundColor blau zugewiesen, der Schriftfarbe von #statuspanel-label gelb und der Hintergrundfarbe von #statuspanel-label rot.
Klausi Kommentiere mal den Code für dein Theme vollständig mit /* ... */ aus, sodass nur noch der Code für die Statusleiste aktiv ist. Wenn da eine Nebenwirkung besteht, sollte der Statusleisten-Code dann funktionieren.
Wenn es um die Farbe der ganzen Statusleiste geht, so wird di
Wobei bei ihm ja die ganze Leiste schwarz ist, und nicht nur der Hintergrund der Url.
Da diese Farbe im Skript festgelegt wird, könnte es sein, dass er den Skript-Cache nicht geleert hat und daher seine Änderung in
#2a2a2e nicht wirksam wird.
#2a2a2e
Täusche ich mich jetzt, aber das ist doch fast schwarz und kein grau dann
Täusche ich mich jetzt, aber das ist doch fast schwarz und kein grau dann
Ja, du hast recht. Die Farbe hinter dem Farbcode habe ich mir nicht angesehen.
Ja, du hast recht.
Dann verstehe ich nicht wo nun letztlich sein Problem ist
Möglicherweise war er in dem Glauben es handele sich um einen Grauton, so wie bei dir lightgrey.