sidebery.css

userChrome.css

/* Hide Tab Toolbar */

:root{
  --uc-window-control-width: 138px; /* Space reserved for window controls */
  --uc-window-drag-space-width: 4px; /* Extra space reserved on both sides of the nav-bar to be able to drag the window */
  --uc-toolbar-height: 32px;
}

#nav-bar::before,
#nav-bar::after{
  content: "";
  display: -moz-box;
  width: var(--uc-window-drag-space-width);
}

#nav-bar {
	background: #000 !important;
}

toolbar#nav-bar::after{ width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px)) }

:root:not([uidensity="compact"]){--uc-toolbar-height: 38px}

#TabsToolbar{ visibility: collapse !important }

:root:not([inFullscreen]) #nav-bar{
  margin-top: calc(0px - var(--uc-toolbar-height));
}

#toolbar-menubar{
  min-height:unset !important;
  height:var(--uc-toolbar-height) !important;
  position: relative;
}

#main-menubar{
  -moz-box-flex: 1;
  background-color: var(--toolbar-bgcolor,--toolbar-non-lwt-bgcolor);
  background-clip: padding-box;
  border-image: linear-gradient(to left, transparent, var(--toolbar-bgcolor,--toolbar-non-lwt-bgcolor) 30px) 20 / 30px
}

#toolbar-menubar:not([inactive]){ z-index: 2 }
#toolbar-menubar[inactive] > #menubar-items {
	opacity: 0;
	pointer-events: none;
	margin-left: var(--uc-window-drag-space-width,0px)
}


:root {
  --sidebar-min-width: 33px;
  --sidebar-visible-width: 300px;
}

#sidebar-header {
  overflow: hidden !important;
}

#tabbrowser-tabs {
  visibility: collapse !important;
}

#sidebar-box #sidebar-header {
  display: none !important;
}

#sidebar,
#sidebar-header {
  position: relative !important;
  min-width: var(--sidebar-min-width) !important;
  max-width: var(--sidebar-min-width) !important;
  z-index:1;
}

#sidebar-box:hover :-moz-any(#sidebar,#sidebar-header) {
  background-color: var(--toolbar-bgcolor) !important;
  min-width: var(--sidebar-visible-width) !important;
  max-width: var(--sidebar-visible-width) !important;
  margin-right: calc((var(--sidebar-visible-width) - var(--sidebar-min-width)) * -1) !important;
  z-index:1;
  position: relative !important;
}

#TabsToolbar > .toolbar-items,
#TabsToolbar > .titlebar-spacer{ visibility: hidden }
#nav-bar{ margin-top: -32px; margin-right: 20px; padding: 0px 150px 0px 0px !important; }


/* Autohide Sidebar */
/* Sidebar min and max width removal */
/*
#sidebar {
	max-width: none !important;
	min-width: 0px !important;
    border-right: 1px solid rgba(0,0,0,.25);
}
/* Hide splitter, when using Tree Style Tab. 
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] + #sidebar-splitter {
	display: none !important;
}
/* Hide sidebar header, when using Tree Style Tab. 
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] #sidebar-header {
	visibility: collapse;
}
*/
/* Shrink sidebar until hovered, when using Tree Style Tab. */
/*
:root {
	--thin-tab-width: 38px;
	--wide-tab-width: 200px;
}
#sidebar-box:not([sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"]) {
	min-width: var(--wide-tab-width) !important;
	max-width: none !important;
}
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] {
	position: relative !important;
	transition: all 300ms !important;
	min-width: var(--thin-tab-width) !important;
	max-width: var(--thin-tab-width) !important;
}
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"]:hover {
	transition: all 300ms !important;
	min-width: var(--wide-tab-width) !important;
	max-width: var(--wide-tab-width) !important;
    z-index:1;
	/* Negative right-margin to keep page from being pushed to the side. 
	margin-right: calc((var(--wide-tab-width) - var(--thin-tab-width)) * -1) !important;
}
*/

/* Hide .twisty and adjust margins so favicons have 7px on left. */
.tab .twisty {
	visibility: hidden;
	margin-left: -8px;
}

/* Push tab labels slightly to the right so they're completely hidden in collapsed state */
.tab .label {
	margin-left: 9px;
}

/* Hide 'new tab' button. */
.newtab-button {
	display: none;
}

/* Dark Theme */

:root, #background {
  background: #38383d;
}

.tab * {
  color: #ffffff;
}

.tab {
  height: 48px;
  border-bottom: 0.5px solid #5A5A5C;
  background: #474749;
}

.tab:not(.active):hover,
.after-tabs button:hover {
  background: #5C5C61;
}

.tab.active{
  background: #7f7f7f;
}


/* Backdrop filter URLbar + glow removed */
#urlbar-background {
    display: none !important;
}

#urlbar[breakout][breakout-extend] {
    top: 0px !important;
    left: 0px !important;
    width: 100% !important;
}

#urlbar-input-container {
    border: none !important;
}

#urlbar[breakout][breakout-extend] > #urlbar-input-container {
    height: var(--urlbar-toolbar-height) !important;
    padding-block: 0px !important;
    padding-inline: 0px !important;
}

#urlbar-results {
    padding: 0px !important;
}

.urlbarView {
    margin-inline: 0px !important;
    border: none !important;
    width: 100% !important;
    #box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, .32) !important;
    clip-path: inset(0px -20px -30px -20px) !important;
    animation: none !important;
    margin-block-start: 0px !important;
    outline: none;
}

.urlbarView-results {
    padding-block: 0px !important;
}

.urlbarView .urlbarView-row {
    border-radius: 0px !important;
    padding-block: 0px !important;
}

.urlbarView-row-inner {
    border-radius: 0px !important;
}

.urlbarView-body-inner {
    border: none !important;
}

.urlbarView-title {
    height: 18px !important;
}

@supports (backdrop-filter: blur(1px)) {
    .urlbarView {
        background: #0C0C0DC0 !important;
        backdrop-filter: blur(28px) !important;
    }
}

/* 
layout.css.backdrop-filter.enabled
Enables transparency/blur on the search box too */
.search-one-offs, .search-panel-header, .search-panel-one-offs {
    background: none !important;
}

/* DISABLE EXPANDING START */
#urlbar[breakout][breakout-extend] {
    top: calc((var(--urlbar-toolbar-height) - var(--urlbar-height)) / 2) !important;
    left: 0 !important;
    width: 100% !important;
}

#urlbar[breakout][breakout-extend] > #urlbar-input-container {
    height: var(--urlbar-height) !important;
    padding-block: 0 !important;
    padding-inline: 0 !important;
}

#urlbar[breakout][breakout-extend] > #urlbar-background {
    animation-name: none !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .05) !important;
}
/* DISABLE EXPANDING END */

/* REMOVE URL RESULT PADDING START */
.urlbarView-row {
    padding-block: 0 !important;
}
/* REMOVE URL RESULT PADDING END */

/* MOVE URL RESULT TYPE ICON TO LEFT START */
.urlbarView-type-icon {
    min-width: 16px !important;
    height: 16px !important;
    margin-bottom: 0 !important;
    margin-inline-start: 0 !important;
}

.urlbarView-favicon {
    margin-inline-start: 20px !important;
}
/* MOVE URL RESULT TYPE ICON TO LEFT END */

/* REMOVES BLUE GLOW FROM SHADOWFOX START */
#urlbar[focused=true],
.searchbar-textbox[focused=true] {
    border: 1px solid !important;
    box-shadow: none !important;
    border-color: transparent !important;
}
/* REMOVES BLUE GLOW FROM SHADOWFOX END */

/* CHANGES HOVER COLOR ON URL RESULT START */
#urlbar-results.urlbarView-results div.urlbarView-row:hover {
    /* Black because I'm using a dark theme */
    background-color: black !important;
}
/* CHANGES HOVER COLOR ON URL RESULT END */

/*
 * Description: A dark right-click chrome-like context menu.
 *
 * Screenshot: https://imgur.com/neMpGJl
 *
 * Contributor(s): jy1263
 */
/**
menupopup {
	-moz-appearance: none !important;
	padding: 8px 2px 8px 2px !important;
	background-color: #2B2B2B !important;
	border: 1px #A0A0A0 solid !important;
	min-width: 280px !important;
}
menuseparator {
	-moz-appearance: none !important;
	border: none !important;
	padding: .5px 0px .5px 0px !important;
	margin: 4px 8px 4px 8px !important;
	background-color: #808080 !important;
}
menuitem, menu {
	-moz-appearance: none !important;
	color: white !important;
	padding: 5px 0px 5px 0px !important;
}
menuitem[disabled="true"], menuitem[disabled="true"] > .menu-text {
	color: gray !important;
}
menuitem:hover, menu:hover, menu[open="true"], menuitem[_moz-menuactive="true"]	 {
	-moz-appearance: none !important;
	padding: 5px 0px 5px 0px !important;
	background-color: #414141 !important;
}
menugroup {
	padding: 0px !important;
	background-color: transparent !important;
}
menuitem > .menu-text, menuitem > .menu-iconic-text {
	color: white !important;
}
menuitem[type="checkbox"] {
	padding-left: 8px !important;
	padding-top: 6.5px !important;
	padding-bottom: 6.5px !important;
}
menuitem[type="radio"] {
	padding-left: 8px !important;
	padding-top: 6.5px !important;
	padding-bottom: 6.5px !important;
}
menuitem[type="checkbox"] > .menu-iconic-text, menuitem[type="radio"] > .menu-iconic-text {
	padding-left: 5px !important;
}
menuitem[checked="true"][type="checkbox"] > .menu-iconic-left {
	padding: 7px 0px 0px 0px !important;
	border: solid white;
	border-width: 0 0 2px 2px;
	transform: rotate(-45deg) scale(.75);
	margin-bottom: 4px !important;
}
menuitem[checked="true"][type="radio"] > .menu-iconic-left {
	padding: 1px !important;
	border: solid white;
	height: 17px !important;
	border-radius: 100%;
	background: white;
	transform: scale(.5); 
}
menucaption {
	background-color: transparent !important;
	color: white !important;
}
#ContentSelectDropdown > menupopup {
	background-image: none !important;
}
#ContentSelectDropdown {
	padding: 0px !important;
}
menulist {
	-moz-appearance: none !important;
	padding: 4px 4px 4px 4px !important;
	border: 2px solid #666666 !important;
	background-color: transparent !important;
}
menulist:hover {
	padding: 4px 4px 4px 4px !important;
	border: 2px solid #999999 !important;
	background-color: transparent !important;
}
menulist[open="true"]  {
	border: 2px solid #666666 !important;
	background-color: #333333 !important;
}
#context-back > .menu-iconic-left, #context-forward > .menu-iconic-left, #context-reload > .menu-iconic-left, #context-stop > .menu-iconic-left, #context-bookmarkpage > .menu-iconic-left {
	padding: 0px !important;
}
.menu-iconic-left {
	-moz-appearance: none !important;
	padding: 0px 5px 0px 9px !important;
}
tooltip {
	-moz-appearance: none !important;
	color: white !important;
	background-color: #2B2B2B !important;
	border: 1px solid #767676 !important;
	padding: 6.5px !important;
}
/*
 * Description: A dark right-click chrome-like context menu.
*  end;
*/

/*
 * Remove "Send Page to Device", "Send Link to Device", 
 * "Send Tab to Device" from context menu.
 *
 * Contributor(s): PilzAdam
 */

#context-sendpagetodevice, #context-sep-sendpagetodevice,
#context-sendlinktodevice, #context-sep-sendlinktodevice,
#context_sendTabToDevice, #context_sendTabToDevice_separator {
  display: none !important;
}

/*
 * Hides the website name (when present) from the address bar, keeping only the location abbrevation.
 *
 * Contributor(s): Madis0
 */

#identity-icon-label { /* Hides the EV SSL label */
  visibility: collapse !important;
}

#identity-box:hover > #identity-icon-labels > #identity-icon-label { /* Shows the label on identity box hover */
  visibility: visible !important;
}

/*
 * Description: Hides the Tracking Protection icon.
 *
 * Contributor(s): Joachim Vandersmissen, Strappazzon
 */

/*#tracking-protection-icon-box {
  visibility: collapse !important;
}

#identity-box:hover > #tracking-protection-icon-box {
  visibility: visible !important;
}*/

/*
 * Replaces the insecure site broken padlock with the error symbol used for extensions that are incompatible with e10s.
 *
 * Contributor(s): Madis0
 */

#urlbar[pageproxystate="valid"] > #identity-box.notSecure > #connection-icon,
#urlbar[pageproxystate="valid"] > #identity-box.insecureLoginForms > #connection-icon,
#urlbar[pageproxystate="valid"] > #identity-box.mixedActiveContent > #connection-icon {
  list-style-image: url("chrome://mozapps/skin/extensions/alerticon-error.svg") !important; 
}

/*
 * Reduces the padding/margins on the new (since Firefox 75) "breakout" navbar dropdown,
 * so it looks less like a mobile layout
 *
 * Screenshot: https://github.com/Timvde/UserChrome-Tweaks/pull/170
 *
 * Contributor(s): udf
 */

/* Remove padding on urlbar results */
.urlbarView-row {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

/* Remove padding on urlbar (icons on the right break without this) */
#urlbar-input-container {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

/* Reduce "breakout" navbar height */
#urlbar[breakout][breakout-extend] > #urlbar-input-container {
  height: calc(var(--urlbar-toolbar-height) - 4px) !important;
}

/* Fix breakout positioning being too high after we decreased the height */
#urlbar[breakout][breakout-extend] {
  top: 2px !important;
}

/* Remove padding on search one offs div */
.search-one-offs {
  padding-block: 0px !important;
}

/* Fix padding left of the search one-off icons */
.search-panel-one-offs {
  padding-left: 7px !important;
}

/* Remove margins around the search one-off icons */
.searchbar-engine-one-off-item {
  margin: 0px !important;
}

/*
 * Makes the website name (when present) of certificate appear in black, normal-styled text 
 * like seen in built-in and extension pages. Goes well with hide-ssl-lock.css
 *
 * Contributor(s): Madis0
 */

#urlbar > #identity-box.verifiedIdentity > #identity-icon-labels > #identity-icon-label,
#urlbar > #identity-box.verifiedIdentity > #identity-icon-labels > #identity-icon-country-label {
  color: rgba(38, 50, 56, 0.867) !important;
}

/*
 * Move the identity icon and SSL lock to the end of the address bar, 
 * move/adjust the 3-dot page action button to make it look better
 *
 * Contributor(s): Madis0, Mart3323
 */

#PopupAutoCompleteRichResult .autocomplete-richlistitem {
  padding-inline-start: var(--item-padding-end) !important;
}

#urlbar > #identity-box
{
  -moz-box-ordinal-group: 99 !important; /* Move identity box to the end */
  border-inline-end: none !important; /* Remove any right borders from it (internal pages, EV SSL) */
  margin-inline-end: 0em !important; /* Remove the end margin */
  margin-inline-start: -0.2em !important; /* Remove the start margin */
}

#urlbar > #page-action-buttons > #pageActionButton {
  -moz-box-ordinal-group: 99 !important; /* Move the 3-dot page action button to the rightmost of page action icons */
}

.urlbar-input-box
{
  margin-left: 0.5em !important; /* Add some margin back to left of urlbar to make it prettier */
} /* If you're using reload-button-addressbar-left.css, set the value to 2em. */


/** border seearchline delete **/

#tracking-protection-icon-container, #identity-box[pageproxystate="valid"].notSecureText, #identity-box[pageproxystate="valid"].chromeUI, #identity-box[pageproxystate="valid"].extensionPage, #urlbar-label-box {
	border-image-slice: unset !important;
}

/** blure **/