/* -------------------------------------------------------------- */
/* v4.0.15 || Firefox ESR v68.9.0 || HighValueDayGame */
/* -------------------------------------------------------------- */
/* -------------------------------------------------------------- */
/* Changes: */ /* ==================================== v4.0.15 */
/* - additional Dark Mode improvements */
/* -------------------------------------------------------------- */
/* For questions: https://highvaluedaygame.com/contact/ */
/* -------------------------------------------------------------- */
@-moz-document url(chrome://browser/content/browser.xul)
#nav-bar {-moz-box-ordinal-group: 1 !important;}
#PersonalToolbar {-moz-box-ordinal-group: 2 !important;}
#titlebar {-moz-box-ordinal-group: 3 !important;}
/* ============================================================== */
/* >>>>>>>>>>>>> OPTIONAL USER CUSTOMIZATION <<<<<<<<<<<< */
/* ============================================================== */
/* >>>> --------------------------------------------------------- */
/* >>>> STEP 1: centre URL BAR after adding buttons */
/* >>>> --------------------------------------------------------- */
/* If you placed buttons next to the Menu on the right-hand side */
/* of the URL bar (e.g add-on buttons, overflow menu, etc) and */
/* you want to keep the URL BAR aligned with the bookmarks */
/* toolbar, remove the 0 below and add 29px for each button you */
/* placed between the URL bar and the Menu (assuming no buttons */
/* were on the left-hand side of the URL bar - otherwise 29px for */
/* each more button you placed on the right-hand side of the URL */
/* BAR compared to the left-hand side */
#urlbar-container {
-moz-box-pack: center !important;
padding-right: 75px !important;
padding-left: 0px !important; /* <<=== Add 29px per each button between URL bar and Menu */
}
/* >>>> --------------------------------------------------------- */
/* >>>> STEP 2: move RELOAD BUTTON somewhere else in the nav bar */
/* >>>> --------------------------------------------------------- */
#stop-reload-button .toolbarbutton-icon{
border-radius: 4px !important;
padding: -2px !important;
}
#stop-reload-button{
transform: translateX(20px); /* <<=== Assign position of the reload button along the nav bar */
border-radius:0px !important;
margin-right: 0px !important;
}
/* >>>> --------------------------------------------------------- */
/* >>>> STEP 3: change min width/height of the Firefox window */
/* >>>> --------------------------------------------------------- */
#main-window {
min-width: 900px !important; /* <<=== Assign min width of window (!! may affect fingerprinting resistance) */
*min-height: 900px !important; /* <<=== Assign min height of window (!! may affect fingerprinting resistance) */
}
/* >>>> --------------------------------------------------------- */
/* >>>> STEP 4: re-assign original colours to add-on buttons */
/* >>>> --------------------------------------------------------- */
#nav-bar .toolbarbutton-1:not(:-moz-any([type="menu-button"],
#nav-bar-overflow-button)) {
filter: grayscale(100%) !important; /* <<=== comment to display original colour of the buttons in the NAV BAR */
}
.widget-overflow-list .toolbarbutton-icon {
filter: grayscale(100%) !important; /* <<=== comment to display original colour of the buttons in the OVERFLOW MENU */
}
.webextension-browser-action { /* ==================================== v4.0.15 */
filter: grayscale(100%) !important; /* <<=== comment to display original colour of the notification pop-ups in the OVERFLOW MENU */
}
/* ============================================================== */
/* >>>>>>>>>>> END OF OPTIONAL CUSTOMIZATION <<<<<<<<<<<< */
/* ============================================================== */
/* ------------------------------------------------------------ */
/* Background colours structure */
/* ------------------------------------------------------------ */
#navigator-toolbox > toolbar:not(#TabsToolbar):not(#toolbar-menubar):not(#PersonalToolbar),
.browserContainer > findbar, #browser-bottombox {
background-color: rgb(60,60,60) !important; /* ==================================== DARK MODE */
}
#main-window,
browser[type="content-primary"],
browser[type="content"],
tabbrowser#content,
#content,
browser[type="content"] > html {
background: rgb(32,32,32) !important;
}
}
/* ------------------------------------------------------------ */
/* NAV bar */
/* ------------------------------------------------------------ */
/* For the height see "White boxes around all buttons" below */
#nav-bar-customization-target {
-moz-box-pack: center !important;
}
#nav-bar {
-moz-box-ordinal-group: 1 !important;
padding-left: 75px !important; /* leave space for the RED AMBER GREEN buttons */
}
#nav-bar-customization-target {
margin: 4.5px 0px !important; /* vertical position of everything except hamburger menu */
}
#PanelUI-menu-button {
margin: 4.5px 0px !important; /* vertical position of hamburger menu */
margin-left: -3px !important;
}
#nav-bar {
min-height: 37px !important; /* height of the section */
max-height: 37px !important;
}
#nav-bar .toolbarbutton-1:not(:-moz-any([type="menu-button"],
#nav-bar-overflow-button)) {
max-height: 29px !important; /* height of the buttons */
}
#nav-bar-overflow-button {
margin: 4.5px 0px !important;
}
/* ------------------------------------------------------------ */
/* URL bar */
/* ------------------------------------------------------------ */
#urlbar {
margin-bottom: 2px !important; /* ==================================== ESR change */
margin-top: 2px !important; /* ==================================== ESR change */
}
#urlbar { /* status = DEFAULT */
box-shadow: 0 0 3px transparent !important;
border: 0.75px solid rgb(48,48,48) !important; /* ==================================== DARK MODE */
background: rgb(144,144,144) !important; /* ==================================== DARK MODE */
min-width: 500px !important; /* side position */
max-width: 500px !important; /* side position */
border-radius: 5px !important;
}
#urlbar { /* style of text within */
font-size: 12px !important;
color: rgb(0,0,0) !important;
}
#urlbar[focused] { /* status = ACTIVE */
box-shadow: 0 0 3px transparent !important;
border: 2.5px solid rgb(32,32,32) !important; /* ==================================== DARK MODE */
border-radius: 6px !important;
}
#identity-box {
transform: scale(0.8, 0.8) !important; /* size of lock symbol on the left */
filter: grayscale(100%) !important;
margin-inline-start: -5px; /* ==================================== ESR change */
}
#identity-box:hover:not(.no-hover):not([open="true"]),
#tracking-protection-icon-container:hover:not([open="true"]) {
background-color: rgb(144,144,144) !important;
color: rgb(0,0,0) !important;
}
#urlbar-input{ /* center URL bar text - OFF */
*text-align: center !important;
}
:not(.urlbar-icon-wrapper) > /* history dropmaker */
.urlbar-icon:not([disabled]):hover,
.urlbar-icon-wrapper:not([disabled]):hover {
background-color: rgb(154,154,154) !important; /* ==================================== DARK MODE */
color: rgb(0,0,0) !important;
}
/* ------------------------------------------------------------ */
/* Bookmarks bar */
/* ------------------------------------------------------------ */
#PlacesToolbar {
-moz-box-ordinal-group: 2 !important; /* align with URL bar */
padding-left: 52.5px !important;
padding-right: 0px !important;
}
#PersonalToolbar {
height: 26px !important;
background: rgb(60,60,60) !important; /* ==================================== DARK MODE */
border-top: 1px solid rgb(96,96,96) !important; /* border */
border-bottom: 1px solid rgb(96,96,96) !important; /* border */
magin-left: -2px !important;
magin-right: -2px !important;
padding: 2.5px 0px 2.5px 0px !important; /* space ABOVE RIGHT BELOW LEFT */
}
.bookmark-item>.toolbarbutton-icon {
display: none !important; /* hide icons */
}
#PlacesToolbarItems { /* status = DEFAULT */
-moz-box-pack: center;
background: rgb(60,60,60) !important; /* ==================================== DARK MODE */
color: rgb(168,168,168) !important; /* ==================================== DARK MODE */
font-size: 11px !important;
}
toolbarbutton.bookmark-item {
background-color: rgb(60,60,60) !important; /* ==================================== DARK MODE */
border-radius: 4px !important;
color: rgb(168,168,168) !important;
border: 0.5px solid rgb(60,60,60) !important; /* ==================================== DARK MODE */
}
toolbarbutton.bookmark-item:hover { /* status = HOVER */
background-color: rgb(128,128,128) !important; /* ============= DARK MODE */
border-radius: 4px !important; /* radius */
color: rgb(0,0,0) !important; /* ==================================== DARK MODE */
border: 0.5px solid rgb(32,32,32) !important; /* ==================================== DARK MODE */
}
#personal-bookmarks toolbarbutton { /* space items within the bar*/
margin-left: 1.5px !important;
margin-right: 1.5px !important;
}
#PlacesToolbarItems > .bookmark-item[container]:after { /* space right of the text */
content:'>';
font-weight: 550;
margin-left: 6px;
margin-right: -2px;
display: block;
transform: rotate(90deg) scale(0.7, 1.3);
color: rgb(168,168,168); /* ==================================== DARK MODE */
}
/* ------------------------------------------------------------ */
/* Dragging bookmarks */
/* ------------------------------------------------------------ */
toolbarbutton.bookmark-item[dragover][open] { /* ==================================== DARK MODE */
background-color: rgb(136,136,136) !important; /* Toolbar, bg colour of bookmark folders */
border: 0.5px solid rgb(32,32,32) !important;
color: rgb(0,0,0) !important; /* Toolbar, text colour of bookmark folders */
}
menupopup menu {
background: 0 !important; /* Pop-up menu, dragging folder into folder */
}
#PlacesToolbarDropIndicator { /* Bookmarks bar, vertical line between items */
filter: grayscale(100%) !important;
}
image[part="drop-indicator"] {
filter: grayscale(100%) !important; /* Pop-up menu, horizontal line */
}
/* ------------------------------------------------------------ */
/* Tabs - Height */
/* ------------------------------------------------------------ */
#TabsToolbar { /* height */
height: 25px !important;
}
#titlebar {
height: 25px !important;
}
#new-tab-button {
max-height: 25px !important;
}
#tabs-newtab-button {
max-height: 25px !important;
}
#TabsToolbar, .tabbrowser-tab {
max-height: 25px !important;
}
.scrollbutton-up, .scrollbutton-down {
display: none !important;
}
.scrollbutton-up, .scrollbutton-down {
max-height: 25px !important;
}
.scrollbutton-up[orient="horizontal"] ~ spacer {
margin-bottom: 10px !important;
}
/* ------------------------------------------------------------ */
/* Tabs - Other */
/* ------------------------------------------------------------ */
.titlebar-spacer[type="pre-tabs"],
.titlebar-spacer[type="post-tabs"] {
display: none !important; /* hide lateral blank spaces top left and top right of all tabs*/
}
#TabsToolbar-customization-target {
background-color: transparent !important; /* default background colour */
}
.tabbrowser-tab:not([pinned="true"]) { /* min width of tabs */
min-width:160px !important;
}
.tab-background[selected="true"] { /* ACTIVE tabs, background colour */
background-attachment: none !important;
background-color: rgb(60,60,60) !important;
background-image: none !important; /* ==================================== DARK MODE */
}
#TabsToolbar .tabbrowser-tab[selected] { /* ACTIVE tabs, text colour */
color: rgb(168,168,168) !important; /* ==================================== DARK MODE */
}
#tabbrowser-tabs {
--tab-line-color: transparent !important; /* ACTIVE tab, make top border transparent*/
}
.tab-background[selected="true"] {
border-radius: 0px 0px 0px 0px !important; /* ACTIVE TAB, radius TOP TOP BOTTOM BOTTOM */
}
.tabbrowser-tab:not([selected]) .tab-background {
background-color: rgb(32,32,32) !important; /* ==================================== DARK MODE */
}
#TabsToolbar { /* INACTIVE tabs, text colour */
color: rgb(220,220,220) !important; /* ==================================== DARK MODE */
}
.tabbrowser-tab:not([selected])::after { /* INACTIVE tabs, lateral border */
color: rgb(60,60,60) !important; /* ==================================== DARK MODE */
}
.tabbrowser-tab:hover>.tab-stack>.tab-background:not([selected="true"]):not([multiselected]) {
background-color: rgb(32,32,32) !important; /* ==================================== DARK MODE */ /* =============== v4.0.15 */
margin-top: -5px !important; /* INACTIVE tabs, hover, do not show upper margin */
}
.tab-throbber {
display: none !important;
}
.tabbrowser-tab[fadein] {
max-width: 100vw !important; /* TABS, max width */
}
.tab-label {
-moz-box-flex: 1 !important;
text-align: center !important; /* TABS, show text in the middle of them */
}
.tab-label-container[textoverflow][labeldirection="ltr"]:not([pinned]) {
mask-image: none !important; /* TABS, remove fade-out effect right end side */
}
.tab-loading-burst { /* TABS, remove swipe animation after page has loaded */
display: none !important;
}
/* ------------------------------------------------------------ */
/* Colour behind / below tabs */
/* ------------------------------------------------------------ */
#TabsToolbar {
background-color: rgb(60,60,60) !important; /* ==================================== DARK MODE */
border: none !important; /* ==================================== DARK MODE */
-moz-appearance: none !important;
}
#titlebar {
margin-bottom: -1px !important;
}
/* ------------------------------------------------------------ */
/* Tab icons */
/* ------------------------------------------------------------ */
.tab-icon-image {
display: none !important; /* TABS, hide icons */
}
.tabbrowser-tab .tab-close-button { /* TAB CLOSE, move to left & show backbround only on hover */
display:-moz-box! important;
-moz-box-ordinal-group:0!important;
* margin-right:3px!important;
-moz-margin-start:-8.5px !important;
-moz-margin-end:0px !important;
transform: scale(0.85, 0.85) !important; /* size */
}
.tabbrowser-tab:not(:hover) .tab-close-button{ /* TAB CLOSE, X, hide when not hover */
opacity: 0;
}
.tabbrowser-tab .tab-close-button{ /* X sign in selected tab */
color: rgb(192,192,192) !important;
}
.tabbrowser-tab:not([selected]) .tab-close-button{ /* X sign in not-selected tab */
color: rgb(192,192,192) !important;
}
.tabbrowser-tab .tab-close-button:hover { /* X background square in selected tab */
background-color: rgb(24,24,24) !important;
color: rgb(192,192,192) !important;
border-radius: 2px !important;
}
.tabbrowser-tab:not([selected]) .tab-close-button:hover { /* X background square in not-selected tab */
background-color: rgb(48,48,48) !important;
color: rgb(192,192,192) !important;
border-radius: 2px !important;
}
.tabbrowser-tab .tab-icon-sound { /* SOUND ICON, move to the right to perfectly centre TAB text */
display:-moz-box! important;
-moz-box-ordinal-group:1!important;
* margin-left:3px!important;
-moz-margin-start:2px !important;
-moz-margin-end:-6.5px !important;
transform: scale(0.85, 0.85) !important; /* size */
}
.tab-icon-sound[soundplaying] {
color: rgb(169,169,169) !important; /* ==================================== DARK MODE */
transform: scale(0.85, 0.85) !important; /* size */
}
/* ------------------------------------------------------------ */
/* New Tab and Overflow menu */
/* ------------------------------------------------------------ */
#alltabs-button { /* Hide drop down icon */
display: none;
}
.scrollbutton-up[orient="horizontal"] ~ spacer { /* Hide scroll buttons down icon */
display: none !important;
}
.tabs-newtab-button { /* ==================================== ESR change */
margin-left: -7px !important; /* ==================================== ESR change */
margin-right: -3px !important; /* ==================================== ESR change */
padding: 0px 0px 0px 2px !important; /* ==================================== ESR change */
fill: rgb(144,144,144) !important; /* ==================================== DARK MODE */
}
#new-tab-button { /* NEW TAB, + icon, dimensions - many tabs */
transform: scale(0.8, 1) !important; /* ==================================== ESR change */
margin-left: -7px !important; /* ==================================== ESR change */
margin-right: -3px !important;
padding: 0px 0px 0px 3px !important;
fill: rgb(144,144,144) !important; /* ==================================== DARK MODE */
}
/* NEW TAB, background of icon - normal */
.tabs-newtab-button .toolbarbutton-icon { /* ==================================== ESR change */
transform: scale(0.8, 1) !important; /* ==================================== ESR change */
background-color: rgb(32,32,32) !important; /* ==================================== DARK MODE */
}
#tabs-newtab-button:hover .toolbarbutton-icon {
border-radius: 0px !important;
background-color: rgb(80,80,80) !important; /* ==================================== DARK MODE */
}
#tabs-newtab-button:active .toolbarbutton-icon {
border-radius: 0px !important;
background-color: rgb(64,64,64) !important;
}
#new-tab-button .toolbarbutton-icon { /* NEW TAB, background of icon - many tabs */
border-radius: 0px !important;
background-color: rgb(32,32,32) !important; /* ==================================== DARK MODE */
}
#new-tab-button:hover .toolbarbutton-icon {
border-radius: 0px !important;
background-color: rgb(80,80,80) !important; /* ==================================== DARK MODE */
}
#new-tab-button:active .toolbarbutton-icon {
border-radius: 0px !important;
background-color: rgb(64,64,64) !important;
}
/* ------------------------------------------------------------ */
/* Dropdown menu folders in bookmark bar */
/* ------------------------------------------------------------ */
menupopup, popup,
popup > menu > menupopup,
menupopup > menu > menupopup { /* BACKGROUND */
-moz-appearance: none !important; /* ==================================== ESR change */
background: rgb(60,60,60) !important; /* ==================================== DARK MODE */
border-radius: 5px !important;
padding: 0px 0px 0px 0px !important; /* space ABOVE RIGHT BELOW LEFT */
max-width: 400px !important; /* max width of pop-up window */
}
menupopup menuseparator { /* above "open all tabs" */
-moz-appearance: none !important; /* ==================================== ESR change */
background: rgb(169,169,169) !important; /* ==================================== DARK MODE */
margin: 0px 0px 0px 0px !important;
padding: 0.5px !important; /* height border above "open all tabs" */
}
menupopup menu, menuitem{ /* ITEMS, DEFAULT */
-moz-appearance: none !important; /* ==================================== ESR change */
color: rgb(176,176,176) !important; /* ==================================== DARK MODE */
padding: 0px 20px 0px 15px !important; /* space ABOVE RIGHT BELOW LEFT */
height: 21px !important; /* vertical height of each line */
font-size: 12px !important;
}
menupopup menu:hover, menuitem:hover, /* FOLDER ITEMS, HOVER */
menu[open="true"], /* INACTIVE selected/open folders */
menuitem[_moz-menuactive="true"] {
-moz-appearance: none !important; /* ==================================== ESR change */
background-color: rgb(128,128,128) !important; /* ============= DARK MODE */
color: rgb(0,0,0) !important; /* ==================================== DARK MODE */
font-size: 12px !important;
}
.menu-right { /* TRIANGLE SIGN to open sub-folders */
-moz-appearance: none !important;
padding: 8px !important;
margin-right: -10px !important;
color: black !important;
border: solid rgb(176,176,176); /* ==================================== DARK MODE */
border-width: 0 2.5px 2.5px 0;
transform: rotate(-45deg) scale(.4);
}
/* inactive selected/open folders and website bookmarks */
/* ------------------------------------------------------------ */
/* Folder icons, colour */
/* ------------------------------------------------------------ */
*#PlacesToolbarItems toolbarbutton[container="true"] .toolbarbutton-icon,
*:-moz-any(
*#PlacesToolbarItems,
*#PlacesChevronPopup,
*#BMB_bookmarksPopup,
*#bookmarksMenu) menu[container="true"] > .menu-iconic-left > .menu-iconic-icon,
*/* Standard folder -- in Sidebar, Library, Add/Edit Bookmark dialog */
*:-moz-any(
*#bookmarks-view,
*#editBMPanel_folderTree,
*#placesList,
*#placeContent) treechildren::-moz-tree-image(container),
*#editBMPanel_folderMenuList > .menulist-label-box > .menulist-icon,
*#editBMPanel_folderMenuList menupopup menuitem {
*fill: rgb(169,169,169) !important; /* ==================================== DARK MODE */
*}
.bookmark-item.menuitem-with-favicon:not([container]) { /* ==================================== DARK MODE */
*fill: rgb(176,176,176) !important;
filter: grayscale(25%)
}
/* ------------------------------------------------------------ */
/* URL bar search results */
/* ------------------------------------------------------------ */
#urlbar-results { /* ==================================== ESR change */
-moz-margin-start: 0px !important; /* ==================================== ESR change */
margin-top: 0px !important; /* ==================================== ESR change */
left: unset !important; /* Override 0 */
right: unset !important; /* Override 0 */
min-width: 500px !important;
max-width: 500px !important;
background: rgb(60,60,60) !important; /* ==================================== DARK MODE */
box-shadow: none !important;
border: 1px solid rgb(32,32,32) !important; /* ==================================== DARK MODE */
border-radius: 4px !important; /* border radius */
}
/* ==================================== ESR change */
#PopupAutoCompleteRichResult .autocomplete-richlistitem:not([actiontype="searchengine"]) .ac-url,
#PopupAutoCompleteRichResult .autocomplete-richlistitem:not([actiontype="searchengine"]) .ac-actiontitle,
.urlbarView-row:not([type="search"]) .urlbarView-secondary,
.urlbarView-row:not([type="search"]) .urlbarView-url {
font-size: 12px !important;
}
#urlbar-input::-moz-selection { /* colour autocomplete text URL bar */
background-color: rgb(80,80,80) !important; /* ==================================== DARK MODE */
border: 0px !important;
opacity: 1 !important;
color: rgb(192,192,192) !important; /* ==================================== DARK MODE */
}
.urlbarView-title { /* ==================================== ESR change */
font-size: 12px !important;
}
.urlbarView-action {
color: rgb(192,192,192) !important; /* ==================================== DARK MODE */
}
.urlbarView-favicon {
transform: scale(.9, .9) !important; /* favicons in search results */
* filter: grayscale(75%) !important;
}
.urlbarView-row {
padding: 6px 0px !important; /* vertical space between lines */
}
.urlbarView-title { /* drop-down results, title colour */ /* =========================== v4.0.15 */
color: rgb(192,192,192) !important; /* ==================================== DARK MODE */
font-weight: 600 !important;
}
.urlbarView-url { /* drop-down results, URL color */
color: rgb(192,192,192) !important; /* ==================================== DARK MODE */
}
.urlbarView-row[selected], .urlbarView-row:hover { /* drop-down results, selected/hover colors */
background-color: rgb(80,80,80) !important; /* ==================================== DARK MODE */
}
.urlbarView-row[selected] .urlbarView-title,
.urlbarView-row:hover .urlbarView-title,
.urlbarView-row[selected] .urlbarView-secondary,
.urlbarView-row:hover .urlbarView-secondary,
.urlbarView-row[selected] .urlbarView-title-separator,
.urlbarView-row:hover .urlbarView-title-separator { /* drop-down results, selected URL color */
color: rgb(180,180,180) !important; /* ==================================== DARK MODE */
}
.searchbar-engine-one-off-item {
filter: grayscale(25%) !important;
}
#urlbar-results { /* Favourite icon */ /* =========================================== v4.0.15 */
color: rgb(192,192,192) !important;
}
:root[lwt-popup-brighttext] .search-panel-header { /* "Search for XXX with:" */ /* =================================== v4.0.15 */
color: rgb(192,192,192) !important;
}
.search-panel-input-value { /* item XXX to search with 1-click search engine */ /* ============ v4.0.15 */
color: rgb(192,192,192) !important;
}
/* ------------------------------------------------------------ */
/* Search results in two lines - HIDDEN */
.urlbarView-row-inner{
* flex-wrap: wrap !important;
}
.urlbarView-title[title]{
* flex-grow: 1;
}
.urlbarView-row > .urlbarView-row-inner > .urlbarView-url{
* margin-inline-start: 24px; min-width: 95%
}
.urlbarView-row[has-url]:not([type="switchtab"]) .urlbarView-title-separator{
* display: none
}
/* ------------------------------------------------------------ */
/* MacOS window buttons RED AMBER GREEN */
/* ------------------------------------------------------------ */
.titlebar-buttonbox-container {
position: fixed !important;
display: block !important;
top: 0px !important;
left 2px !important;
}
/* ------------------------------------------------------------ */
/* Toolbar buttons */
/* ------------------------------------------------------------ */
/* ------------------------------------------------------------ */
/* Remove separator menu button */
#PanelUI-button,
#PanelUI-menu-button {
border:none !important;
padding-left:0px !important;
margin-inline-end:1.4px !important;
}
/* ------------------------------------------------------------ */
/* Shape and size of buttons */
.toolbarbutton-1 {
--toolbarbutton-hover-background: none !important; /* over-write default HOVER colour*/
transform: scale(0.825, 0.825) !important; /* size */
}
#nav-bar .toolbarbutton-1 {
fill: rgb(24,24,24) !important; /* ==================================== DARK MODE */
}
/* ------------------------------------------------------------ */
/* White boxes around all buttons */
#nav-bar .toolbarbutton-1:not(:-moz-any([type="menu-button"])){
background: rgb(128,128,128) !important; /* ==================================== DARK MODE */
border: 0.75px solid rgb(48,48,48) !important; /* ==================================== DARK MODE */
border-radius: 4.5px !important;
padding: unset !important;
}
/* ------------------------------------------------------------ */
/* BACK button */
#nav-bar #back-button {
width: 30px !important;
max-height: 30px !important;
height: 30px !important;
padding: 0px !important;
-moz-image-region: unset !important;
}
*#nav-bar #back-button:hover .toolbarbutton-icon {
* border-radius: 4px !important;
* background-color: rgb(192,192,192) !important;
}
/* ------------------------------------------------------------ */
/* FWD button */
#nav-bar #forward-button {
width: 29px !important; /* width consistent with button height set in NAV BAR */
padding: 0px !important;
-moz-box-align: center !important;
-moz-image-region: unset !important;
}
#nav-bar #forward-button:hover .toolbarbutton-icon {
border-radius: 4px !important;
* background-color: rgb(211,211,211) !important;
}
/* ------------------------------------------------------------ */
/* Remove default of BACK/FWD buttons */
#nav-bar #back-button > .toolbarbutton-icon,
#nav-bar #forward-button > .toolbarbutton-icon
{
background: none !important;
border: none !important;
box-shadow: none !important;
padding: unset !important;
}
#back-button[disabled="true"] > .toolbarbutton-icon {
opacity: 1 !important;
-moz-context-properties: none !important;
fill-opacity: unset !important;
}
#back-button[disabled="true"] {
opacity: 0.4 !important;
-moz-context-properties: none !important;
fill-opacity: unset !important;
}
/* ------------------------------------------------------------ */
/* Assign symbol of BACK button */
#nav-bar #back-button {
list-style-image: url('data:image/svg+xml;utf8,\ <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18">\ <path d="M12,5 L8.5,9 L12,13" fill="transparent" stroke="rgb(0,0,0)" stroke-width="1.2" stroke-linecap="round"/>\ </svg>') !important;
}
/* ------------------------------------------------------------ */
/* Assign symbol of FWD button */
#nav-bar #forward-button {
list-style-image: url('data:image/svg+xml;utf8,\ <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18">\ <path d="M7,5 L11,9 L7,13" fill="transparent" stroke="rgb(0,0,0)" stroke-width="1.4" stroke-linecap="round"/>\ </svg>') !important;
}
/* ------------------------------------------------------------ */
/* Position of FWD and BACK buttons */
#forward-button .toolbarbutton-icon {
margin-left: 1px !important;
}
#forward-button {
margin-left: -4px !important;
}
#back-button .toolbarbutton-icon {
margin-left: -5px !important;
}
/* ------------------------------------------------------------ */
/* Dialog windows - General */ /* ==================================== DARK MODE */
/* ------------------------------------------------------------ */
window, page, dialog, wizard {
-moz-appearance: none !important;
background-color: rgb(52,52,52) !important;
color: rgb(184,184,184) !important; /* text */
font: message-box;
line-height: normal;
}
#infoIcon {
filter: grayscale(100%) !important;
}
.dialog-button-box button.dialog-button {
-moz-appearance: none !important;
background-color: rgb(52,52,52) !important;
color: rgb(188,188,188) !important;
font-weight: 650 !important;
font-size: 9pt !important;
padding: 3px !important;
border: 0.75px solid rgb(169,169,169) !important;
border-radius: 2px !important;
}
.dialog-button-box button.dialog-button:hover {
-moz-appearance: none !important;
background-color: rgb(60,60,60) !important;
color: rgb(188,188,188) !important;
padding: 3px !important;
border: 0.75px solid rgb(169,169,169) !important;
}
.dialog-button-box button.dialog-button:active {
-moz-appearance: none !important;
background-color: rgb(52,52,52) !important;
color: rgb(188,188,188) !important;
padding: 3px !important;
border: 0.75px solid rgb(169,169,169) !important;
}
/* ------------------------------------------------------------ */
/* Dialog windows - Bookmark properties */ /* ==================================== DARK MODE */
/* ------------------------------------------------------------ */
dialog#bookmarkproperties { /* background */
-moz-appearance: none !important;
background: rgb(52,52,52) !important;
}
dialog#bookmarkproperties textbox { /* text boxes */
-moz-appearance: none !important;
color: rgb(0,0,0) !important;
background-color: rgb(144,144,144) !important;
border: 0.75px solid rgb(32,32,32) !important;
padding: 3px !important;
}
/* ------------------------------------------------------------ */
/* Window "Customize..." */ /* ==================================== DARK MODE */
/* ------------------------------------------------------------ */
.customizationmode-checkbox:not(:-moz-lwtheme):not([disabled]), /* text in all buttons */
.customizationmode-button {
color: rgb(188,188,188) !important; !important;
font-weight: 650 !important;
}
#customization-done-button:not([disabled]) { /* Button "Done" */
background-color: rgb(52,52,52) !important;
border: 0.75px solid rgb(169,169,169) !important;
}
#customization-done-button:-moz-any(:hover):not([disabled]) {
background-color: rgb(60,60,60) !important;
border: 0.75px solid rgb(169,169,169) !important;
}
#customization-done-button:-moz-any(:hover:active):not([disabled]) {
background-color: rgb(52,52,52) !important;
border: 0.75px solid rgb(169,169,169) !important;
}
.customizationmode-button:not([disabled]) { /* All other buttons */
background-color: rgb(52,52,52) !important;
border: 0.75px solid rgb(169,169,169) !important;
}
.customizationmode-button:-moz-any(:hover):not([disabled]) {
background-color: rgb(60,60,60) !important;
border: 0.75px solid rgb(169,169,169) !important;
}
.customizationmode-button:-moz-any(:hover:active):not([disabled]) {
background-color: rgb(52,52,52) !important;
border: 0.75px solid rgb(169,169,169) !important;
}
/* ------------------------------------------------------------ */
/* Arrow panels */ /* ==================================== DARK MODE */
/* ------------------------------------------------------------ */
:root {
--arrowpanel-border-color: none !important; /* external border */
--arrowpanel-background: rgb(52,52,52) !important; /* background colour */
--arrowpanel-dimmed: rgb(52,52,52) !important; /* background colour bottom part in Edit Bookmark */
--arrowpanel-color: rgb(184,184,184) !important; /* text colour */
--panel-disabled-color: rgb(144,144,144) !important; /* text colour, inactive items */
--panelui-subview-transition-duration: 1ms !important;
--focus-ring-box-shadow: 0 0 0 1.5px rgb(0,0,0) !important; /* highlight around search fields in Edit Bookmark */
}
panelview .toolbarbutton-1:not(:-moz-any([disabled], [open], :active)):-moz-any(:hover, :focus), toolbarbutton.subviewbutton:not(:-moz-any([disabled], [open], :active)):-moz-any(:hover, :focus), .navigable.subviewbutton:not(:-moz-any([disabled], [open], :active)):-moz-any(:hover, :focus), menu.subviewbutton:not(:-moz-any([disabled], :active))[_moz-menuactive], menuitem.subviewbutton:not(:-moz-any([disabled], :active))[_moz-menuactive], .widget-overflow-list .toolbarbutton-1:not(:-moz-any([disabled], [open], :active)):-moz-any(:hover, :focus), .toolbaritem-combined-buttons:-moz-any(:not([cui-areatype="toolbar"]), [overflowedItem="true"]) > toolbarbutton:not(:-moz-any([disabled], [open], :active)):-moz-any(:hover, :focus) {
color: rgb(0,0,0) !important;
background-color: rgb(144,144,144) !important; /* HOVER colour of items and buttons in panels */
}
/* ------------------------------------------------------------ */
/* Button - Margins */
.panel-footer > button {
-moz-appearance: none;
border-top: none !important;
margin: 5px !important;
}
/* ------------------------------------------------------------ */
/* Button - Default */
.panel-footer > button:not([disabled])[default] {
background-color: rgb(52,52,52) !important;
color: rgb(188,188,188) !important;
border: 0.75px solid rgb(169,169,169) !important;
border-radius: 2px !important;
font-weight: 650 !important;
}
.panel-footer > button:not([disabled])[default]:hover {
background-color: rgb(60,60,60) !important;
color: rgb(188,188,188) !important;
font-weight: 650 !important;
}
.panel-footer > button:not([disabled])[default]:hover:active {
background-color: rgb(52,52,52) !important;
color: rgb(188,188,188) !important;
font-weight: 650 !important;
}
/* ------------------------------------------------------------ */
/* Button - Other */
.panel-footer > button:not([disabled]) {
background-color: rgb(52,52,52) !important;
color: rgb(188,188,188) !important;
border: 0.75px solid rgb(169,169,169) !important;
border-radius: 2px !important;
font-weight: 650 !important;
}
.panel-footer > button:not([disabled]):hover {
background-color: rgb(60,60,60) !important;
color: rgb(188,188,188) !important;
font-weight: 650 !important;
}
.panel-footer > button:not([disabled]):hover:active {
background-color: rgb(52,52,52) !important;
color: rgb(188,188,188) !important;
font-weight: 650 !important;
}
/* ------------------------------------------------------------ */
/* Misc */
*#widget-overflow { /* ==================================== v4.0.15 */
* filter: grayscale(100%) !important; /* icon in "Add Search Engine" + add-ons pop-up windows */
*} /* !! It messes up with add-ons */
/* ------------------------------------------------------------ */
/* Arrow panels - Edit Bookmark */ /* =================================== DARK MODE */
/* ------------------------------------------------------------ */
#editBookmarkPanelInfoArea { /* remove top area with image */
display: none !important;
}
#editBMPanel_namePicker, #editBMPanel_folderMenuList,
#editBMPanel_tagsField, #editBMPanel_keywordField,
#editBMPanel_foldersExpander, #editBMPanel_tagselectorExpander,
#editBMPanel_tagsSelector, #editBMPanel_locationField {
color: rgb(0,0,0) !important;
background-color: rgb(144,144,144) !important;
border: 0.75px solid rgb(32,32,32) !important;
}
#editBMPanel_nameRow, #editBMPanel_tagsRow,
#editBMPanel_locationRow, #editBMPanel_keywordRow {
color: rgb(188,188,188) !important; /* text Name/Folder/Location/Tags */
}
#editBMPanel_folderTree {
-moz-appearance: none !important;
color: rgb(220,220,220) !important; /* text and icons in the drop-down menu*/
background: none !important; /* border when not active */
}
.checkbox-check { /* ==================================== v4.0.15 */
-moz-appearance: checkbox;
filter: grayscale(100%) !important;
}
*#editBMPanel_PanelRows-input::-moz-selection { /* colour autocomplete text URL bar */
*background-color: rgb(80,80,80) !important;
*color: rgb(192,192,192) !important;
*}
/* ------------------------------------------------------------ */
/* Arrow panels - Others (Add extensions, etc.) */ /* ==================================== DARK MODE */
/* ------------------------------------------------------------ */
#infoBox textbox, #infoBox listbox, #searchFilter { /* Fill-in boxes */
-moz-appearance: none !important;
color: rgb(0,0,0) !important; /* Text */
background-color: rgb(144,144,144) !important;
border: 0.5px solid rgb(32,32,32) !important;
padding: 3px !important;
}
/* ------------------------------------------------------------ */
/* Option menu - Top menu */ /* ==================================== DARK MODE */
/* ------------------------------------------------------------ */
*#appMenu-popup .subviewbutton .toolbarbutton-text, /* TEXT style */
*#appMenu-popup .panel-arrowcontent,
*panelmultiview .toolbaritem-combined-buttons>label {
*}
.appMenu-tp-separator, /* HORIZONTAL BORDERS */
toolbarseparator {
display: visible !important;
border-color: rgb(128,128,128) !important;
}
#appMenu-zoomReset-button { /* ZOOM CONTROl xx% */
background: transparent !important;
color: rgb(169,169,169) !important;
border: 0px solid rgb(169,169,169) !important;
border-radius: 0px !important;
}
/* ------------------------------------------------------------ */
/* Option menu - First sub-menu */ /* ==================================== DARK MODE */
/* ------------------------------------------------------------ */
.panel-header { /* TOP HEADER */
color: rgb(192,192,192) !important;
background: rgb(48,48,48) !important;
border-bottom: 1px solid rgb(128,128,128) !important;
}
/* ------------------------------------------------------------ */
/* Overflow menu */
/* ------------------------------------------------------------ */
#overflowMenu-customize-button { /* Bottom area "Customise Toolbar..." */
font-weight: 550 !important;
color: rgb(184,184,184) !important; /* ==================================== DARK MODE */
background-color: rgb(52,52,52) !important; /* ==================================== DARK MODE */
}
#overflowMenu-customize-button:hover { /* Bottom area "Customise Toolbar..." HOVER */
font-weight: 550 !important;
color: rgb(0,0,0) !important; /* ==================================== DARK MODE */
background-color: rgb(144,144,144) !important; /* ==================================== DARK MODE */
}
#widget-overflow-mainView { /* Elements in Overflow Menu */
color: rgb(184,184,184) !important; /* ==================================== DARK MODE */
background-color: rgb(52,52,52) !important; /* ==================================== DARK MODE */
}
.widget-overflow-list .toolbarbutton-1 { /* Overwrite previous "scale" command for toolbarbutton-1 */
transform: scale(1, 1) !important;
}
.widget-overflow-list .toolbarbutton-1 > .toolbarbutton-text {
-moz-box-align: center !important;
padding-top: 4px !important;
padding-bottom: 4px !important;
}
.widget-overflow-list .toolbarbutton-icon { /* Icons, colour */
fill: rgb(184,184,184) !important; /* ==================================== DARK MODE */
}
.widget-overflow-list:hover .toolbarbutton-icon { /* Icons, HOVER colour */
fill: rgb(32,32,32) !important; /* ==================================== DARK MODE */
}
/* ------------------------------------------------------------ */
/* Context menu */
/* ------------------------------------------------------------ */
#contentAreaContextMenu>*>*>image { /* Assign colour to icon on the right-hand side */
fill: currentColor !important;
-moz-context-properties: fill, fill-opacity, stroke !important;
}
#context-navigation, #context-sep-navigation {
display: none !important
}
/* ------------------------------------------------------------ */
/* Miscellanueous */
/* ------------------------------------------------------------ */
#confirmation-hint {
display: none !important; /* hide "Saved to Library!" bookmark confirmation popup */
}
#appMenu-library-recentHighlights {
display: none !important;
}
#urlbar-zoom-button {
display:none!important /* remove ZOOM info from URL bar */
}
#pageAction-panel-default-bookmark-folder_gustiaux_com,
#pageAction-panel-builtInSeparator { /* remove DEFAULT BOOKMARK FOLDER add-on line from Page Actions */
display:none!important
}
/* ------------------------------------------------------------ */
/* Library menu */ /* ==================================== DARK MODE */
/* Credits for the initial inspiration: Izheil */
/* github.com/Izheil/Quantum-Nox-Firefox-Dark-Full-Theme */
/* ------------------------------------------------------------ */
#placesView, #placesView .scrollbox-innerbox, #downloadsRichListBox,
#infoPane, #placesList, #placeContent {
-moz-appearance: none !important;
background: rgb(32,32,32) !important; /* Background */
color: rgb(220,220,220) !important; /* Text and icons */
}
#placesList { /* Text and icons left-hand side */
color: rgb(220,220,220) !important;}
/* ------------------------------------------------------------ */
/* All treechildren (list-like) elements */
treechildren::-moz-tree-row(even) {
background-color: rgb(40,40,40) !important}
treechildren::-moz-tree-row(odd) {
background-color: rgb(32,32,32) !important}
treechildren::-moz-tree-row(hover) {
background: rgb(60,60,60) !important}
treechildren::-moz-tree-row(selected) {
background: rgb(60,60,60) !important}
#placeContent treechildren::-moz-tree-cell { /* Border between Name/Tag/Location columns for listed items */
border-right: none !important;
border-left: none !important}
#placeContent treechildren::-moz-tree-column { /* Border between Name/Tag/Location columns empty space below listed items */
border-right: none !important;}
/* ------------------------------------------------------------ */
/* Top header Name/Tag/Location */
#placeContent treecol {
-moz-appearance: none !important;
background: rgb(32,32,32) !important;
padding: 3px !important;
color: rgb(220,220,220) !important;
* border-left: 0.5px solid rgb(220,220,220) !important;
border-bottom: 0.5px solid rgb(220,220,220) !important}
#placeContent treecol:hover { /* Top header Name/Tag/Location on HOVER */
-moz-appearance: none !important;
background: rgb(0,0,0) !important;
color: rgb(232,232,232) !important}
/* ------------------------------------------------------------ */
/* Top toolbar where the buttons are places */
#placesToolbar {
-moz-appearance: none !important;
background: rgb(32,32,32) !important; /* Background */
color: rgb(24,24,24) !important; /* Text and symbols within icons */
border-bottom: 0.5px solid rgb(220,220,220) !important}
}
#back-button > .toolbarbutton-icon,
#forward-button > .toolbarbutton-icon {
fill: rgb(24,24,24) !important; opacity: 1 !important /* symbols within back/forward buttons */
}
/* ------------------------------------------------------------ */
/* Border between left-hand tree and right-hand list */
#placesView > splitter {
border-inline-end: 0.5px solid rgb(220,220,220) !important}
/* ------------------------------------------------------------ */
/* Information box on the bottom right */
#detailsDeck {
background-color: var(--Window-bg) !important;
border-top: 0.5px solid rgb(220,220,220) !important}
/* ------------------------------------------------------------ */ /* ==================================== v4.0.15 */
/* Tag expander */
.expander-up, .expander-down {
filter: brightness(70%);
}
richlistbox { /* rectangular area which appears after pressing v */
-moz-appearance: none !important;
margin: 0px 0px !important;
}
/* ------------------------------------------------------------ */
/* facebook container / google container */
/* ------------------------------------------------------------ */
#userContext-indicator {
fill: rgb(56,56,56) !important; /* URL BAR, change colour of the fence */ /* =========================== DARK MODE */
}
#userContext-label {
display:none!important /* URL BAR, removel text label */
}
#pageActionSeparator {
display:none!important /* URL BAR, remove vertical separator */
}
.tabbrowser-tab[usercontextid] > .tab-stack >
.tab-background > .tab-bottom-line {
height: 0 !important; /* TAB, remove lower line */
}
Like this:
Like Loading...
