423 lines
11 KiB
CSS
423 lines
11 KiB
CSS
:root {
|
|
--z4ckx-bg: #14171c;
|
|
--z4ckx-icon-color: #b8bfe5;
|
|
--z4ckx-nav-toolbar-padding: 8px;
|
|
--z4ckx-sidebar-bg: var(--z4ckx-bg);
|
|
--z4ckx-sidebar-color: #b8bfe5;
|
|
--z4ckx-tab-border-radius: 0px;
|
|
--z4ckx-tab-color: #f3edff;
|
|
--z4ckx-tab-font-family: "NotoSerif NF", serif;
|
|
--z4ckx-tab-font-size: 9.5pt;
|
|
--z4ckx-tab-font-weight: 600;
|
|
--z4ckx-tab-height: 42px;
|
|
--z4ckx-tab-pinned-bg: #70c1b3;
|
|
--z4ckx-tab-selected-bg: #4d4168;
|
|
--z4ckx-tab-soundplaying-bg: #ee6c4d;
|
|
--z4ckx-urlbar-color: #b8bfe5;
|
|
--z4ckx-urlbar-focused-color: #d7d9e5;
|
|
--z4ckx-urlbar-font-family: "NotoSerif NF", serif;
|
|
--z4ckx-urlbar-font-size: 10pt;
|
|
--z4ckx-urlbar-font-weight: 800;
|
|
--z4ckx-urlbar-results-color: #e0fbfc;
|
|
--z4ckx-urlbar-results-font-family: "NotoSerif NF", serif;
|
|
--z4ckx-urlbar-results-font-size: 9pt;
|
|
--z4ckx-urlbar-results-font-weight: 700;
|
|
--z4ckx-urlbar-results-url-color: #98c1d9;
|
|
|
|
/* Overridden Firefox variables*/
|
|
--toolbar-bgcolor: var(--z4ckx-bg) !important;
|
|
--lwt-sidebar-background-color: var(--z4ckx-bg) !important;
|
|
--tab-border-radius: 0 !important;
|
|
--lwt-toolbarbutton-icon-fill-attention: #8677cf !important;
|
|
--toolbarbutton-icon-fill-attention: var(
|
|
--lwt-toolbarbutton-icon-fill-attention
|
|
) !important;
|
|
--arrowpanel-border-color: none !important;
|
|
}
|
|
|
|
::selection {
|
|
background: var(--z4ckx-tab-selected-bg) !important;
|
|
}
|
|
|
|
.toolbarbutton-icon {
|
|
fill: var(--z4ckx-icon-color) !important;
|
|
fill-opacity: 100% !important;
|
|
}
|
|
|
|
#PlacesToolbar menupopup[placespopup="true"] {
|
|
--arrowpanel-background: var(--z4ckx-bg) !important;
|
|
--arrowpanel-color: #b8bfe5 !important;
|
|
}
|
|
|
|
.tab-background[selected] {
|
|
background: var(--z4ckx-tab-selected-bg) !important;
|
|
}
|
|
|
|
/*.tab-background[selected"false"] {
|
|
background: var(--z4ckx-tab-selected-bg) !important;
|
|
opacity: 50% !important;
|
|
}*/
|
|
|
|
/* Move tabs down */
|
|
#titlebar {
|
|
order: 2;
|
|
-moz-appearance: none !important;
|
|
--tabs-navbar-shadow-size: 0px;
|
|
}
|
|
|
|
.titlebar-buttonbox-container {
|
|
display: none;
|
|
}
|
|
|
|
.titlebar-spacer[type="post-tabs"] {
|
|
display: none;
|
|
}
|
|
|
|
/* tabs */
|
|
.tab-text {
|
|
font-family: var(--z4ckx-tab-font-family);
|
|
font-weight: var(--z4ckx-tab-font-weight);
|
|
font-size: var(--z4ckx-tab-font-size) !important;
|
|
color: var(--z4ckx-tab-color);
|
|
padding: 10px !important;
|
|
}
|
|
|
|
/* Make all tabs small except selected one */
|
|
.tabbrowser-tab[fadein]:not([selected]):not([pinned]) {
|
|
max-width: 150px !important;
|
|
min-width: 150px !important;
|
|
}
|
|
|
|
/* Make selected tabs to bigger */
|
|
.tabbrowser-tab[selected][fadein]:not([pinned]) {
|
|
max-width: 200px !important;
|
|
min-width: 200px !important;
|
|
}
|
|
|
|
hbox.tab-content .tab-icon-image {
|
|
display: none !important;
|
|
}
|
|
|
|
.tabbrowser-tab {
|
|
border-radius: var(--z4ckx-tab-border-radius) !important;
|
|
height: var(--z4ckx-tab-height) !important;
|
|
margin-bottom: 6px !important;
|
|
margin-top: 4px !important;
|
|
max-height: 80% !important;
|
|
min-height: 80% !important;
|
|
}
|
|
|
|
#tabs-newtab-button > .toolbarbutton-icon {
|
|
--toolbarbutton-inner-padding: 4px !important;
|
|
}
|
|
|
|
/* Always show new tab button on hover and never otherwise */
|
|
#tabbrowser-tabs #tabs-newtab-button {
|
|
display: none;
|
|
}
|
|
|
|
#tabbrowser-tabs:hover #tabs-newtab-button {
|
|
display: flex !important;
|
|
}
|
|
|
|
/* No sound icon and text in tabs */
|
|
.tab-close-button[pinned],
|
|
#tabbrowser-tabs[closebuttons="activetab"]
|
|
> #tabbrowser-arrowscrollbox
|
|
> .tabbrowser-tab
|
|
> .tab-stack
|
|
> .tab-content
|
|
> .tab-close-button:not([selected]),
|
|
.tab-icon-pending:not([pendingicon]),
|
|
.tab-icon-pending[busy],
|
|
.tab-icon-pending[pinned],
|
|
.tab-icon-image:not([src]):not([pinned]):not([crashed])[selected],
|
|
.tab-icon-image:not([src]):not([pinned]):not([crashed]):not([sharing]),
|
|
.tab-icon-image[busy],
|
|
.tab-throbber:not([busy]),
|
|
.tab-icon-sound:not([soundplaying]):not([muted]):not([activemedia-blocked]):not(
|
|
[pictureinpicture]
|
|
),
|
|
.tab-icon-sound[pinned],
|
|
.tab-sharing-icon-overlay,
|
|
.tab-icon-overlay {
|
|
display: none;
|
|
}
|
|
|
|
/* secondary audio label ain't much use with this style, but feel free to remove the next line if you want to show it. */
|
|
.tab-secondary-label {
|
|
display: none;
|
|
}
|
|
|
|
/* show the secondary label when video is in PiP */
|
|
.tab-secondary-label[pictureinpicture] {
|
|
display: flex;
|
|
}
|
|
|
|
/**************************************************/
|
|
|
|
#urlbar {
|
|
max-width: 70% !important;
|
|
margin: 0 15% !important;
|
|
/* position: unset!important; */
|
|
}
|
|
|
|
#urlbar-results {
|
|
font-family: var(--z4ckx-urlbar-results-font-family);
|
|
font-weight: var(--z4ckx-urlbar-results-font-weight);
|
|
font-size: var(--z4ckx-urlbar-results-font-size) !important;
|
|
color: var(--z4ckx-urlbar-results-color) !important;
|
|
}
|
|
|
|
#urlbar:not([focused]) > #urlbar-background {
|
|
border: none !important;
|
|
box-shadow: none !important;
|
|
outline: none !important;
|
|
}
|
|
|
|
.urlbarView-url,
|
|
.search-panel-one-offs-container {
|
|
color: var(--z4ckx-urlbar-results-url-color) !important;
|
|
font-family: var(--z4ckx-urlbar-font-family);
|
|
font-weight: var(--z4ckx-urlbar-results-font-weight);
|
|
font-size: var(--z4ckx-urlbar-font-size) !important;
|
|
}
|
|
|
|
.urlbarView-favicon,
|
|
.urlbarView-type-icon {
|
|
display: none !important;
|
|
}
|
|
|
|
#urlbar-input {
|
|
font-size: var(--z4ckx-urlbar-font-size) !important;
|
|
color: var(--z4ckx-urlbar-color) !important;
|
|
font-family: var(--z4ckx-urlbar-font-family) !important;
|
|
font-weight: var(--z4ckx-urlbar-font-weight) !important;
|
|
text-align: center !important;
|
|
}
|
|
|
|
#urlbar-input:focus {
|
|
color: var(--z4ckx-urlbar-focused-color) !important;
|
|
}
|
|
|
|
/* Download button */
|
|
|
|
/* Hide tracking protection button */
|
|
tracking-protection-icon-container,
|
|
#identity-box {
|
|
display: none;
|
|
}
|
|
|
|
#tracking-protection-icon-box {
|
|
display: none;
|
|
}
|
|
|
|
/*#unified-extensions-button {
|
|
display: none;
|
|
}*/
|
|
|
|
panelview#unified-extensions-view {
|
|
background-color: var(--z4ckx-bg) !important;
|
|
color: var(--z4ckx-icon-color) !important;
|
|
}
|
|
|
|
/* Clean and tight extensions menu */
|
|
#unified-extensions-panel #unified-extensions-view {
|
|
width: 100% !important;
|
|
/* For firefox v115.x */
|
|
}
|
|
|
|
#unified-extensions-view {
|
|
--uei-icon-size: 22px;
|
|
/* Change icon size */
|
|
--firefoxcss-number-of-extensions-in-a-row: 3;
|
|
/* Increase to the number of icons you want in one row */
|
|
}
|
|
|
|
#unified-extensions-view .panel-header,
|
|
#unified-extensions-view .panel-header + toolbarseparator,
|
|
#unified-extensions-view .panel-subview-body + toolbarseparator,
|
|
#unified-extensions-view #unified-extensions-manage-extensions,
|
|
#unified-extensions-view .unified-extensions-item-menu-button.subviewbutton,
|
|
#unified-extensions-view
|
|
.unified-extensions-item-action-button
|
|
.unified-extensions-item-contents {
|
|
display: none !important;
|
|
}
|
|
|
|
#unified-extensions-view .panel-subview-body {
|
|
padding: 4px !important;
|
|
}
|
|
|
|
#unified-extensions-view .unified-extensions-item .unified-extensions-item-icon,
|
|
#unified-extensions-view .unified-extensions-item .toolbarbutton-badge-stack {
|
|
margin-inline-end: 0px !important;
|
|
}
|
|
|
|
#unified-extensions-view #overflowed-extensions-list,
|
|
#unified-extensions-view #unified-extensions-area,
|
|
#unified-extensions-view .unified-extensions-list {
|
|
display: grid !important;
|
|
grid-template-columns: repeat(
|
|
var(--firefoxcss-number-of-extensions-in-a-row),
|
|
auto
|
|
);
|
|
justify-items: left !important;
|
|
align-items: left !important;
|
|
}
|
|
|
|
#unified-extensions-view .unified-extensions-list .unified-extensions-item,
|
|
#unified-extensions-view .unified-extensions-list {
|
|
max-width: max-content;
|
|
}
|
|
|
|
#unified-extensions-view #unified-extensions-area {
|
|
padding-bottom: 3px !important;
|
|
border-bottom: 1px solid #aeaeae33 !important;
|
|
}
|
|
|
|
#unified-extensions-view .unified-extensions-list {
|
|
/* border-top: 1px solid #aeaeae33 !important; */
|
|
}
|
|
|
|
#wrapper-edit-controls:is([place="palette"], [place="panel"]) > #edit-controls,
|
|
#wrapper-zoom-controls:is([place="palette"], [place="panel"]) > #zoom-controls,
|
|
:is(panelview, #widget-overflow-fixed-list) .toolbaritem-combined-buttons {
|
|
margin: 0px !important;
|
|
}
|
|
|
|
/* Hide show all tabs button */
|
|
#alltabs-button {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Hide star button (bookmark) */
|
|
#star-button {
|
|
display: none;
|
|
}
|
|
|
|
@-moz-document url("about:home"),
|
|
url("about:newtab"), url("about:blank") {
|
|
.personalize-button {
|
|
display: none !important;
|
|
}
|
|
}
|
|
|
|
/* Hide reading View */
|
|
#reader-mode-button,
|
|
#readinglist-addremove-button {
|
|
display: none !important;
|
|
}
|
|
|
|
/* Remove Back button when there's nothing to go Back to */
|
|
#nav-bar:not([customizing="true"])
|
|
> #nav-bar-customization-target
|
|
> #back-button[disabled="true"] {
|
|
opacity: 0 !important;
|
|
}
|
|
|
|
/* Remove Forward button when there's nothing to go Forward to */
|
|
#nav-bar:not([customizing="true"])
|
|
> #nav-bar-customization-target
|
|
> #forward-button[disabled="true"] {
|
|
opacity: 0 !important;
|
|
}
|
|
|
|
/* Remove reload button when there's nothing to reload */
|
|
#nav-bar:not([customizing="true"])
|
|
> #nav-bar-customization-target
|
|
> #reload-button[disabled="true"] {
|
|
opacity: 0 !important;
|
|
}
|
|
|
|
#navigator-toolbox {
|
|
border-bottom: unset !important;
|
|
}
|
|
|
|
#back-button {
|
|
list-style-image: url("left-arrow.svg") !important;
|
|
}
|
|
|
|
#tabs-newtab-button {
|
|
list-style-image: url("add.svg") !important;
|
|
}
|
|
|
|
.close-icon,
|
|
.urlbar-icon {
|
|
fill: var(--z4ckx-icon-color) !important;
|
|
}
|
|
|
|
#forward-button {
|
|
list-style-image: url("right-arrow.svg") !important;
|
|
}
|
|
|
|
#urlbar-background {
|
|
background-color: var(--z4ckx-bg) !important;
|
|
border: none !important;
|
|
outline: none !important;
|
|
opacity: 0.95 !important;
|
|
}
|
|
|
|
.toolbar-items {
|
|
background-color: var(--z4ckx-bg) !important;
|
|
}
|
|
|
|
#reload-button:not([disabled="true"]),
|
|
#home-button:not([disabled="true"]) {
|
|
color: var(--z4ckx-icon-color) !important;
|
|
}
|
|
|
|
.toolbarbutton-text {
|
|
color: var(--z4ckx-icon-color) !important;
|
|
}
|
|
|
|
toolbar#nav-bar {
|
|
padding: var(--z4ckx-nav-toolbar-padding) !important;
|
|
}
|
|
|
|
toolbarbutton.bookmark-item:hover,
|
|
#PlacesToolbar menu:hover,
|
|
#PlacesToolbar menuitem:hover {
|
|
background-color: var(--z4ckx-tab-selected-bg) !important;
|
|
}
|
|
|
|
/************************************/
|
|
|
|
/*Darken panels to match theme*/
|
|
.panel-subview-body,
|
|
#appMenu-zoomReset-button,
|
|
.panel-mainview,
|
|
.panel-subviews {
|
|
color: #c5cddb !important;
|
|
background: var(--url-and-searchbar-background-color) !important;
|
|
}
|
|
|
|
.panel-subview-footer,
|
|
[class^="PanelUI-"] {
|
|
color: #c5cddb !important;
|
|
background: var(--toolbar-bgcolor) !important;
|
|
}
|
|
|
|
/*stops possible clashes with extension popups*/
|
|
.webextension-popup-browser {
|
|
background: #fff;
|
|
}
|
|
|
|
/* color bg of context menu */
|
|
menupopup {
|
|
--panel-background: var(--z4ckx-bg) !important;
|
|
--panel-border-color: none !important;
|
|
--panel-color: var(--z4ckx-icon-color) !important;
|
|
}
|
|
|
|
/* color fg of context menu */
|
|
menupopup > menuitem[_moz-menuactive="true"],
|
|
menupopup > menu[_moz-menuactive="true"],
|
|
#context-navigation
|
|
> menuitem[_moz-menuactive="true"]
|
|
> .menu-iconic-left
|
|
> .menu-iconic-icon {
|
|
color: var(--z4ckx-icon-color) !important;
|
|
background: var(--z4ckx-tab-selected-bg) !important;
|
|
}
|