762 lines
20 KiB
CSS
762 lines
20 KiB
CSS
/* Dark Mode */
|
|
:root:-moz-lwtheme-brighttext {
|
|
--bf-bg: #00000066;
|
|
--bf-color: #F2F2F2;
|
|
--bf-hover-bg: #FEFEFE20;
|
|
--bf-focused-color: #FEFEFE;
|
|
|
|
--bf-icon-color: #F2F2F2;
|
|
|
|
--bf-navbar-bg: var(--bf-bg);
|
|
--bf-urlbar-bg: var(--bf-bg);
|
|
--bf-urlbar-color: var(--bf-color);
|
|
--bf-urlbar-focused-color: var(--bf-focused-color);
|
|
--bf-urlbar-active-bg: var(--bf-bg);
|
|
--bf-urlbar-results-url-color: var(--bf-color);
|
|
|
|
--bf-tab-toolbar-bg: #000000AA;
|
|
--bf-tab-color: var(--bf-color);
|
|
--bf-tab-selected-bg: var(--bf-bg);
|
|
|
|
--bf-sidebar-bg: var(--bf-bg);
|
|
--bf-sidebar-color: var(--bf-color);
|
|
--bf-splitter-bg: var(--bf-bg);
|
|
|
|
--bf-menupopup-bg: var(--bf-bg);
|
|
--bf-menupopup-color: var(--bf-color);
|
|
|
|
--autocomplete-popup-background: var(--bf-bg) !important;
|
|
--default-arrowpanel-background: var(--bf-bg) !important;
|
|
--lwt-toolbarbutton-icon-fill: var(--bf-icon-color) !important;
|
|
}
|
|
|
|
/* Light Mode */
|
|
:root:-moz-lwtheme-darktext {
|
|
--bf-bg: #F2F2F662;
|
|
--bf-color: #252525;
|
|
--bf-hover-bg: #1A1A1A20;
|
|
--bf-focused-color: #0A0A0A;
|
|
|
|
--bf-icon-color: #0A0A0A;
|
|
|
|
--bf-navbar-bg: var(--bf-bg);
|
|
--bf-urlbar-bg: var(--bf-bg);
|
|
--bf-urlbar-color: var(--bf-color);
|
|
--bf-urlbar-focused-color: var(--bf-focused-color);
|
|
--bf-urlbar-active-bg: var(--bf-bg);
|
|
--bf-urlbar-results-url-color: var(--bf-color);
|
|
|
|
--bf-tab-toolbar-bg: #F2F2F2AA;
|
|
--bf-tab-color: var(--bf-color);
|
|
--bf-tab-selected-bg: var(--bf-bg);
|
|
|
|
--bf-sidebar-bg: var(--bf-bg);
|
|
--bf-sidebar-color: var(--bf-color);
|
|
--bf-splitter-bg: var(--bf-bg);
|
|
|
|
--bf-menupopup-bg: var(--bf-bg);
|
|
--bf-menupopup-color: var(--bf-color);
|
|
|
|
--autocomplete-popup-background: var(--bf-bg) !important;
|
|
--default-arrowpanel-background: var(--bf-bg) !important;
|
|
--lwt-toolbarbutton-icon-fill: var(--bf-icon-color) !important;
|
|
}
|
|
|
|
/* Global/Default Variable */
|
|
/* Set variables regardless of colorscheme */
|
|
:root {
|
|
--bf-bg: #252525;
|
|
--bf-color: #F2F2F2;
|
|
--bf-hover-bg: #353535;
|
|
--bf-focused-color: #FEFEFE;
|
|
--bf-icon-color: var(--bf-color);
|
|
|
|
--bf-navbar-bg: #252525CC;
|
|
--bf-urlbar-bg: #252525;
|
|
--bf-urlbar-color: var(--bf-color);
|
|
--bf-urlbar-focused-color: var(--bf-focused-color);
|
|
--bf-urlbar-active-bg: var(--bf-urlbar-bg);
|
|
--bf-urlbar-results-url-color: var(--bf-color);
|
|
|
|
--bf-tab-toolbar-bg: var(--bf-bg);
|
|
--bf-tab-color: var(--bf-color);
|
|
--bf-tab-selected-bg: #1A1A1A;
|
|
|
|
--bf-sidebar-bg: var(--bf-bg);
|
|
--bf-sidebar-color: var(--bf-color);
|
|
--bf-splitter-bg: var(--bf-bg);
|
|
--bf-sidebar-searchbar-bg: #1A1A1A;
|
|
|
|
--bf-menupopup-bg: var(--bf-bg);
|
|
--bf-menupopup-color: var(--bf-color);
|
|
|
|
--autocomplete-popup-background: var(--bf-bg) !important;
|
|
--default-arrowpanel-background: var(--bf-bg) !important;
|
|
--lwt-toolbarbutton-icon-fill: var(--bf-icon-color) !important;
|
|
|
|
/* All the CSS variables below are global */
|
|
/* These applies to all color schemes */
|
|
|
|
/* If windows - `-moz-win-glass`, if macOS - `-moz-mac-vibrancy-dark` */
|
|
--bf-moz-appearance: -moz-win-glass !important;
|
|
|
|
--bf-sidebar-searchbar-radius: 6px;
|
|
|
|
--bf-backdrop-blur: 6px;
|
|
--bf-accent-bg: #4C5FF9CC;
|
|
|
|
--bf-urlbar-radius: 9px;
|
|
--bf-urlbar-results-font-size: 12pt;
|
|
--bf-urlbar-results-font-weight: 550;
|
|
--bf-urlbar-font-size: 12pt;
|
|
--bf-urlbar-font-weight: 500;
|
|
|
|
--bf-navbar-padding: 6px;
|
|
--bf-switch-tab-color: #6498EF;
|
|
--bf-bookmark-color: #53E2AE;
|
|
|
|
--bf-tab-font-size: 11pt;
|
|
--bf-tab-font-weight: 400;
|
|
--bf-tab-height: 36px;
|
|
--bf-tab-border-radius: 8px;
|
|
--bf-tab-soundplaying-bg: #985EFFCC;
|
|
|
|
--default-arrowpanel-color: #fefefa !important;
|
|
--panel-disabled-color: #f9f9fa80;
|
|
--toolbar-bgcolor: transparent !important;
|
|
--urlbar-separator-color: transparent !important;
|
|
}
|
|
|
|
/*
|
|
░▀█▀░█▀▄░█▀█░█▀█░█▀▀░█▀█░█▀█░█▀▄░█▀▀░█▀█░█▀▀░█░█
|
|
░░█░░█▀▄░█▀█░█░█░▀▀█░█▀▀░█▀█░█▀▄░█▀▀░█░█░█░░░░█░
|
|
░░▀░░▀░▀░▀░▀░▀░▀░▀▀▀░▀░░░▀░▀░▀░▀░▀▀▀░▀░▀░▀▀▀░░▀░
|
|
|
|
Transparent Window
|
|
*/
|
|
#main-window {
|
|
background: transparent !important;
|
|
font-kerning: normal;
|
|
border: none !important;
|
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
}
|
|
|
|
/*
|
|
░█▀▀░█▀█░█▀█░▀█▀
|
|
░█▀▀░█░█░█░█░░█░
|
|
░▀░░░▀▀▀░▀░▀░░▀░
|
|
|
|
I'm not sure if this does something
|
|
*/
|
|
|
|
* {
|
|
-webkit-font-smoothing: antialiased;
|
|
-moz-osx-font-smoothing: grayscale;
|
|
text-rendering: optimizeLegibility;
|
|
font-variant-ligatures: none;
|
|
font-kerning: normal;
|
|
}
|
|
|
|
/*
|
|
░▀█▀░█▀█░█▀█░█░░░█▀▄░█▀█░█▀▄
|
|
░░█░░█░█░█░█░█░░░█▀▄░█▀█░█▀▄
|
|
░░▀░░▀▀▀░▀▀▀░▀▀▀░▀▀░░▀░▀░▀░▀
|
|
|
|
Contains navbar, urlbar, and etc.
|
|
*/
|
|
|
|
.browser-toolbar {
|
|
background: var(--bf-tab-toolbar-bg) !important;
|
|
}
|
|
|
|
toolbar {
|
|
background-image: none !important;
|
|
}
|
|
|
|
toolbar#nav-bar {
|
|
background: var(--bf-navbar-bg) !important;
|
|
padding: var(--bf-navbar-padding) !important;
|
|
|
|
/* Remove horizontal line on navbar */
|
|
box-shadow: none !important;
|
|
border-top: none !important;
|
|
}
|
|
|
|
toolbarbutton {
|
|
box-shadow: none !important;
|
|
margin-left: 2px !important;
|
|
}
|
|
|
|
.toolbarbutton-1 {
|
|
--toolbarbutton-hover-background: var(--bf-hover-bg) !important;
|
|
--toolbarbutton-active-background: var(--bf-hover-bg) !important;
|
|
}
|
|
|
|
/* URL bar max-width and centered hack */
|
|
#urlbar {
|
|
max-width: 70% !important;
|
|
margin: 0 15% !important;
|
|
}
|
|
|
|
/* URL bar and toolbar height if not compact mode */
|
|
:root:not([uidensity="compact"]) #urlbar {
|
|
--urlbar-height: 36px !important;
|
|
--urlbar-toolbar-height: 40px !important;
|
|
}
|
|
|
|
/* URL bar and toolbar height if compact mode */
|
|
:root[uidensity="compact"] #urlbar {
|
|
--urlbar-height: 30px !important;
|
|
--urlbar-toolbar-height: 34px !important;
|
|
}
|
|
|
|
#urlbar-input:focus {
|
|
color: var(--bf-urlbar-focused-color) !important;
|
|
}
|
|
|
|
#urlbar-background {
|
|
background: var(--bf-urlbar-bg) !important;
|
|
border-radius: var(--bf-urlbar-radius) !important;
|
|
border: none !important;
|
|
}
|
|
|
|
.urlbar-icon:not([disabled]):hover,
|
|
.urlbar-icon-wrapper:not([disabled]):hover {
|
|
background: var(--bf-hover-bg) !important;
|
|
}
|
|
|
|
.urlbar-icon[open],
|
|
.urlbar-icon-wrapper[open],
|
|
.urlbar-icon:not([disabled]):hover:active,
|
|
.urlbar-icon-wrapper:hover:active {
|
|
background: var(--bf-hover-bg) !important;
|
|
}
|
|
|
|
.urlbar-icon-wrapper[open] > .urlbar-icon,
|
|
.urlbar-icon-wrapper > .urlbar-icon:hover,
|
|
.urlbar-icon-wrapper > .urlbar-icon:hover:active {
|
|
background: var(--bf-hover-bg) !important;
|
|
}
|
|
|
|
#urlbar[breakout-extend="true"]:not([open="true"]) > #urlbar-background {
|
|
box-shadow: none !important;
|
|
display: none !important;
|
|
background: transparent !important;
|
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
}
|
|
|
|
#urlbar[open="true"] > #urlbar-background {
|
|
background: var(--bf-urlbar-active-bg) !important;
|
|
backdrop-filter: blur(var(--bf-backdrop-blur)) !important;
|
|
}
|
|
|
|
.urlbar-icon {
|
|
color: var(--bf-icon-color) !important;
|
|
}
|
|
|
|
.urlbar-icon > image {
|
|
fill: var(--bf-icon-color) !important;
|
|
color: var(--bf-icon-color) !important;
|
|
}
|
|
|
|
.urlbarView-favicon,
|
|
.urlbarView-type-icon {
|
|
display: none !important;
|
|
}
|
|
|
|
.urlbarView-row[type="bookmark"] > span{
|
|
color: var(--bf-bookmark-color) !important;
|
|
}
|
|
|
|
.urlbarView-row[type="switchtab"] > span{
|
|
color: var(--bf-switch-tab-color) !important;
|
|
}
|
|
|
|
#urlbar-results {
|
|
-weight: var(--bf-urlbar-results-font-weight);
|
|
font-size: var(--bf-urlbar-results-font-size) !important;
|
|
color: var(--bf-urlbar-results-color) !important;
|
|
}
|
|
|
|
/* Hover background color */
|
|
.urlbarView-row-inner:hover {
|
|
background: var(--bf-accent-bg) !important;
|
|
}
|
|
|
|
.urlbarView-url, .search-panel-one-offs-container {
|
|
color: var(--bf-urlbar-results-url-color) !important;
|
|
font-weight: var(--bf-urlbar-results-font-weight);
|
|
font-size: var(--bf-urlbar-font-size) !important;
|
|
}
|
|
|
|
#urlbar-input {
|
|
font-size: var(--bf-urlbar-font-size) !important;
|
|
color: var(--bf-urlbar-color) !important;
|
|
font-weight: var(--bf-urlbar-font-weight)!important;
|
|
text-align: center !important;
|
|
}
|
|
|
|
#searchbar {
|
|
background: var(--bf-bg) !important;
|
|
border: none !important;
|
|
}
|
|
|
|
.searchbar-textbox {
|
|
color: var(--bf-focus-fg) !important;
|
|
font-weight: 700 !important;
|
|
}
|
|
|
|
/* URL bar hightlight color */
|
|
::-moz-selection {
|
|
background-color: var(--bf-accent-bg) !important;
|
|
}
|
|
|
|
/* Bookmark button - Star button */
|
|
#star-button {
|
|
/* URL bar bookmark button */
|
|
display: none !important;
|
|
}
|
|
|
|
#star-button:hover:not(.no-hover):not([open=true]) {
|
|
background: var(--bf-hover-bg) !important;
|
|
}
|
|
|
|
#star-button:hover:active:not(.no-hover),
|
|
#star-button[open=true] {
|
|
background: var(--bf-hover-bg) !important;
|
|
}
|
|
|
|
#navigator-toolbox,
|
|
toolbaritem {
|
|
border: none !important;
|
|
}
|
|
|
|
#navigator-toolbox::after {
|
|
border-bottom: 0 !important;
|
|
}
|
|
|
|
.toolbarbutton-text {
|
|
color: var(--bf-icon-color) !important;
|
|
}
|
|
|
|
/* Back button */
|
|
#back-button > .toolbarbutton-icon {
|
|
--backbutton-background: transparent !important;
|
|
border: none !important;
|
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
}
|
|
|
|
/* Tracking */
|
|
#tracking-protection-icon-container {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Identity */
|
|
#identity-box {
|
|
display: none !important;
|
|
}
|
|
|
|
#identity-box:hover:not(.no-hover):not([open=true]),
|
|
#tracking-protection-icon-container:hover:not(.no-hover):not([open=true]) {
|
|
background: var(--bf-hover-bg) !important;
|
|
}
|
|
|
|
#identity-box:hover:active:not(.no-hover),
|
|
#identity-box[open=true],
|
|
#tracking-protection-icon-container:hover:active:not(.no-hover),
|
|
#tracking-protection-icon-container[open=true] {
|
|
background: var(--bf-hover-bg) !important;
|
|
}
|
|
|
|
/*
|
|
░▀█▀░█▀█░█▀▄░█▀▄░█▀█░█▀▄
|
|
░░█░░█▀█░█▀▄░█▀▄░█▀█░█▀▄
|
|
░░▀░░▀░▀░▀▀░░▀▀░░▀░▀░▀░▀
|
|
|
|
The tabs container
|
|
*/
|
|
|
|
/* Move tab bar beneath the url bar */
|
|
#titlebar {
|
|
-moz-box-ordinal-group: 1 !important;
|
|
|
|
/* Uncomment the line below to move tabbar below navbar */
|
|
/* -moz-box-ordinal-group: 3 !important; */
|
|
}
|
|
|
|
#titlebar::after {
|
|
border-bottom: 0 !important;
|
|
}
|
|
|
|
/* Transparent tabs */
|
|
.toolbar-items {
|
|
background-color: transparent !important;
|
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
}
|
|
|
|
/* Set minimum height for tab bar */
|
|
#tabbrowser-tabs {
|
|
--tab-min-height: 0;
|
|
margin-top: 4px !important;
|
|
margin-bottom: 4px !important;
|
|
margin-left: 20px !important;
|
|
margin-right: 20px !important;
|
|
}
|
|
|
|
/* Hide solo tab */
|
|
/*
|
|
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"]:only-of-type {
|
|
visibility: collapse;
|
|
}
|
|
*/
|
|
|
|
/* Hide New Tab Button immediately next to solo tab */
|
|
/*
|
|
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"]:only-of-type + toolbarbutton {
|
|
visibility: collapse;
|
|
}
|
|
*/
|
|
|
|
/* Stretch Tabs */
|
|
.tabbrowser-tab[fadein]:not([pinned]) {
|
|
max-width: none !important;
|
|
}
|
|
|
|
.tab-background {
|
|
border: none !important;
|
|
background: transparent !important;
|
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
}
|
|
|
|
.tab-background[selected="true"] {
|
|
background: var(--bf-tab-selected-bg) !important;
|
|
}
|
|
|
|
.tab-background:not[visuallyselected] {
|
|
background: var(--bf-tab-selected-bg) !important;
|
|
opacity: 0.5 !important;
|
|
}
|
|
|
|
/* Remove the all the "lines" in tab sides */
|
|
/*
|
|
.tabbrowser-tab::after,
|
|
.tabbrowser-tab::before {
|
|
border-left: none !important;
|
|
}
|
|
*/
|
|
|
|
/* Remove the lines on the side of the selected tab */
|
|
.tabbrowser-tab[beforeselected-visible="true"]::after,
|
|
.tabbrowser-tab[beforeselected-visible="true"]::before,
|
|
.tabbrowser-tab[selected="true"]::after,
|
|
.tabbrowser-tab[selected="true"]::before {
|
|
border-left: none !important;
|
|
}
|
|
|
|
/* Style all the lines before and after selected tab */
|
|
.tabbrowser-tab::after,
|
|
.tabbrowser-tab::before {
|
|
border-width: 1px !important;
|
|
}
|
|
|
|
.tabbrowser-arrowscrollbox {
|
|
margin-inline-start: 4px !important;
|
|
margin-inline-end: 0 !important;
|
|
}
|
|
|
|
.tab-text {
|
|
font-weight: var(--bf-tab-font-weight);
|
|
font-size: var(--bf-tab-font-size) !important;
|
|
color: var(--bf-tab-color);
|
|
}
|
|
|
|
/* Center all content */
|
|
.tab-content {
|
|
justify-content: center;
|
|
align-items: center;
|
|
margin-top: -1px;
|
|
min-width: 100% !important;
|
|
padding: 0 10px !important;
|
|
}
|
|
|
|
/* A way to center the label and icon while
|
|
the close button is positioned to the far right */
|
|
.tab-content::before{
|
|
content: "";
|
|
display: -moz-box;
|
|
-moz-box-flex: 1
|
|
}
|
|
|
|
/* Tab close button */
|
|
.tab-close-button {
|
|
/* display: none !important; */
|
|
}
|
|
|
|
/* Prevent tab icons size breaking */
|
|
.tab-icon-image, .tab-icon-sound,
|
|
.tab-throbber, .tab-throbber-fallback,
|
|
.tab-close-button {
|
|
min-width: 16px;
|
|
}
|
|
|
|
/* Adjust tab label width */
|
|
.tab-label-container {
|
|
min-width: 3px !important;
|
|
}
|
|
|
|
/* If tab close button is not present, don't force favicon to the center */
|
|
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]) .tab-throbber,
|
|
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]) .tab-throbber-fallback,
|
|
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]):not([busy]) .tab-icon-image,
|
|
#tabbrowser-tabs[closebuttons="activetab"] .tabbrowser-tab:not([selected="true"]):not([image]) .tab-label-container {
|
|
margin-left: 0 !important;
|
|
}
|
|
|
|
/* Tab icon */
|
|
hbox.tab-content .tab-icon-image {
|
|
display: initial !important;
|
|
}
|
|
|
|
/* Show the icon of pinned tabs */
|
|
hbox.tab-content[pinned=true] .tab-icon-image {
|
|
display: initial !important;
|
|
}
|
|
|
|
/* Hide text of pinned tabs */
|
|
hbox.tab-content[pinned=true] .tab-text {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Hide the blue line on top of tab */
|
|
.tab-line, .tab-bottom-line {
|
|
display: none !important;
|
|
}
|
|
|
|
.tabbrowser-tab {
|
|
border-radius: var(--bf-tab-border-radius) !important;
|
|
border-width: 0;
|
|
height: var(--bf-tab-height) !important;
|
|
overflow: hidden;
|
|
margin-top: 0 !important;
|
|
margin-bottom: 0 !important;
|
|
}
|
|
|
|
.tabbrowser-tab:hover {
|
|
background: var(--bf-hover-bg) !important;
|
|
box-shadow: 0 1px 4px rgba(0,0,0,.05);
|
|
}
|
|
|
|
/* Audio playing background */
|
|
.tabbrowser-tab[soundplaying="true"] {
|
|
background-color: var(--bf-tab-soundplaying-bg) !important;
|
|
}
|
|
|
|
#tabbrowser-tabs {
|
|
--tab-loading-fill: var(--bf-color) !important;
|
|
}
|
|
|
|
/* Hide icon of audio */
|
|
.tab-icon-sound {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Center pinned tab stack(Contains icon) if #tabbrowser-tabs[positionpinnedtabs=true] */
|
|
#tabbrowser-tabs[positionpinnedtabs=true] .tabbrowser-tab[pinned=true] .tab-stack {
|
|
position: relative !important;
|
|
top: 50% !important;
|
|
transform: translateY(-50%) !important;
|
|
}
|
|
|
|
|
|
.private-browsing-indicator {
|
|
display: block;
|
|
background: transparent;
|
|
}
|
|
|
|
/* Remove hover effects on tab bar buttons */
|
|
#TabsToolbar {
|
|
--toolbarbutton-active-background: transparent !important;
|
|
--toolbarbutton-hover-background: transparent !important;
|
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
}
|
|
|
|
/* Left to Right Alignment of tabs toolbar */
|
|
/* #TabsToolbar {
|
|
direction: rtl;
|
|
}
|
|
|
|
#tabbrowser-tabs {
|
|
direction: ltr;
|
|
}
|
|
*/
|
|
|
|
/*
|
|
░█▀▀░▀█▀░█▀▄░█▀▀░█▀▄░█▀█░█▀▄
|
|
░▀▀█░░█░░█░█░█▀▀░█▀▄░█▀█░█▀▄
|
|
░▀▀▀░▀▀▀░▀▀░░▀▀▀░▀▀░░▀░▀░▀░▀
|
|
|
|
Sidebar
|
|
*/
|
|
|
|
#sidebar-box {
|
|
--sidebar-background-color: var(--bf-sidebar-bg) !important;
|
|
--sidebar-text-color: var(--bf-sidebar-color) !important;
|
|
}
|
|
|
|
#sidebar,
|
|
.sidebar-panel {
|
|
background: transparent !important;
|
|
color: var(--bf-sidebar-color) !important;
|
|
}
|
|
|
|
/* Sidebar searchbar */
|
|
#sidebar-search-container #search-box{
|
|
-moz-appearance:none !important;
|
|
background-color: var(--bf-sidebar-searchbar-bg) !important;
|
|
border: none !important;
|
|
color: var(--bf-color) !important;
|
|
padding: 6px !important;
|
|
border-radius: var(--bf-sidebar-searchbar-radius) !important;
|
|
}
|
|
|
|
/*
|
|
░█▀█░█▀▄░█▀▄░█▀█░█░█░█▀█░█▀█░█▀█░█▀▀░█░░
|
|
░█▀█░█▀▄░█▀▄░█░█░█▄█░█▀▀░█▀█░█░█░█▀▀░█░░
|
|
░▀░▀░▀░▀░▀░▀░▀▀▀░▀░▀░▀░░░▀░▀░▀░▀░▀▀▀░▀▀▀
|
|
|
|
The dropdown menus
|
|
*/
|
|
|
|
.panel-arrowcontent {
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
}
|
|
|
|
toolbarseparator {
|
|
display: none !important;
|
|
}
|
|
|
|
box.panel-arrowbox {
|
|
display: none;
|
|
}
|
|
|
|
box.panel-arrowcontent {
|
|
border-radius: 8px !important;
|
|
border: none !important;
|
|
}
|
|
|
|
/*
|
|
░█▀▀░▀█▀░█▀█░█▀▄░█▀▄░█▀█░█▀▄
|
|
░█▀▀░░█░░█░█░█░█░█▀▄░█▀█░█▀▄
|
|
░▀░░░▀▀▀░▀░▀░▀▀░░▀▀░░▀░▀░▀░▀
|
|
|
|
The findbar
|
|
*/
|
|
|
|
#browser #appcontent #tabbrowser-tabbox findbar,
|
|
#browser #appcontent #tabbrowser-tabbox tabpanels {
|
|
-moz-appearance: none !important;
|
|
background: transparent !important;
|
|
border: none !important;
|
|
-moz-appearance: var(--bf-moz-appearance) !important;
|
|
}
|
|
|
|
#browser #appcontent #tabbrowser-tabbox findbar {
|
|
background-color: var(--bf-bg) !important;
|
|
}
|
|
|
|
.findbar-find-previous,
|
|
.findbar-find-next {
|
|
margin: 0 !important;
|
|
border: none !important;
|
|
}
|
|
#browser #appcontent #tabbrowser-tabbox .findbar-find-fast {
|
|
background-color: var(--bf-bg) !important;
|
|
}
|
|
|
|
/*
|
|
░█▀▀░█▀█░█▀█░▀█▀░█▀▀░█░█░▀█▀░█▄█░█▀▀░█▀█░█░█
|
|
░█░░░█░█░█░█░░█░░█▀▀░▄▀▄░░█░░█░█░█▀▀░█░█░█░█
|
|
░▀▀▀░▀▀▀░▀░▀░░▀░░▀▀▀░▀░▀░░▀░░▀░▀░▀▀▀░▀░▀░▀▀▀
|
|
|
|
Right-click menu
|
|
*/
|
|
|
|
menupopup, popup,
|
|
popup > menu > menupopup,
|
|
menupopup > menu > menupopup {
|
|
-moz-appearance: none !important;
|
|
background: var(--bf-menupopup-bg) !important;
|
|
color: var(--base-color) !important;
|
|
border: 0 !important;
|
|
border-radius: 4px !important;
|
|
padding: 2px 0 2px 0 !important;
|
|
}
|
|
|
|
menupopup menuseparator {
|
|
-moz-appearance: none !important;
|
|
background: #525A6D !important;
|
|
margin: 2px 0 2px 0 !important;
|
|
padding: 0 !important;
|
|
border-top: none !important;
|
|
border-color: transparent !important;
|
|
}
|
|
|
|
/*
|
|
░█▀▀░█░█░█▀▀░▀█▀░█▀█░█▄█░▀█▀░▀▀█░█▀█░▀█▀░▀█▀░█▀█░█▀█░█░█░▀█▀░█▀█░█▀▄░█▀█░█░█
|
|
░█░░░█░█░▀▀█░░█░░█░█░█░█░░█░░▄▀░░█▀█░░█░░░█░░█░█░█░█░█▄█░░█░░█░█░█░█░█░█░█▄█
|
|
░▀▀▀░▀▀▀░▀▀▀░░▀░░▀▀▀░▀░▀░▀▀▀░▀▀▀░▀░▀░░▀░░▀▀▀░▀▀▀░▀░▀░▀░▀░▀▀▀░▀░▀░▀▀░░▀▀▀░▀░▀
|
|
|
|
The customization window
|
|
*/
|
|
|
|
#customization-container {
|
|
background: var(--bf-bg) !important;
|
|
}
|
|
|
|
.customizationmode-button {
|
|
-moz-appearance: none !important;
|
|
background: var(--bf-bg) !important;
|
|
color: var(--bf-color) !important;
|
|
padding: 5px !important;
|
|
border-radius: 6px !important;
|
|
}
|
|
|
|
.customizationmode-button:hover {
|
|
-moz-appearance: none !important;
|
|
background: var(--bf-hover-bg) !important;
|
|
padding: 5px !important;
|
|
border-radius: 6px !important;
|
|
}
|
|
|
|
.customizationmode-button label {
|
|
color: var(--bf-color) !important;
|
|
}
|
|
|
|
/*
|
|
░█░█░▀█▀░█▀█░█▀▄░█▀█░█░█░█▀▄░█░█░▀█▀░▀█▀░█▀█░█▀█░█▀▀
|
|
░█▄█░░█░░█░█░█░█░█░█░█▄█░█▀▄░█░█░░█░░░█░░█░█░█░█░▀▀█
|
|
░▀░▀░▀▀▀░▀░▀░▀▀░░▀▀▀░▀░▀░▀▀░░▀▀▀░░▀░░░▀░░▀▀▀░▀░▀░▀▀▀
|
|
|
|
The control buttons. Contains, close, minimize, and maximize buttons
|
|
*/
|
|
|
|
#autohide-context {
|
|
display: none !important;
|
|
}
|
|
|
|
#window-controls[hidden="true"] {
|
|
display: none !important;
|
|
}
|
|
|
|
#window-controls[hidden="false"] {
|
|
display: inline-flex !important;
|
|
}
|
|
|
|
/* Hide titlebar-buttonbox if there's single tab */
|
|
/*
|
|
:root[tabsintitlebar][sizemode="maximized"] #titlebar .titlebar-buttonbox-container {
|
|
display: none !important;
|
|
}
|
|
*/
|