@layer LowPriority, HighPriority;
@import "special/windows.css" layer(HighPriority) /* supports() */ (-moz-platform: windows);
@import "special/linux.css" layer(HighPriority) /* supports() */ (-moz-platform: linux);
@import "special/mac.css" layer(HighPriority) /* supports() */ (-moz-platform: macos);
@import "Lepton_Icons/icons/Lepton_Icons.css" /* layer() supports() */ (-moz-bool-pref: "userChrome.Menu.Icons.LeptonIcons.Enabled");
@import "third_party_custom_styles.css" /* layer() supports() */ (-moz-bool-pref: "userChrome.Style.ThirdParty.Enabled");
@layer LowPriority
{
@media (-moz-platform: windows),
(-moz-platform: linux),
(-moz-platform: macos)
{
/* ---------------------------------------- Tabs (SVG) ---------------------------------------- */
:root
{
@media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled")
{
--left-svg: url("special/tabs/option_1/left_corners.svg");
--center-svg: url("special/tabs/option_1/center.svg");
--right-svg: url("special/tabs/option_1/right_corners.svg");
}
@media (-moz-bool-pref: "userChrome.Tabs.Option2.Enabled")
{
--left-svg: url("special/tabs/option_2/left_corners.svg");
--center-svg: url("special/tabs/option_2/center.svg");
--right-svg: url("special/tabs/option_2/right_corners.svg");
}
@media (-moz-bool-pref: "userChrome.Tabs.Option3.Enabled")
{
--left-svg: url("special/tabs/option_3/left_corners.svg");
--center-svg: url("special/tabs/option_3/center.svg");
--right-svg: url("special/tabs/option_3/right_corners.svg");
}
@media (-moz-bool-pref: "userChrome.Tabs.Option4.Enabled")
{
--left-svg: url("special/tabs/option_4/left_corners.svg");
--center-svg: url("special/tabs/option_4/center.svg");
--right-svg: url("special/tabs/option_4/right_corners.svg");
}
@media (-moz-bool-pref: "userChrome.Tabs.Option5.Enabled")
{
--left-svg: url("special/tabs/option_5/left_corners.svg");
--center-svg: url("special/tabs/option_5/center.svg");
--right-svg: url("special/tabs/option_5/right_corners.svg");
}
@media (-moz-bool-pref: "userChrome.Tabs.Option6.Enabled")
{
--left-svg: url("special/tabs/option_1/left_corners.svg");
--center-svg: url("special/tabs/option_1/center.svg");
--right-svg: url("special/tabs/option_1/right_corners.svg");
--tab-first-last-inline-margin: calc(var(--tab-min-height) / 4);
}
@media (-moz-bool-pref: "userChrome.Tabs.Option7.Enabled")
{
--left-svg: url("special/tabs/option_6/left_corners.svg");
--center-svg: url("special/tabs/option_6/center.svg");
--right-svg: url("special/tabs/option_6/right_corners.svg");
--tab-first-last-inline-margin: calc(var(--tab-min-height) / 4);
--outer-drop-border-offset: 1px;
}
@media (-moz-bool-pref: "userChrome.Tabs.Option8.Enabled")
{
--left-svg: url("special/tabs/option_7/left_corners.svg");
--center-svg: url("special/tabs/option_7/center.svg");
--right-svg: url("special/tabs/option_7/right_corners.svg");
--tab-first-last-inline-margin: calc(var(--tab-min-height) / 4);
--outer-drop-border-offset: 1px;
}
@media (-moz-bool-pref: "userChrome.Tabs.Option9.Enabled")
{
--left-svg: url("special/tabs/option_8/left_corners.svg");
--center-svg: url("special/tabs/option_8/center.svg");
--right-svg: url("special/tabs/option_8/right_corners.svg");
--tab-first-last-inline-margin: calc(var(--tab-min-height) / 2 - 6px);
--outer-drop-border-offset: 1px;
}
@media (-moz-bool-pref: "userChrome.Tabs.Option10.Enabled")
{
--left-svg: url("special/tabs/option_9/left_corners.svg");
--center-svg: url("special/tabs/option_9/center.svg");
--right-svg: url("special/tabs/option_9/right_corners.svg");
--tab-first-last-inline-margin: calc(var(--tab-min-height) / 2);
--outer-drop-border-offset: 1px;
}
@media (-moz-bool-pref: "userChrome.Tabs.Option11.Enabled")
{
--left-svg: url("special/tabs/option_10/left_corners.svg");
--center-svg: url("special/tabs/option_10/center.svg");
--right-svg: url("special/tabs/option_10/right_corners.svg");
--tab-first-last-inline-margin: calc(var(--tab-min-height) / 2);
--outer-drop-border-offset: 1px;
}
@media (-moz-bool-pref: "userChrome.Tabs.Option12.Enabled")
{
--left-svg: url("special/tabs/option_11/left_corners.svg");
--center-svg: url("special/tabs/option_11/center.svg");
--right-svg: url("special/tabs/option_11/right_corners.svg");
--tab-first-last-inline-margin: calc(var(--tab-min-height) / 2);
--outer-drop-border-offset: 1px;
}
@media (-moz-bool-pref: "userChrome.Tabs.Option13.Enabled")
{
--left-svg: url("special/tabs/option_12/left_corners.svg");
--center-svg: url("special/tabs/option_12/center.svg");
--right-svg: url("special/tabs/option_12/right_corners.svg");
--tab-first-last-inline-margin: calc(var(--tab-min-height) / 2);
--outer-drop-border-offset: 1px;
}
/* -------------------- Floating Tabs -------------------- */
@media (-moz-bool-pref: "userChrome.Tabs.Option1.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option2.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option3.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option4.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option5.Enabled")
{
--tab-first-last-inline-margin: calc(var(--tab-block-margin) / 2);
--tab-overflow-clip-margin: var(--tab-first-last-inline-margin);
--tab-inset-clip-path: 0px calc(-1 * var(--tab-first-last-inline-margin));
--tab-scroll-animation-inline-margin: calc(-1 * var(--tab-first-last-inline-margin));
--tab-scroll-animation-inline-padding: calc(var(--tab-first-last-inline-margin) * 2);
--tab-bg-block-margin: var(--tab-block-margin);
--tab-inline-padding: var(--tab-first-last-inline-margin);
--tab-separator-offset: var(--tab-first-last-inline-margin);
}
/* -------------------- Attached Tabs -------------------- */
@media (-moz-bool-pref: "userChrome.Tabs.Option6.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option7.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option8.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option9.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option10.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option11.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option12.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option13.Enabled")
{
--tab-overflow-clip-margin: var(--tab-first-last-inline-margin);
--tab-inset-clip-path: -4px calc(-1 * var(--tab-first-last-inline-margin)) 0px;
--tab-scroll-animation-inline-margin: calc(-1 * var(--tab-first-last-inline-margin));
--tab-scroll-animation-inline-padding: var(--tab-first-last-inline-margin);
--tab-bg-block-margin: 0px;
--tab-inline-padding: 0px;
--tab-separator-offset: 0px;
}
}
/* ---------------------------------------- Tab Bar Shadows ---------------------------------------- */
@media (-moz-bool-pref: "userChrome.LightTheme.Tabs.Shadows.Saturation.Low.Enabled") or
(-moz-bool-pref: "userChrome.LightTheme.Tabs.Shadows.Saturation.Medium.Enabled") or
(-moz-bool-pref: "userChrome.LightTheme.Tabs.Shadows.Saturation.High.Enabled") or
(-moz-bool-pref: "userChrome.LightTheme.Tabs.Shadows.Saturation.VeryHigh.Enabled")
{
@media (prefers-color-scheme: light)
{
:root
{
--shadow-blur: 4px;
--shadow-color: rgb(0, 0, 0);
--outer-box-shadow: 0
0
var(--shadow-blur)
color-mix(in srgb, var(--shadow-color) var(--shadow-saturation), transparent);
--inner-box-shadow: inset
0
calc(-1 * var(--shadow-blur))
var(--shadow-blur)
calc(-1 * var(--shadow-blur))
color-mix(in srgb, var(--shadow-color) var(--shadow-saturation), transparent);
--outer-drop-shadow: drop-shadow(
0
0
calc(var(--shadow-blur) / 2)
color-mix(in srgb, var(--shadow-color) var(--shadow-saturation), transparent));
/* ---------- Saturation ---------- */
@media (-moz-bool-pref: "userChrome.LightTheme.Tabs.Shadows.Saturation.Low.Enabled")
{
--shadow-saturation: 10%;
}
@media (-moz-bool-pref: "userChrome.LightTheme.Tabs.Shadows.Saturation.Medium.Enabled")
{
--shadow-saturation: 25%;
}
@media (-moz-bool-pref: "userChrome.LightTheme.Tabs.Shadows.Saturation.High.Enabled")
{
--shadow-saturation: 50%;
}
@media (-moz-bool-pref: "userChrome.LightTheme.Tabs.Shadows.Saturation.VeryHigh.Enabled")
{
--shadow-saturation: 100%;
}
}
}
}
@media (-moz-bool-pref: "userChrome.DarkTheme.Tabs.Shadows.Saturation.Low.Enabled") or
(-moz-bool-pref: "userChrome.DarkTheme.Tabs.Shadows.Saturation.Medium.Enabled") or
(-moz-bool-pref: "userChrome.DarkTheme.Tabs.Shadows.Saturation.High.Enabled") or
(-moz-bool-pref: "userChrome.DarkTheme.Tabs.Shadows.Saturation.VeryHigh.Enabled")
{
@media (prefers-color-scheme: dark)
{
:root
{
--shadow-blur: 4px;
--shadow-color: rgb(0, 0, 0);
--outer-box-shadow: 0
0
var(--shadow-blur)
color-mix(in srgb, var(--shadow-color) var(--shadow-saturation), transparent);
--inner-box-shadow: inset
0
calc(-1 * var(--shadow-blur))
var(--shadow-blur)
calc(-1 * var(--shadow-blur))
color-mix(in srgb, var(--shadow-color) var(--shadow-saturation), transparent);
--outer-drop-shadow: drop-shadow(
0
0
calc(var(--shadow-blur) / 2)
color-mix(in srgb, var(--shadow-color) var(--shadow-saturation), transparent));
/* ---------- Saturation ---------- */
@media (-moz-bool-pref: "userChrome.DarkTheme.Tabs.Shadows.Saturation.Low.Enabled")
{
--shadow-saturation: 25%;
}
@media (-moz-bool-pref: "userChrome.DarkTheme.Tabs.Shadows.Saturation.Medium.Enabled")
{
--shadow-saturation: 50%;
}
@media (-moz-bool-pref: "userChrome.DarkTheme.Tabs.Shadows.Saturation.High.Enabled")
{
--shadow-saturation: 75%;
}
@media (-moz-bool-pref: "userChrome.DarkTheme.Tabs.Shadows.Saturation.VeryHigh.Enabled")
{
--shadow-saturation: 100%;
}
}
}
}
/* ---------------------------------------- Tab Bar Borders ---------------------------------------- */
@media (-moz-bool-pref: "userChrome.LightTheme.Tabs.Borders.Enabled")
{
@media (prefers-color-scheme: light)
{
:root
{
--my-border-width: 1px;
--my-border-color: var(--chrome-content-separator-color);
--outer-box-border: 0 0 0 var(--my-border-width) var(--my-border-color);
--inner-box-border: inset 0 calc(-1 * var(--my-border-width)) 0 var(--my-border-color);
--outer-drop-border: drop-shadow(
0
calc(-1 * var(--my-border-width))
0
var(--my-border-color))
drop-shadow(
var(--my-border-width)
var(--outer-drop-border-offset, 0)
0
var(--my-border-color))
drop-shadow(
0
var(--my-border-width)
0
var(--my-border-color))
drop-shadow(
calc(-1 * var(--my-border-width))
var(--outer-drop-border-offset, 0)
0
var(--my-border-color));
}
}
}
@media (-moz-bool-pref: "userChrome.DarkTheme.Tabs.Borders.Enabled")
{
@media (prefers-color-scheme: dark)
{
:root
{
--my-border-width: 1px;
--my-border-color: var(--chrome-content-separator-color);
--outer-box-border: 0 0 0 var(--my-border-width) var(--my-border-color);
--inner-box-border: inset 0 calc(-1 * var(--my-border-width)) 0 var(--my-border-color);
--outer-drop-border: drop-shadow(
0
calc(-1 * var(--my-border-width))
0
var(--my-border-color))
drop-shadow(
var(--my-border-width)
var(--outer-drop-border-offset, 0)
0
var(--my-border-color))
drop-shadow(
0
var(--my-border-width)
0
var(--my-border-color))
drop-shadow(
calc(-1 * var(--my-border-width))
var(--outer-drop-border-offset, 0)
0
var(--my-border-color));
}
}
}
/* ---------------------------------------- System Theme ---------------------------------------- */
@media not (prefers-contrast)
{
:root:not([lwtheme])
{
.tabbrowser-tab[visuallyselected]
{
color: var(--toolbar-color) !important;
.tab-background
{
background-color: var(--toolbar-bgcolor) !important;
}
}
}
}
/* ---------------------------------------- Light Theme / Dark Theme ---------------------------------------- */
:root:is(
[style*="--lwt-accent-color: rgb(240, 240, 244); --lwt-text-color: rgba(21, 20, 26)"],
[style*="--lwt-accent-color: rgb(28, 27, 34); --lwt-text-color: rgba(251, 251, 254)"]
)
{
.tabbrowser-tab[visuallyselected]
{
color: var(--toolbar-color) !important;
.tab-background
{
background-color: var(--toolbar-bgcolor) !important;
}
}
}
/* ---------------------------------------- Pinned Tabs Width ---------------------------------------- */
@media (-moz-bool-pref: "userChrome.Tabs.Pinned.Width.LowOffset.Enabled")
{
:root
{
--pinned-tabs-width-offset: 2px;
}
}
@media (-moz-bool-pref: "userChrome.Tabs.Pinned.Width.HighOffset.Enabled")
{
:root
{
--pinned-tabs-width-offset: 4px;
}
}
/* ---------------------------------------- Firefox View ---------------------------------------- */
:where(toolbarbutton, toolbarpaletteitem) + #tabbrowser-tabs
{
border-inline-start: none !important;
padding-inline-start: var(--tab-overflow-pinned-tabs-width) !important;
margin-inline-start: 0px !important;
}
#TabsToolbar #firefox-view-button[open] > .toolbarbutton-icon
{
background-color: var(--toolbarbutton-active-background) !important;
color: inherit !important;
box-shadow: none !important;
outline: none !important;
}
#TabsToolbar #firefox-view-button:hover:not([open]) > .toolbarbutton-icon
{
background-color: var(--toolbarbutton-hover-background) !important;
}
#TabsToolbar #firefox-view-button[attention]
{
background-position: var(--tab-attention-indicator-position) !important;
}
/* ---------------------------------------- Main Window ---------------------------------------- */
:root
{
--tab-shadow-max-size: 0px !important;
--tab-attention-indicator-position: 50% calc(50% + 12px);
}
/* ---------------------------------------- Nav Bar ---------------------------------------- */
#nav-bar
{
border: none !important;
}
/* ---------------------------------------- Titlebar ---------------------------------------- */
:root[tabsintitlebar]
{
#titlebar
{
will-change: auto !important;
transition: none !important;
opacity: 1 !important;
}
&:-moz-window-inactive .titlebar-color
{
color: color-mix(in srgb, currentColor 60%, transparent) !important;
--toolbarbutton-icon-fill: currentColor !important;
}
}
/* ---------------------------------------- Density ---------------------------------------- */
:root[uidensity="compact"]
{
--tab-min-height: 32px !important;
}
:root[uidensity="touch"]
{
--tab-min-height: 40px !important;
}
/* ---------------------------------------- Context Menu (Not System Related) ---------------------------------------- */
@media (-moz-bool-pref: "userChrome.Menu.Size.Compact.Enabled") or
(-moz-bool-pref: "userChrome.Menu.Size.Normal.Enabled") or
(-moz-bool-pref: "userChrome.Menu.Size.Touch.Enabled")
{
:root
{
--arrowpanel-menuitem-margin-block: 0px !important;
--arrowpanel-menuitem-margin-inline: var(--browser-context-menu-margin-padding) !important;
--arrowpanel-menuitem-padding-block: var(--browser-context-menu-margin-padding) !important;
--arrowpanel-menuitem-padding-inline: var(--browser-context-menu-margin-padding) !important;
--panel-separator-margin-horizontal: var(--browser-context-menu-margin-padding) !important;
--panel-separator-margin-vertical: var(--browser-context-menu-margin-padding) !important;
--panel-subview-body-padding-block: var(--browser-context-menu-margin-padding) !important;
--panel-subview-body-padding-inline: 0px !important;
@media (-moz-bool-pref: "userChrome.Menu.Size.Compact.Enabled")
{
--browser-context-menu-margin-padding: 4px;
}
@media (-moz-bool-pref: "userChrome.Menu.Size.Normal.Enabled")
{
--browser-context-menu-margin-padding: 6px;
}
@media (-moz-bool-pref: "userChrome.Menu.Size.Touch.Enabled")
{
--browser-context-menu-margin-padding: 8px;
}
}
}
/* -------------------- Extensions menu -------------------- */
#unified-extensions-panel
{
--uei-icon-size: 24px !important;
}
#unified-extensions-panel .unified-extensions-item
{
margin-block: 0px !important;
}
#unified-extensions-panel :is(
.unified-extensions-item-name,
.unified-extensions-item-message-deck > *
)
{
overflow: hidden !important;
white-space: nowrap !important;
text-overflow: ellipsis !important;
}
/* ---------------------------------------- Drag Space ---------------------------------------- */
@media (-moz-bool-pref: "userChrome.DragSpace.Left.Disabled")
{
.titlebar-spacer[type="pre-tabs"]
{
display: none !important;
}
}
@media (-moz-bool-pref: "userChrome.DragSpace.Right.Disabled")
{
.titlebar-spacer[type="post-tabs"]
{
display: none !important;
}
}
@media (-moz-bool-pref: "userChrome.DragSpace.Top.Windowed.Enabled")
{
:root[sizemode="normal"]
{
--drag-space: 8px;
}
}
@media (-moz-bool-pref: "userChrome.DragSpace.Top.Maximized.Enabled")
{
:root[sizemode="maximized"]
{
--drag-space: 8px;
}
}
@media (-moz-bool-pref: "userChrome.DragSpace.Top.Fullscreen.Enabled")
{
:root[sizemode="fullscreen"]
{
--drag-space: 8px;
}
}
#TabsToolbar :is(.tabbrowser-tab, .toolbarbutton-1, separator, #personal-bookmarks, #search-container, .accessibility-indicator, .private-browsing-indicator, #private-browsing-indicator-with-label)
{
margin-top: var(--drag-space, 0px) !important;
}
/* ---------- Shadow DOM ---------- */
#tabbrowser-arrowscrollbox
{
--margin-top: var(--drag-space, 0px) !important;
}
#scrollbutton-up,
#scrollbutton-down,
spacer[part="overflow-start-indicator"],
spacer[part="overflow-end-indicator"]
{
margin-top: var(--margin-top, revert) !important;
}
/* ---------------------------------------- Tabs ---------------------------------------- */
.tabbrowser-tab
{
--tab-label-mask-size: 0px !important;
overflow-x: clip !important;
overflow-y: visible !important;
overflow-clip-margin: var(--tab-overflow-clip-margin) !important;
clip-path: inset(var(--tab-inset-clip-path)) !important;
padding-inline: var(--tab-inline-padding) !important;
&[visuallyselected]
{
position: relative;
z-index: 2 !important;
filter: var(--outer-drop-border, drop-shadow(0 0 0 transparent))
var(--outer-drop-shadow, drop-shadow(0 0 0 transparent));
}
&:not([visuallyselected])
{
color: inherit !important;
&:hover .tab-background
{
background-color: var(--toolbarbutton-hover-background) !important;
}
&[multiselected] .tab-background
{
background-color: var(--toolbarbutton-active-background) !important;
}
}
.tab-background
{
mask-image: var(--left-svg), var(--center-svg), var(--right-svg);
mask-size: auto 100%, calc(100% - var(--tab-min-height) * 2) 100%, auto 100%;
mask-position: left center, center center, right center;
mask-repeat: no-repeat, no-repeat, no-repeat;
box-shadow: none !important;
outline: none !important;
margin-block: var(--tab-bg-block-margin) !important;
margin-inline: calc(-1 * (var(--tab-min-height) / 2)) !important;
border-radius: 0px !important;
pointer-events: none !important;
}
&[pinned] .tab-content
{
padding-inline: calc((var(--tab-min-height) - 16px) / 2 + var(--pinned-tabs-width-offset, 0px)) !important;
}
&:not([pinned]) .tab-content
{
padding-inline: 10px !important;
}
}
.tab-drop-indicator
{
opacity: 0 !important;
}
#tabbrowser-tabs[movingtab] .tabbrowser-tab:not([visuallyselected])
{
z-index: auto !important;
}
.tabbrowser-tab[pending] .tab-icon-image
{
opacity: 0.5 !important;
}
.tab-close-button
{
width: 16px !important;
height: 16px !important;
border-radius: 50% !important;
padding: 2px !important;
margin: 0px !important;
}
.tab-close-button:hover
{
background-color: var(--toolbarbutton-hover-background) !important;
}
.tab-close-button:hover:active
{
background-color: var(--toolbarbutton-active-background) !important;
}
/* -------------------- Selected Tab Indicator -------------------- */
@media (-moz-bool-pref: "userChrome.Tabs.SelectedTabIndicator.Enabled")
{
.tabbrowser-tab[visuallyselected][usercontextid] .tab-background
{
box-shadow: inset 0 -2px 0 var(--tab-loading-fill) !important;
}
.tabbrowser-tab[visuallyselected]:not([usercontextid]) .tab-background
{
box-shadow: inset 0 2px 0 var(--tab-loading-fill) !important;
}
}
/* -------------------- Tab Counter -------------------- */
#tabbrowser-tabs
{
counter-reset: TabCounter;
}
.tabbrowser-tab
{
counter-increment: TabCounter;
}
#tabbrowser-tabs ~ #alltabs-button::after
{
content: counter(TabCounter);
}
/* -------------------- Container Indicators -------------------- */
.tab-context-line
{
margin: 0px !important;
}
/* -------------------- Tab Icon Indicators -------------------- */
.tabbrowser-tab:is([image], [pinned]) .tab-content[attention]:not([selected]),
.tab-content[pinned][titlechanged]:not([selected])
{
background-position: var(--tab-attention-indicator-position) !important;
}
/* -------------------- Media Icons -------------------- */
.tab-icon-overlay:not([crashed])
{
stroke: transparent !important;
background-color: transparent !important;
border-radius: 50% !important;
color: inherit !important;
fill: currentColor !important;
fill-opacity: 1 !important;
z-index: 1 !important;
}
.tab-icon-overlay:not([crashed]):hover
{
background-color: var(--toolbarbutton-hover-background) !important;
}
.tab-icon-overlay:not([crashed]):hover:active
{
background-color: var(--toolbarbutton-active-background) !important;
}
.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):not([crashed]) .tab-icon-overlay
{
top: -8px !important;
inset-inline-end: -8px !important;
}
.tab-icon-overlay[indicator-replaces-favicon],
.tab-icon-stack[indicator-replaces-favicon] > :not(.tab-icon-overlay)
{
opacity: 1 !important;
}
.tabbrowser-tab:not([pinned]) .tab-icon-stack > *
{
margin-inline-end: 10px !important;
}
.tabbrowser-tab[busy] .tab-icon-overlay
{
display: none !important;
}
.tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([busy], [crashed]) .tab-icon-stack > :not(.tab-icon-overlay)
{
mask-image: url("special/Additional_Elements/Media.svg");
mask-size: 16px 16px;
}
:root:-moz-locale-dir(rtl) .tabbrowser-tab:is([pinned], [image], [sharing], [pictureinpicture]):is([soundplaying], [muted], [activemedia-blocked]):not([busy], [crashed]) .tab-icon-stack > :not(.tab-icon-overlay)
{
mask-image: url("special/Additional_Elements/Media_rtl.svg");
}
/* ---------- Picture-In-Picture ---------- */
.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before
{
content: "";
display: block;
position: absolute;
width: 16px;
height: 16px;
background-color: currentColor;
mask-size: 16px 16px;
mask-position: center center;
mask-repeat: no-repeat;
}
:root:-moz-locale-dir(rtl) .tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack::before
{
transform: rotateY(180deg);
}
.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]) .tab-icon-stack > :not(.tab-icon-overlay)
{
position: relative !important;
padding: 2px !important;
inset-inline-start: 8px !important;
top: 8px !important;
mask-image: none !important;
box-sizing: border-box !important;
z-index: 1 !important;
}
.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):not([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before
{
mask-image: url("special/Additional_Elements/PIP.svg");
}
.tabbrowser-tab[pictureinpicture]:not([busy], [crashed]):is([soundplaying], [muted], [activemedia-blocked]) .tab-icon-stack::before
{
mask-image: url("special/Additional_Elements/PIP_Sound.svg");
}
/* -------------------- Tab Text -------------------- */
.tab-label-container
{
height: var(--tab-min-height) !important;
}
.tab-label
{
width: 100% !important;
height: 16px !important;
line-height: 16px !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
margin-block: 0px !important;
}
#tabbrowser-tabs[secondarytext-unsupported] .tab-label
{
height: var(--tab-min-height) !important;
line-height: var(--tab-min-height) !important;
}
.tab-secondary-label
{
width: 100% !important;
height: 16px !important;
line-height: 16px !important;
margin-block: 0px !important;
order: -1 !important;
}
.tab-secondary-label > *
{
width: 100% !important;
height: 16px !important;
line-height: 16px !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
/* ---------------------------------------- Tab Bar ---------------------------------------- */
#TabsToolbar
{
--toolbarbutton-inner-padding: inherit !important;
position: relative !important;
}
#TabsToolbar::before
{
content: "";
display: block;
position: absolute;
width: 100%;
height: 100%;
bottom: 0px;
inset-inline-start: 0px;
box-shadow: var(--inner-box-border, inset 0 0 0 transparent),
var(--inner-box-shadow, inset 0 0 0 transparent);
pointer-events: none;
z-index: 2;
}
#TabsToolbar #search-container
{
padding-block: 0 !important;
}
/* ---------------------------------------- Indents ---------------------------------------- */
#TabsToolbar-customization-target > :is(toolbarbutton, toolbaritem):first-child,
#TabsToolbar-customization-target > toolbarpaletteitem:first-child > :is(toolbarbutton, toolbaritem)
{
margin-inline-start: calc(var(--toolbar-start-end-padding) - var(--toolbarbutton-outer-padding)) !important;
}
#TabsToolbar-customization-target > :is(toolbarbutton, toolbaritem):last-child,
#TabsToolbar-customization-target > toolbarpaletteitem:last-child > :is(toolbarbutton, toolbaritem)
{
margin-inline-end: calc(var(--toolbar-start-end-padding) - var(--toolbarbutton-outer-padding)) !important;
}
#tabbrowser-tabs:not([overflow]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden]))
{
margin-inline-start: 0px !important;
}
#tabbrowser-tabs:not([overflow]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([hidden])),
#tabbrowser-tabs[overflow] .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden])),
#tabbrowser-tabs[overflow][haspinnedtabs]
{
margin-inline-start: var(--tab-first-last-inline-margin) !important;
}
.tabbrowser-tab:nth-last-child(1 of .tabbrowser-tab:not([hidden]))
{
margin-inline-end: var(--tab-first-last-inline-margin) !important;
}
#tabs-newtab-button
{
margin-inline-start: calc(-1 * var(--tab-first-last-inline-margin) / 2) !important;
}
.toolbarbutton-1:has(+ #tabbrowser-tabs:not([overflow])),
.toolbarbutton-1:has(+ #tabbrowser-tabs[overflow][haspinnedtabs])
{
margin-inline-end: calc(-1 * var(--tab-first-last-inline-margin) / 2 + 1px) !important;
z-index: 0 !important;
}
/* ---------------------------------------- Separators ---------------------------------------- */
@media (-moz-bool-pref: "userChrome.TabSeparators.Saturation.Low.Enabled") or
(-moz-bool-pref: "userChrome.TabSeparators.Saturation.Medium.Enabled")
{
.tab-stack
{
margin-inline-end: 1px !important;
}
.tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([hidden])) .tab-stack::before,
#tabbrowser-tabs[overflow][haspinnedtabs] .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden])) .tab-stack::before,
.tab-stack::after
{
content: "";
display: block;
position: absolute;
width: 1px;
height: 50%;
border-inline-end: 1px solid currentColor;
top: 25%;
opacity: var(--separators-color-saturation);
box-sizing: border-box;
pointer-events: none;
}
.tab-stack::before
{
inset-inline-end: 100%;
transform: translateX(calc(-1 * var(--tab-separator-offset)));
}
:root:-moz-locale-dir(rtl) .tab-stack::before
{
transform: translateX(var(--tab-separator-offset));
}
.tab-stack::after
{
inset-inline-start: 100%;
transform: translateX(var(--tab-separator-offset));
}
:root:-moz-locale-dir(rtl) .tab-stack::after
{
transform: translateX(calc(-1 * var(--tab-separator-offset)));
}
.tabbrowser-tab:not([hidden]):is([selected], :hover, [multiselected]) .tab-stack::before,
.tabbrowser-tab:not([hidden]):is([selected], :hover, [multiselected]) .tab-stack::after,
.tabbrowser-tab:not([hidden]):has(+ .tabbrowser-tab:is([selected], :hover, [multiselected]):not([hidden])) .tab-stack::after,
.tabbrowser-tab:not([hidden]):has(+ .tabbrowser-tab[hidden] + .tabbrowser-tab:is([selected], :hover, [multiselected]):not([hidden])) .tab-stack::after,
.tabbrowser-tab:not([hidden]):has(+ .tabbrowser-tab[hidden] ~ .tabbrowser-tab[hidden] + .tabbrowser-tab:is([selected], :hover, [multiselected]):not([hidden])) .tab-stack::after
{
opacity: 0 !important;
}
#tabbrowser-tabs[overflow] .tabbrowser-tab[pinned]:not([selected], :hover, [multiselected]):has(+ .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden]))) .tab-stack::after,
#tabbrowser-tabs[overflow] .tabbrowser-tab[pinned]:not([selected], :hover, [multiselected]):has(+ .tabbrowser-tab[hidden] + .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden]))) .tab-stack::after,
#tabbrowser-tabs[overflow] .tabbrowser-tab[pinned]:not([selected], :hover, [multiselected]):has(+ .tabbrowser-tab[hidden] ~ .tabbrowser-tab[hidden] + .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden]))) .tab-stack::after
{
opacity: var(--separators-color-saturation) !important;
}
@media (-moz-bool-pref: "userChrome.TabSeparators.Saturation.Low.Enabled")
{
:root
{
--separators-color-saturation: 0.25;
}
}
@media (-moz-bool-pref: "userChrome.TabSeparators.Saturation.Medium.Enabled")
{
:root
{
--separators-color-saturation: 0.5;
}
}
}
/* ---------------------------------------- Tab Scroll Animation ---------------------------------------- */
#tabbrowser-tabs[overflow] .tabbrowser-tab:not([pinned])
{
box-sizing: content-box !important;
}
#tabbrowser-tabs[overflow]:not([movingtab]) .tabbrowser-tab:not([pinned])
{
pointer-events: none !important;
box-sizing: content-box !important;
padding-inline: var(--tab-scroll-animation-inline-padding) !important;
margin-inline: var(--tab-scroll-animation-inline-margin) !important;
overflow-clip-margin: 0px !important;
}
#tabbrowser-tabs[overflow]:not([movingtab]) .tabbrowser-tab:not([pinned]) .tab-stack
{
pointer-events: auto !important;
}
#tabbrowser-tabs[overflow]:not([movingtab]) .tabbrowser-tab:nth-child(1 of .tabbrowser-tab:not([pinned], [hidden]))
{
margin-inline-start: 0px !important;
}
#tabbrowser-tabs[overflow]:not([movingtab]) .tabbrowser-tab:nth-last-child(1 of .tabbrowser-tab:not([hidden]))
{
margin-inline-end: 0px !important;
}
/* ---------------------------------------- Tabs On Bottom ---------------------------------------- */
@media (-moz-bool-pref: "userChrome.Tabs.TabsOnBottom.Enabled")
{
@media (-moz-bool-pref: "userChrome.Tabs.Option7.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option8.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option9.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option10.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option11.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option12.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option13.Enabled")
{
:root
{
--outer-drop-border-offset: -1px;
}
}
/* -------------------- Title Bar -------------------- */
#titlebar
{
order: 2 !important;
}
#toolbar-menubar
{
--toolbarbutton-icon-fill: inherit !important;
background-color: var(--toolbar-bgcolor) !important;
color: var(--toolbar-color) !important;
appearance: none !important;
}
#TabsToolbar::before
{
transform: rotateX(180deg);
}
/* -------------------- Nav Bar -------------------- */
#nav-bar
{
order: 0 !important;
}
/* -------------------- Personal Bar -------------------- */
#PersonalToolbar
{
order: 1 !important;
}
/* -------------------- Tabs -------------------- */
:root
{
--drag-space: 0px !important;
}
.tabbrowser-tab
{
--tab-inset-clip-path: 0px calc(-1 * var(--tab-first-last-inline-margin));
}
.tab-background
{
transform: rotateX(180deg);
}
}
/* ---------------------------------------- One Line ---------------------------------------- */
@media (-moz-bool-pref: "userChrome.OneLine.TabBarFirst.Enabled") or
(-moz-bool-pref: "userChrome.OneLine.NavBarFirst.Enabled")
{
@media (-moz-bool-pref: "userChrome.OneLine.TabBarFirst.Enabled")
{
#navigator-toolbox
{
grid-template-columns: auto min-content !important;
}
#titlebar
{
grid-area: 1 / 1 / span 1 / span 1 !important;
}
}
@media (-moz-bool-pref: "userChrome.OneLine.NavBarFirst.Enabled")
{
#navigator-toolbox
{
grid-template-columns: min-content auto !important;
}
#nav-bar
{
grid-area: 1 / 1 / span 1 / span 1 !important;
}
}
:root
{
--drag-space: 0px !important;
}
#navigator-toolbox
{
display: grid !important;
-moz-window-dragging: drag !important;
}
#TabsToolbar::before
{
display: none !important;
}
/* -------------------- Nav Bar -------------------- */
#nav-bar
{
margin: var(--tab-block-margin) !important;
border-radius: var(--tab-border-radius) !important;
box-shadow: var(--outer-box-border, 0 0 0 transparent),
var(--outer-box-shadow, 0 0 0 transparent) !important;
}
#urlbar-container,
#search-container
{
padding-block: 0px !important;
}
#urlbar-container
{
--urlbar-container-height: var(--tab-min-height) !important;
}
/* -------------------- Bookmarks Bar -------------------- */
#PersonalToolbar
{
margin-inline: var(--tab-block-margin) !important;
border-radius: var(--tab-border-radius) !important;
box-shadow: var(--outer-box-border, 0 0 0 transparent),
var(--outer-box-shadow, 0 0 0 transparent) !important;
}
#PersonalToolbar[collapsed="false"]
{
margin-bottom: var(--tab-block-margin) !important;
}
/* -------------------- Bookmarks Bar / Notifications -------------------- */
#navigator-toolbox > *:not(#titlebar, #nav-bar)
{
grid-column: 1 / span 2 !important;
}
/* -------------------- Customization -------------------- */
#customization-panelWrapper
{
--panel-arrow-offset: 0px !important;
}
/* -------------------- Attached Tabs -------------------- */
@media (-moz-bool-pref: "userChrome.Tabs.Option6.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option7.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option8.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option9.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option10.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option11.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option12.Enabled") or
(-moz-bool-pref: "userChrome.Tabs.Option13.Enabled")
{
:root
{
--tab-min-height: 44px !important;
&[uidensity="compact"]
{
--tab-min-height: 40px !important;
}
&[uidensity="touch"]
{
--tab-min-height: 48px !important;
}
}
#urlbar-container
{
--urlbar-container-height: calc(var(--tab-min-height) - var(--tab-block-margin) * 2) !important;
}
}
}
/* ---------------------------------------- Menu Icons ---------------------------------------- */
/* ---------- Regular Icons ---------- */
@media (-moz-bool-pref: "userChrome.Menu.Icons.Regular.Enabled")
{
:root
{
--tab-new-page: url("./icons/tab_desktop_new_page_20_regular.svg");
--window: url("./icons/window_20_regular.svg");
--window-inprivate-account: url("./icons/window_inprivate_account_20_regular.svg");
--star-line-horizontal: url("./icons/star_line_horizontal_3_20_regular.svg");
--star-add: url("./icons/star_add_20_regular.svg");
--star: url("./icons/star_20_filled.svg");
--history: url("./icons/history_20_regular.svg");
--arrow-download: url("./icons/arrow_download_20_regular.svg");
--key: url("./icons/key_20_regular.svg");
--puzzle-piece: url("./icons/puzzle_piece_20_regular.svg");
--print: url("./icons/print_20_regular.svg");
--save-edit: url("./icons/save_edit_20_regular.svg");
--document-search: url("./icons/document_search_20_regular.svg");
--settings: url("./icons/settings_20_regular.svg");
--question-circle: url("./icons/question_circle_20_regular.svg");
--color: url("./icons/color_20_regular.svg");
--window-dev-tools: url("./icons/window_dev_tools_20_regular.svg");
--person-feedback: url("./icons/person_feedback_20_regular.svg");
--warning: url("./icons/warning_20_regular.svg");
--arrow-clockwise: url("./icons/arrow_clockwise_20_regular.svg");
--arrow-redo: url("./icons/arrow_redo_20_regular.svg");
--arrow-undo: url("./icons/arrow_undo_20_regular.svg");
--clipboard-paste: url("./icons/clipboard_paste_20_regular.svg");
--clipboard-search: url("./icons/clipboard_search_20_regular.svg");
--copy: url("./icons/copy_20_regular.svg");
--cut: url("./icons/cut_20_regular.svg");
--delete: url("./icons/delete_20_regular.svg");
--dismiss: url("./icons/dismiss_20_regular.svg");
--folder-add: url("./icons/folder_add_20_regular.svg");
--pin: url("./icons/pin_20_regular.svg");
--speaker-mute: url("./icons/speaker_mute_20_regular.svg");
--tab-desktop: url("./icons/tab_desktop_20_regular.svg");
--tab-desktop-copy: url("./icons/tab_desktop_copy_20_regular.svg");
--edit: url("./icons/edit_20_regular.svg");
--speaker-2: url("./icons/speaker_2_20_regular.svg");
--camera-edit: url("./icons/camera_edit_20_regular.svg");
--cursor-hover: url("./icons/cursor_hover_20_regular.svg");
--image-copy: url("./icons/image_copy_20_regular.svg");
--image-edit: url("./icons/image_edit_20_regular.svg");
--link: url("./icons/link_20_regular.svg");
--play: url("./icons/play_20_regular.svg");
--pause: url("./icons/pause_20_regular.svg");
--search: url("./icons/search_20_regular.svg");
--tab-desktop-image: url("./icons/tab_desktop_image_20_regular.svg");
--translate: url("./icons/translate_20_regular.svg");
}
}
/* ---------- Filled Icons ---------- */
@media (-moz-bool-pref: "userChrome.Menu.Icons.Filled.Enabled")
{
:root
{
--tab-new-page: url("./icons/tab_desktop_new_page_20_filled.svg");
--window: url("./icons/window_20_filled.svg");
--window-inprivate-account: url("./icons/window_inprivate_account_20_filled.svg");
--star-line-horizontal: url("./icons/star_line_horizontal_3_20_filled.svg");
--star-add: url("./icons/star_add_20_filled.svg");
--star: url("./icons/star_20_filled.svg");
--history: url("./icons/history_20_filled.svg");
--arrow-download: url("./icons/arrow_download_20_filled.svg");
--key: url("./icons/key_20_filled.svg");
--puzzle-piece: url("./icons/puzzle_piece_20_filled.svg");
--print: url("./icons/print_20_filled.svg");
--save-edit: url("./icons/save_edit_20_filled.svg");
--document-search: url("./icons/document_search_20_filled.svg");
--settings: url("./icons/settings_20_filled.svg");
--question-circle: url("./icons/question_circle_20_filled.svg");
--color: url("./icons/color_20_filled.svg");
--window-dev-tools: url("./icons/window_dev_tools_20_filled.svg");
--person-feedback: url("./icons/person_feedback_20_filled.svg");
--warning: url("./icons/warning_20_filled.svg");
--arrow-clockwise: url("./icons/arrow_clockwise_20_filled.svg");
--arrow-redo: url("./icons/arrow_redo_20_filled.svg");
--arrow-undo: url("./icons/arrow_undo_20_filled.svg");
--clipboard-paste: url("./icons/clipboard_paste_20_filled.svg");
--clipboard-search: url("./icons/clipboard_search_20_filled.svg");
--copy: url("./icons/copy_20_filled.svg");
--cut: url("./icons/cut_20_filled.svg");
--delete: url("./icons/delete_20_filled.svg");
--dismiss: url("./icons/dismiss_20_filled.svg");
--folder-add: url("./icons/folder_add_20_filled.svg");
--pin: url("./icons/pin_20_filled.svg");
--speaker-mute: url("./icons/speaker_mute_20_filled.svg");
--tab-desktop: url("./icons/tab_desktop_20_filled.svg");
--tab-desktop-copy: url("./icons/tab_desktop_copy_20_filled.svg");
--edit: url("./icons/edit_20_filled.svg");
--speaker-2: url("./icons/speaker_2_20_filled.svg");
--camera-edit: url("./icons/camera_edit_20_filled.svg");
--cursor-hover: url("./icons/cursor_hover_20_filled.svg");
--image-copy: url("./icons/image_copy_20_filled.svg");
--image-edit: url("./icons/image_edit_20_filled.svg");
--link: url("./icons/link_20_filled.svg");
--play: url("./icons/play_20_filled.svg");
--pause: url("./icons/pause_20_filled.svg");
--search: url("./icons/search_20_filled.svg");
--tab-desktop-image: url("./icons/tab_desktop_image_20_filled.svg");
--translate: url("./icons/translate_20_filled.svg");
}
}
/* ---------- Native Browser Menus ---------- */
@media (-moz-bool-pref: "userChrome.Menu.Icons.Regular.Enabled") or
(-moz-bool-pref: "userChrome.Menu.Icons.Filled.Enabled")
{
:is(
/* ----- Main Menu ----- */
#appMenu-new-tab-button2,
#appMenu-new-window-button2,
#appMenu-new-private-window-button2,
#appMenu-bookmarks-button,
#appMenu-history-button,
#appMenu-downloads-button,
#appMenu-passwords-button,
#appMenu-extensions-themes-button,
#appMenu-print-button2,
#appMenu-save-file-button2,
#appMenu-find-button2,
#appMenu-translate-button,
#appMenu-settings-button,
#appMenu-help-button2,
/* ----- Main Menu (Submenus) ----- */
#appmenu-moreTools-button,
#appmenu-developer-tools-view > toolbarbutton:nth-child(1),
#appMenu_menu_openHelp,
#appMenu_feedbackPage,
#appMenu_menu_HelpPopup_reportPhishingtoolmenu,
/* ----- Bookmark Menu ----- */
#panelMenuBookmarkThisPage,
#panelMenu_showAllBookmarks,
#BMB_bookmarksShowAllTop,
#BMB_bookmarksShowAll,
/* ----- History Menu ----- */
#PanelUI-historyMore,
/* ----- Library Menu ----- */
#appMenu-library-bookmarks-button,
#appMenu-library-history-button,
#appMenu-library-downloads-button,
/* ----- Downloads Menu ----- */
#downloadsHistory,
/* ----- Developer Menu ----- */
#PanelUI-developer-tools-view > toolbarbutton:nth-child(1),
/* ----- Sidebar Menu ----- */
#sidebar-switcher-bookmarks,
#sidebar-switcher-history
)::before
{
content: "" !important;
display: block;
position: relative;
width: 20px;
height: 20px;
background-color: currentColor;
mask-size: 20px 20px;
mask-repeat: no-repeat;
mask-position: center center;
margin-block: -2px;
margin-inline: -2px 6px;
}
/* ----- Main Menu ----- */
#appMenu-new-tab-button2::before
{
mask-image: var(--tab-new-page);
}
#appMenu-new-window-button2::before
{
mask-image: var(--window);
}
#appMenu-new-private-window-button2::before
{
mask-image: var(--window-inprivate-account);
}
#appMenu-bookmarks-button::before
{
mask-image: var(--star-line-horizontal);
}
#appMenu-history-button::before
{
mask-image: var(--history);
}
#appMenu-downloads-button::before
{
mask-image: var(--arrow-download);
}
#appMenu-passwords-button::before
{
mask-image: var(--key);
}
#appMenu-extensions-themes-button::before
{
mask-image: var(--puzzle-piece);
}
#appMenu-print-button2::before
{
mask-image: var(--print);
}
#appMenu-save-file-button2::before
{
mask-image: var(--save-edit);
}
#appMenu-find-button2::before
{
mask-image: var(--document-search);
}
#appMenu-translate-button::before
{
mask-image: var(--translate);
}
#appMenu-settings-button::before
{
mask-image: var(--settings);
}
#appMenu-help-button2::before
{
mask-image: var(--question-circle);
}
/* ----- Main Menu (Submenus) ----- */
#appmenu-moreTools-button::before
{
mask-image: var(--color);
}
#appmenu-developer-tools-view > toolbarbutton:nth-child(1)::before
{
mask-image: var(--window-dev-tools);
}
#appMenu_menu_openHelp::before
{
mask-image: var(--question-circle);
}
#appMenu_feedbackPage::before
{
mask-image: var(--person-feedback);
}
#appMenu_menu_HelpPopup_reportPhishingtoolmenu::before
{
mask-image: var(--warning);
}
/* ----- Bookmark Menu ----- */
#panelMenuBookmarkThisPage::before
{
mask-image: var(--star-add);
}
#panelMenuBookmarkThisPage[starred]::before
{
mask-image: var(--star);
background-color: var(--toolbarbutton-icon-fill-attention) !important;
}
:is(#panelMenu_showAllBookmarks, #BMB_bookmarksShowAllTop, #BMB_bookmarksShowAll)::before
{
mask-image: var(--star-line-horizontal);
}
/* ----- History Menu ----- */
#PanelUI-historyMore::before
{
mask-image: var(--history);
}
/* ----- Library Menu ----- */
#appMenu-library-bookmarks-button::before
{
mask-image: var(--star-line-horizontal);
}
#appMenu-library-history-button::before
{
mask-image: var(--history);
}
#appMenu-library-downloads-button::before
{
mask-image: var(--arrow-download);
}
/* ----- Downloads Menu ----- */
#downloadsHistory::before
{
mask-image: var(--arrow-download);
}
/* ----- Developer Menu ----- */
#PanelUI-developer-tools-view > toolbarbutton:nth-child(1)::before
{
mask-image: var(--window-dev-tools);
}
/* ----- Sidebar Menu ----- */
#sidebar-switcher-bookmarks::before
{
mask-image: var(--star-line-horizontal);
}
#sidebar-switcher-history::before
{
mask-image: var(--history);
}
/* ---------- Non-Native Browser Menus ---------- */
@media (-moz-platform: windows),
(-moz-platform: linux)
{
:is(
/* ----- Toolbar Menubar Menu ----- */
menuitem.viewCustomizeToolbar,
/* ----- TabsToolbar Menu ----- */
#toolbar-context-openANewTab,
#toolbar-context-reloadSelectedTab,
#toolbar-context-bookmarkSelectedTab,
/* ----- Tab Menu ----- */
#context_openANewTab,
#context_reloadTab,
#context_toggleMuteTab,
#context_pinTab,
#context_unpinTab,
#context_duplicateTab,
#context_bookmarkTab,
#context_openTabInWindow,
#context_closeTab,
/* ----- Tabs Menu ----- */
#context_reloadSelectedTabs,
#context_toggleMuteSelectedTabs,
#context_pinSelectedTabs,
#context_unpinSelectedTabs,
#context_duplicateTabs,
#context_bookmarkSelectedTabs,
/* ----- Urlbar Menu ----- */
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(1),
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(2),
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(4),
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(5),
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(7),
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(8),
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(9),
/* ----- Searchbar Menu ----- */
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(1),
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(2),
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(4),
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(5),
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(6),
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(7),
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(8),
/* ----- PersonalToolbar Menu ----- */
#placesContext_openBookmarkContainer\:tabs,
#placesContext_new\:bookmark,
#placesContext_new\:folder,
#placesContext_paste,
#placesContext_showAllBookmarks,
/* ----- Bookmarks Menu ----- */
#placesContext_open\:newtab,
#placesContext_open\:newwindow,
#placesContext_open\:newprivatewindow,
#placesContext_show_bookmark\:info,
#placesContext_deleteBookmark,
#placesContext_cut,
#placesContext_copy,
#placesContext_paste_group,
/* ----- Folder Menu ----- */
#placesContext_show_folder\:info,
#placesContext_deleteFolder,
/* ---------- Web Menu ---------- */
/* ----- Menu ----- */
#context-savepage,
#context-take-screenshot,
#context-inspect,
/* ----- Text Menu ----- */
#context-copy,
#context-print-selection,
#context-searchselect,
/* ----- Image Menu ----- */
#context-viewimage,
#context-saveimage,
#context-copyimage-contents,
/* ----- Link Menu ----- */
#context-openlinkintab,
#context-openlink,
#context-openlinkprivate,
#context-bookmarklink,
#context-savelink,
#context-copylink,
/* ----- Input Menu ----- */
#context-undo,
#context-redo,
#context-cut,
#context-copy,
#context-paste,
#context-delete,
#context-keywordfield,
/* ----- Video Menu ----- */
#context-media-play,
#context-media-pause,
#context-media-mute,
#context-media-unmute,
#context-viewvideo,
#context-savevideo
)::before
{
content: "" !important;
display: block;
position: relative;
width: 20px;
height: 20px;
background-color: currentColor;
mask-size: 20px 20px;
mask-repeat: no-repeat;
mask-position: center center;
margin-block: -2px;
margin-inline: var(--align-menu-icons);
}
/* ----- Toolbar Menubar Menu ----- */
menuitem.viewCustomizeToolbar::before
{
mask-image: var(--color);
}
/* ----- TabsToolbar Menu ----- */
#toolbar-context-openANewTab::before
{
mask-image: var(--tab-new-page);
}
#toolbar-context-reloadSelectedTab::before
{
mask-image: var(--arrow-clockwise);
}
#toolbar-context-bookmarkSelectedTab::before
{
mask-image: var(--star-add);
}
/* ----- Tab Menu ----- */
#context_openANewTab::before
{
mask-image: var(--tab-new-page);
}
#context_reloadTab::before
{
mask-image: var(--arrow-clockwise);
}
#context_toggleMuteTab::before
{
mask-image: var(--speaker-mute);
}
#context_toggleMuteTab[muted]::before
{
mask-image: var(--speaker-2);
}
:is(#context_pinTab, #context_unpinTab)::before
{
mask-image: var(--pin);
}
#context_duplicateTab::before
{
mask-image: var(--tab-desktop-copy);
}
#context_bookmarkTab::before
{
mask-image: var(--star-add);
}
#context_openTabInWindow::before
{
mask-image: var(--window);
}
#context_closeTab::before
{
mask-image: var(--dismiss);
}
/* ----- Tabs Menu ----- */
#context_reloadSelectedTabs::before
{
mask-image: var(--arrow-clockwise);
}
#context_toggleMuteSelectedTabs::before
{
mask-image: var(--speaker-mute);
}
#context_toggleMuteSelectedTabs[muted]::before
{
mask-image: var(--speaker-2);
}
:is(#context_pinSelectedTabs, #context_unpinSelectedTabs)::before
{
mask-image: var(--pin);
}
#context_duplicateTabs::before
{
mask-image: var(--tab-desktop-copy);
}
#context_bookmarkSelectedTabs::before
{
mask-image: var(--star-add);
}
/* ----- Urlbar Menu ----- */
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(1)::before
{
mask-image: var(--arrow-undo);
}
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(2)::before
{
mask-image: var(--arrow-redo);
}
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(4)::before
{
mask-image: var(--cut);
}
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(5)::before
{
mask-image: var(--copy);
}
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(7)::before
{
mask-image: var(--clipboard-paste);
}
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(8)::before
{
mask-image: var(--clipboard-search);
}
menupopup.textbox-contextmenu:nth-child(3) > menuitem:nth-child(9)::before
{
mask-image: var(--delete);
}
/* ----- Searchbar Menu ----- */
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(1)::before
{
mask-image: var(--arrow-undo);
}
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(2)::before
{
mask-image: var(--arrow-redo);
}
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(4)::before
{
mask-image: var(--cut);
}
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(5)::before
{
mask-image: var(--copy);
}
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(6)::before
{
mask-image: var(--clipboard-paste);
}
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(7)::before
{
mask-image: var(--clipboard-search);
}
menupopup.textbox-contextmenu:nth-child(4) > menuitem:nth-child(8)::before
{
mask-image: var(--delete);
}
/* ----- PersonalToolbar Menu ----- */
#placesContext_openBookmarkContainer\:tabs::before
{
mask-image: var(--tab-desktop);
}
#placesContext_new\:bookmark::before
{
mask-image: var(--star-add);
}
#placesContext_new\:folder::before
{
mask-image: var(--folder-add);
}
#placesContext_paste::before
{
mask-image: var(--clipboard-paste);
}
#placesContext_showAllBookmarks::before
{
mask-image: var(--star-line-horizontal);
}
/* ----- Bookmarks Menu ----- */
#placesContext_open\:newtab::before
{
mask-image: var(--tab-new-page);
}
#placesContext_open\:newwindow::before
{
mask-image: var(--window);
}
#placesContext_open\:newprivatewindow::before
{
mask-image: var(--window-inprivate-account);
}
#placesContext_show_bookmark\:info::before
{
mask-image: var(--edit);
}
#placesContext_deleteBookmark::before
{
mask-image: var(--delete);
}
#placesContext_cut::before
{
mask-image: var(--cut);
}
#placesContext_copy::before
{
mask-image: var(--copy);
}
#placesContext_paste_group::before
{
mask-image: var(--clipboard-paste);
}
/* ----- Folder Menu ----- */
#placesContext_show_folder\:info::before
{
mask-image: var(--edit);
}
#placesContext_deleteFolder::before
{
mask-image: var(--delete);
}
/* ---------- Web Menu ---------- */
#context-savepage::before
{
mask-image: var(--save-edit);
}
#context-take-screenshot::before
{
mask-image: var(--camera-edit);
}
#context-inspect::before
{
mask-image: var(--cursor-hover);
}
#context-copy::before
{
mask-image: var(--copy);
}
#context-print-selection::before
{
mask-image: var(--print);
}
#context-searchselect::before
{
mask-image: var(--search);
}
#context-viewimage::before
{
mask-image: var(--tab-desktop-image);
}
#context-saveimage::before
{
mask-image: var(--image-edit);
}
#context-copyimage-contents::before
{
mask-image: var(--image-copy);
}
#context-openlinkintab::before
{
mask-image: var(--tab-desktop);
}
#context-openlink::before
{
mask-image: var(--window);
}
#context-openlinkprivate::before
{
mask-image: var(--window-inprivate-account);
}
#context-bookmarklink::before
{
mask-image: var(--star-add);
}
#context-savelink::before
{
mask-image: var(--save-edit);
}
#context-copylink::before
{
mask-image: var(--link);
}
#context-undo::before
{
mask-image: var(--arrow-undo);
}
#context-redo::before
{
mask-image: var(--arrow-redo);
}
#context-cut::before
{
mask-image: var(--cut);
}
#context-copy::before
{
mask-image: var(--copy);
}
#context-paste::before
{
mask-image: var(--clipboard-paste);
}
#context-delete::before
{
mask-image: var(--delete);
}
#context-keywordfield::before
{
mask-image: var(--star-add);
}
#context-media-play::before
{
mask-image: var(--play);
}
#context-media-pause::before
{
mask-image: var(--pause);
}
#context-media-mute::before
{
mask-image: var(--speaker-mute);
}
#context-media-unmute::before
{
mask-image: var(--speaker-2);
}
#context-viewvideo::before
{
mask-image: var(--tab-desktop);
}
#context-savevideo::before
{
mask-image: var(--save-edit);
}
}
}
}
}