mirrors/Firefox-UI-Fix
1
Fork 0
mirror of https://github.com/black7375/Firefox-UI-Fix.git synced 2025-12-06 02:30:54 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge master into photon-style

Browse source
This commit is contained in:
github-actions[bot] 2025-03-10 18:09:10 +00:00 • committed by GitHub
commit d94ee1ee74
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 1116 additions and 936 deletions
Download patch file Download diff file Expand all files Collapse all files

16
__tests__/mode.test.scss
View file

@ -29,11 +29,11 @@
} }
@include test("support pref") { @include test("support pref") {
@include mode.SUPPORT_PREF; @include mode.SUPPORT_BOOL_PREF;
@include assert { @include assert {
@include output { @include output {
@if mode.isMediaPref() { @if mode.isMediaBoolPref() {
@include example; @include example;
} }
} }
@ -44,11 +44,11 @@
} }
@include test("media pref") { @include test("media pref") {
@include mode.MEDIA_PREF; @include mode.MEDIA_BOOL_PREF;
@include assert { @include assert {
@include output { @include output {
@if mode.isMediaPref() { @if mode.isMediaBoolPref() {
@include example; @include example;
} }
} }
@ -86,11 +86,11 @@
} }
@include test("support pref") { @include test("support pref") {
@include mode.SUPPORT_PREF; @include mode.SUPPORT_BOOL_PREF;
@include assert { @include assert {
@include output { @include output {
@if mode.isMediaPref() { @if mode.isMediaBoolPref() {
@include example; @include example;
} }
} }
@ -101,11 +101,11 @@
} }
@include test("media pref") { @include test("media pref") {
@include mode.MEDIA_PREF; @include mode.MEDIA_BOOL_PREF;
@include assert { @include assert {
@include output { @include output {
@if mode.isMediaPref() { @if mode.isMediaBoolPref() {
@include example; @include example;
} }
} }

4
__tests__/native_menu.test.scss
View file

@ -137,7 +137,7 @@
@include test-module("Native Menu Option - Standard [mix]") { @include test-module("Native Menu Option - Standard [mix]") {
@include mode.STANDARD; @include mode.STANDARD;
@include mode.SUPPORT_PREF; @include mode.SUPPORT_BOOL_PREF;
@include test("simple") { @include test("simple") {
@include assert { @include assert {
@ -256,7 +256,7 @@
@include test-module("Native Menu Option - MediaPref [mix]") { @include test-module("Native Menu Option - MediaPref [mix]") {
@include mode.STANDARD; @include mode.STANDARD;
@include mode.MEDIA_PREF; @include mode.MEDIA_BOOL_PREF;
@include test("simple") { @include test("simple") {
@include assert { @include assert {

6
__tests__/one_liner.test.scss
View file

@ -51,7 +51,7 @@
@include test-module("One Liner - MediaPref [mix]") { @include test-module("One Liner - MediaPref [mix]") {
@include mode.STANDARD; @include mode.STANDARD;
@include mode.MEDIA_PREF; @include mode.MEDIA_BOOL_PREF;
@include test("content") { @include test("content") {
@include assert { @include assert {
@ -167,9 +167,9 @@
} }
} }
@include test-module("One Liner for Responsive - MEDIA_PREF [mix]") { @include test-module("One Liner for Responsive - MEDIA_BOOL_PREF [mix]") {
@include mode.STANDARD; @include mode.STANDARD;
@include mode.MEDIA_PREF; @include mode.MEDIA_BOOL_PREF;
@include test("Tabs on bottom") { @include test("Tabs on bottom") {
@include assert { @include assert {

151
__tests__/option.test.scss
View file

@ -81,7 +81,7 @@
@include test-module("If exist pref - Standard [mix]") { @include test-module("If exist pref - Standard [mix]") {
@include mode.STANDARD; @include mode.STANDARD;
@include mode.SUPPORT_PREF; @include mode.SUPPORT_BOOL_PREF;
@include test("simple") { @include test("simple") {
@include assert { @include assert {
@ -156,9 +156,9 @@
} }
} }
@include test-module("If exist pref - MediaPref [mix]") { @include test-module("If exist pref - MediaBoolPref [mix]") {
@include mode.STANDARD; @include mode.STANDARD;
@include mode.MEDIA_PREF; @include mode.MEDIA_BOOL_PREF;
@include test("simple") { @include test("simple") {
@include assert { @include assert {
@ -233,6 +233,83 @@
} }
} }
@include test-module("If exist pref - Media [mix]") {
@include mode.STANDARD;
@include mode.MEDIA_PREF;
@include test("simple") {
@include assert {
@include output {
@include option.Option("userChrome.tab.photon") {
@include example;
}
}
@include expect {
@#{media} #{'-moz-pref("userChrome.tab.photon")'} {
@include example;
}
}
}
}
@include test("multiple") {
@include assert {
@include output {
@include option.Option("userChrome.tab.photon", "userChrome.padding.photon") {
@include example;
}
}
@include expect {
@#{media} #{'-moz-pref("userChrome.tab.photon") or -moz-pref("userChrome.padding.photon")'} {
@include example;
}
}
}
}
@include test("simple `and`") {
@include assert {
@include output {
@include option.Option("userChrome.tab.photon" "userChrome.padding.photon") {
@include example;
}
}
@include expect {
@#{media} #{'(-moz-pref("userChrome.tab.photon") and -moz-pref("userChrome.padding.photon"))'} {
@include example;
}
}
}
}
@include test("multiple `and`") {
@include assert {
@include output {
@include option.Option("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow") {
@include example;
}
@include option.Option("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow", "userChrome.icon.panel_full") {
@include example;
}
@include option.Option("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow" "userChrome.icon.panel_full") {
@include example;
}
}
@include expect {
@#{media} #{'(-moz-pref("userChrome.tab.photon") and -moz-pref("userChrome.padding.photon")) or -moz-pref("userChrome.tab.box_shadow")'} {
@include example;
}
@#{media} #{'(-moz-pref("userChrome.tab.photon") and -moz-pref("userChrome.padding.photon")) or -moz-pref("userChrome.tab.box_shadow") or -moz-pref("userChrome.icon.panel_full")'} {
@include example;
}
@#{media} #{'(-moz-pref("userChrome.tab.photon") and -moz-pref("userChrome.padding.photon")) or (-moz-pref("userChrome.tab.box_shadow") and -moz-pref("userChrome.icon.panel_full"))'} {
@include example;
}
}
}
}
}
@include test-module("If not exist pref - ESR [mx]") { @include test-module("If not exist pref - ESR [mx]") {
@include mode.ESR; @include mode.ESR;
@ -312,7 +389,7 @@
@include test-module("If not exist pref - Standard [mx]") { @include test-module("If not exist pref - Standard [mx]") {
@include mode.STANDARD; @include mode.STANDARD;
@include mode.SUPPORT_PREF; @include mode.SUPPORT_BOOL_PREF;
@include test("simple") { @include test("simple") {
@include assert { @include assert {
@ -372,9 +449,9 @@
} }
} }
@include test-module("If not exist pref - MediaPref [mx]") { @include test-module("If not exist pref - MediaBoolPref [mx]") {
@include mode.STANDARD; @include mode.STANDARD;
@include mode.MEDIA_PREF; @include mode.MEDIA_BOOL_PREF;
@include test("simple") { @include test("simple") {
@include assert { @include assert {
@ -433,3 +510,65 @@
} }
} }
} }
@include test-module("If not exist pref - MediaPref [mx]") {
@include mode.STANDARD;
@include mode.MEDIA_PREF;
@include test("simple") {
@include assert {
@include output {
@include option.NotOption("userChrome.tab.photon") {
@include example;
}
}
@include expect {
@#{media} #{'not -moz-pref("userChrome.tab.photon")'} {
@include example;
}
}
}
}
@include test("multiple") {
@include assert {
@include output {
@include option.NotOption("userChrome.tab.photon", "userChrome.padding.photon") {
@include example;
}
}
@include expect {
@#{media} #{'(not -moz-pref("userChrome.tab.photon")) or (not -moz-pref("userChrome.padding.photon"))'} {
@include example;
}
}
}
}
@include test("multiple `and`") {
@include assert {
@include output {
@include option.NotOption("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow") {
@include example;
}
@include option.NotOption("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow", "userChrome.icon.panel_full") {
@include example;
}
@include option.NotOption("userChrome.tab.photon" "userChrome.padding.photon", "userChrome.tab.box_shadow" "userChrome.icon.panel_full") {
@include example;
}
}
@include expect {
@#{media} #{'((not -moz-pref("userChrome.tab.photon")) and (not -moz-pref("userChrome.padding.photon"))) or (not -moz-pref("userChrome.tab.box_shadow"))'} {
@include example;
}
@#{media} #{'((not -moz-pref("userChrome.tab.photon")) and (not -moz-pref("userChrome.padding.photon"))) or (not -moz-pref("userChrome.tab.box_shadow")) or (not -moz-pref("userChrome.icon.panel_full"))'} {
@include example;
}
@#{media} #{'((not -moz-pref("userChrome.tab.photon")) and (not -moz-pref("userChrome.padding.photon"))) or ((not -moz-pref("userChrome.tab.box_shadow")) and (not -moz-pref("userChrome.icon.panel_full")))'} {
@include example;
}
}
}
}
}

1558
css/leptonChrome.css generated
View file

File diff suppressed because it is too large Load diff

8
css/leptonChromeESR.css generated
View file

@ -11036,8 +11036,8 @@
#navigator-toolbox:is(:hover, :focus-within) #nav-bar:not([customizing]) #urlbar { #navigator-toolbox:is(:hover, :focus-within) #nav-bar:not([customizing]) #urlbar {
opacity: 1; opacity: 1;
} }
#navigator-toolbox:is(:hover, :focus-within) #nav-bar:not([customizing]) #urlbar { #navigator-toolbox:not(:hover, :focus-within) #nav-bar:not([customizing]) #urlbar {
pointer-events: auto; pointer-events: none;
} }
} }
@supports -moz-bool-pref("userChrome.tabbar.one_liner") { @supports -moz-bool-pref("userChrome.tabbar.one_liner") {
@ -11058,8 +11058,8 @@
#navigator-toolbox:is(:hover, :focus-within) #nav-bar:not([customizing]) #urlbar { #navigator-toolbox:is(:hover, :focus-within) #nav-bar:not([customizing]) #urlbar {
opacity: 1; opacity: 1;
} }
#navigator-toolbox:is(:hover, :focus-within) #nav-bar:not([customizing]) #urlbar { #navigator-toolbox:not(:hover, :focus-within) #nav-bar:not([customizing]) #urlbar {
pointer-events: auto; pointer-events: none;
} }
} }
} }

168
css/leptonContent.css generated
View file

@ -56,7 +56,7 @@
} }
/** Video player **************************************************************/ /** Video player **************************************************************/
/* Control Bar Size */ /* Control Bar Size */
@supports -moz-bool-pref("userContent.player.size") { @media -moz-pref("userContent.player.size") {
#controlsContainer { #controlsContainer {
--controlBar-height: 40px; /* Original: 40px, Replace to this value */ --controlBar-height: 40px; /* Original: 40px, Replace to this value */
} }
@ -82,7 +82,7 @@
} }
} }
/* Control Bar UI */ /* Control Bar UI */
@supports -moz-bool-pref("userContent.player.ui") { @media -moz-pref("userContent.player.ui") {
audio { audio {
--duration-color: #929292; /* Like Original */ --duration-color: #929292; /* Like Original */
--media-background: rgba(26, 26, 26, 0.8); /* Like Original */ --media-background: rgba(26, 26, 26, 0.8); /* Like Original */
@ -116,7 +116,7 @@
#controlsContainer .duration { #controlsContainer .duration {
color: var(--duration-color) !important; /* Original: #929292 */ color: var(--duration-color) !important; /* Original: #929292 */
} }
@supports -moz-bool-pref("userContent.player.ui.twoline") { @media -moz-pref("userContent.player.ui.twoline") {
audio { audio {
/* #controlsContainer .controlBar */ /* #controlsContainer .controlBar */
--controlBar-flex-wrap: unset; --controlBar-flex-wrap: unset;
@ -206,7 +206,7 @@
} }
} }
} }
@supports -moz-bool-pref("userContent.player.icon") { @media -moz-pref("userContent.player.icon") {
#controlsContainer .fullscreenButton { #controlsContainer .fullscreenButton {
background-image: url("../icons/enter-fullscreen.svg") !important; background-image: url("../icons/enter-fullscreen.svg") !important;
} }
@ -214,14 +214,14 @@
background-image: url("../icons/exit-fullscreen.svg") !important; background-image: url("../icons/exit-fullscreen.svg") !important;
} }
} }
@supports -moz-bool-pref("userContent.player.noaudio") { @media -moz-pref("userContent.player.noaudio") {
#controlsContainer .muteButton[noAudio] { #controlsContainer .muteButton[noAudio] {
/* Remove volume button at noAudio */ /* Remove volume button at noAudio */
display: none !important; display: none !important;
} }
} }
/* Click to play UI */ /* Click to play UI */
@supports -moz-bool-pref("userContent.player.click_to_play") { @media -moz-pref("userContent.player.click_to_play") {
#controlsContainer .clickToPlay { #controlsContainer .clickToPlay {
cursor: pointer; cursor: pointer;
opacity: 0.65 !important; opacity: 0.65 !important;
@ -235,7 +235,7 @@
} }
} }
/* Animation */ /* Animation */
@supports -moz-bool-pref("userContent.player.animate") { @media -moz-pref("userContent.player.animate") {
@media (prefers-reduced-motion: no-preference) { @media (prefers-reduced-motion: no-preference) {
/* Control Bar */ /* Control Bar */
#controlsContainer .controlBar { #controlsContainer .controlBar {
@ -267,7 +267,7 @@
/** Activity Stream ***********************************************************/ /** Activity Stream ***********************************************************/
@-moz-document url("about:home"), url("about:newtab") { @-moz-document url("about:home"), url("about:newtab") {
/** Activity Stream - Search Focus Border: like URL *************************/ /** Activity Stream - Search Focus Border: like URL *************************/
@supports -moz-bool-pref("userContent.page.field_border") { @media -moz-pref("userContent.page.field_border") {
/* At DarkMode, Color */ /* At DarkMode, Color */
body[style*="--newtab-background-color:rgba(28, 27, 34, 1);"], body[style*="--newtab-background-color:rgba(28, 27, 34, 1);"],
body[style*="--newtab-background-color:rgba(42, 42, 46, 1);"], body[style*="--newtab-background-color:rgba(42, 42, 46, 1);"],
@ -285,8 +285,8 @@
/* For Nightly */ /* For Nightly */
--newtab-primary-action-background: var(--newtab-focus-border) !important; --newtab-primary-action-background: var(--newtab-focus-border) !important;
} }
@supports -moz-bool-pref("userContent.page.proton_color") { @media -moz-pref("userContent.page.proton_color") {
@supports -moz-bool-pref("userContent.page.proton_color.dark_blue_accent") { @media -moz-pref("userContent.page.proton_color.dark_blue_accent") {
body[style*="--newtab-background-color:rgba(28, 27, 34, 1);"], body[style*="--newtab-background-color:rgba(28, 27, 34, 1);"],
body[style*="--newtab-background-color:rgba(42, 42, 46, 1);"], body[style*="--newtab-background-color:rgba(42, 42, 46, 1);"],
body[style*="--newtab-background-color: rgba(42, 42, 46, 1);"], body[style*="--newtab-background-color: rgba(42, 42, 46, 1);"],
@ -298,7 +298,7 @@
} }
} }
/** Activity Stream - Menu Icons ********************************************/ /** Activity Stream - Menu Icons ********************************************/
@supports -moz-bool-pref("userChrome.icon.context_menu") { @media -moz-pref("userChrome.icon.context_menu") {
.context-menu-list .context-menu-item button { .context-menu-list .context-menu-item button {
padding-inline-start: 0 !important; padding-inline-start: 0 !important;
} }
@ -341,7 +341,7 @@
.context-menu-item span[data-l10n-id="newtab-menu-show-file"] { .context-menu-item span[data-l10n-id="newtab-menu-show-file"] {
--menuitem-image: url("chrome://global/skin/icons/folder.svg"); --menuitem-image: url("chrome://global/skin/icons/folder.svg");
} }
@supports -moz-bool-pref("userChrome.icon.library") { @media -moz-pref("userChrome.icon.library") {
.context-menu-item span[data-l10n-id="newtab-menu-show-file"] { .context-menu-item span[data-l10n-id="newtab-menu-show-file"] {
--menuitem-image: url("../icons/folder.svg"); --menuitem-image: url("../icons/folder.svg");
} }
@ -360,8 +360,13 @@
} }
} }
/** Activity Stream - Web Site Icon: full size ******************************/ /** Activity Stream - Web Site Icon: full size ******************************/
@supports -moz-bool-pref("userContent.newTab.full_icon") { @media -moz-pref("userContent.newTab.full_icon") {
.top-site-outer {
width: 120px !important; /* v135: calc(var(--size-item-large) * 3); */
}
.top-site-outer .tile { .top-site-outer .tile {
width: 80px !important; /* v135: calc(var(--size-item-large) * 2); */
height: 80px !important; /* v135: calc(var(--size-item-large) * 2); */
overflow: hidden; overflow: hidden;
} }
.top-site-outer .icon-wrapper { .top-site-outer .icon-wrapper {
@ -383,7 +388,7 @@
} }
} }
/** Activity Stream - Animate ***********************************************/ /** Activity Stream - Animate ***********************************************/
@supports -moz-bool-pref("userContent.newTab.animate") { @media -moz-pref("userContent.newTab.animate") {
@media (prefers-reduced-motion: no-preference) { @media (prefers-reduced-motion: no-preference) {
:root { :root {
--animation-easing-function: cubic-bezier(0.07, 0.95, 0, 1); --animation-easing-function: cubic-bezier(0.07, 0.95, 0, 1);
@ -413,7 +418,7 @@
.search-wrapper .search-inner-wrapper > .search-handoff-button:focus { .search-wrapper .search-inner-wrapper > .search-handoff-button:focus {
transition: border-color 0.5s var(--animation-easing-function), box-shadow 1s var(--animation-easing-function); transition: border-color 0.5s var(--animation-easing-function), box-shadow 1s var(--animation-easing-function);
} }
@supports -moz-bool-pref("userContent.page.field_border") { @media -moz-pref("userContent.page.field_border") {
.search-wrapper .search-inner-wrapper:hover > input, .search-wrapper .search-inner-wrapper:hover > input,
.search-wrapper .search-inner-wrapper:hover > .search-handoff-button { .search-wrapper .search-inner-wrapper:hover > .search-handoff-button {
border-color: var(--newtab-primary-action-background) !important; border-color: var(--newtab-primary-action-background) !important;
@ -423,10 +428,11 @@
} }
} }
/** Activity Stream - Pocket order to last **********************************/ /** Activity Stream - Pocket order to last **********************************/
@supports -moz-bool-pref("userContent.newTab.pocket_to_last") { @media -moz-pref("userContent.newTab.pocket_to_last") {
.body-wrapper.on { .body-wrapper.on {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap !important;
flex-direction: row !important;
} }
.body-wrapper.on > .discovery-stream.ds-layout { .body-wrapper.on > .discovery-stream.ds-layout {
flex-basis: 100%; flex-basis: 100%;
@ -439,7 +445,7 @@
} }
} }
/** Activity Stream - Home Search Bar looks like proton *********************/ /** Activity Stream - Home Search Bar looks like proton *********************/
@supports -moz-bool-pref("userContent.newTab.searchbar") { @media -moz-pref("userContent.newTab.searchbar") {
/* Dropdown Colors */ /* Dropdown Colors */
#root { #root {
--newtab-search-background-color: rgba(255, 255, 255, 1); /* Same as light theme's --panel-background */ --newtab-search-background-color: rgba(255, 255, 255, 1); /* Same as light theme's --panel-background */
@ -517,7 +523,7 @@
} }
} }
/** Activity Stream - Hide Firefox's logo ***********************************/ /** Activity Stream - Hide Firefox's logo ***********************************/
@supports -moz-bool-pref("userContent.newTab.hidden_logo") { @media -moz-pref("userContent.newTab.hidden_logo") {
.logo-and-wordmark { .logo-and-wordmark {
display: none !important; display: none !important;
} }
@ -526,7 +532,7 @@
} }
} }
/** Activity Stream - Custom background image *******************************/ /** Activity Stream - Custom background image *******************************/
@supports -moz-bool-pref("userContent.newTab.background_image") { @media -moz-pref("userContent.newTab.background_image") {
body::before { body::before {
content: ""; content: "";
position: fixed; position: fixed;
@ -547,7 +553,7 @@
} }
} }
/** Error Page - Restore illustrations ****************************************/ /** Error Page - Restore illustrations ****************************************/
@supports -moz-bool-pref("userContent.page.illustration") { @media -moz-pref("userContent.page.illustration") {
@-moz-document url-prefix("about:neterror"), url-prefix("about:restartrequired"), url("chrome://browser/content/aboutRestartRequired.xhtml"), url("about:sessionrestore"), url("chrome://browser/content/aboutSessionRestore.xhtml") @-moz-document url-prefix("about:neterror"), url-prefix("about:restartrequired"), url("chrome://browser/content/aboutRestartRequired.xhtml"), url("about:sessionrestore"), url("chrome://browser/content/aboutSessionRestore.xhtml")
{ {
/* Illustrations Position */ /* Illustrations Position */
@ -654,7 +660,7 @@
} }
/** Fully Dark Mode ***********************************************************/ /** Fully Dark Mode ***********************************************************/
/*= Fully Dark Mode - Dark Mode Colors =======================================*/ /*= Fully Dark Mode - Dark Mode Colors =======================================*/
@supports -moz-bool-pref("userContent.page.proton_color") { @media -moz-pref("userContent.page.proton_color") {
@-moz-document url-prefix("about:"), url-prefix("chrome://"), url-prefix("https://addons.mozilla.org"), url-prefix("https://support.mozilla.org"), url-prefix("https://accounts.firefox.com"), url-prefix("view-source"), regexp("^((jar:)?file:///).*/$") @-moz-document url-prefix("about:"), url-prefix("chrome://"), url-prefix("https://addons.mozilla.org"), url-prefix("https://support.mozilla.org"), url-prefix("https://accounts.firefox.com"), url-prefix("view-source"), regexp("^((jar:)?file:///).*/$")
{ {
/*= Default Colors - Hard Coded ==============================================*/ /*= Default Colors - Hard Coded ==============================================*/
@ -841,7 +847,7 @@
--menu-icon-opacity: var(--dark-menu-icon-opacity); --menu-icon-opacity: var(--dark-menu-icon-opacity);
} }
} }
@supports -moz-bool-pref("userChrome.theme.non_native_menu") { @media -moz-pref("userChrome.theme.non_native_menu") {
@media (-moz-gtk-csd-available) { @media (-moz-gtk-csd-available) {
:root { :root {
/* Override some menu color variables for light browser themes. */ /* Override some menu color variables for light browser themes. */
@ -875,7 +881,7 @@
} }
} }
} }
@supports -moz-bool-pref("userContent.page.proton_color.dark_blue_accent") or -moz-bool-pref("userContent.page.proton_color.system_accent") { @media -moz-pref("userContent.page.proton_color.dark_blue_accent") or -moz-pref("userContent.page.proton_color.system_accent") {
:root, :root,
:host(.anonymous-content-host) { :host(.anonymous-content-host) {
--color-accent-primary: var(--in-content-primary-button-background) !important; --color-accent-primary: var(--in-content-primary-button-background) !important;
@ -883,7 +889,7 @@
--color-accent-primary-active: light-dark(var(--color-blue-70), var(--color-cyan-20)); --color-accent-primary-active: light-dark(var(--color-blue-70), var(--color-cyan-20));
} }
} }
@supports -moz-bool-pref("userContent.page.proton_color.dark_blue_accent") { @media -moz-pref("userContent.page.proton_color.dark_blue_accent") {
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
:host, :host,
:root { :root {
@ -939,7 +945,7 @@
} }
} }
} }
@supports -moz-bool-pref("userContent.page.proton_color.system_accent") { @media -moz-pref("userContent.page.proton_color.system_accent") {
:host, :host,
:root { :root {
--in-content-primary-button-text-color: AccentColorText !important; --in-content-primary-button-text-color: AccentColorText !important;
@ -947,7 +953,7 @@
--in-content-primary-button-background-hover: color-mix(in srgb, black 10%, AccentColor) !important; --in-content-primary-button-background-hover: color-mix(in srgb, black 10%, AccentColor) !important;
--in-content-primary-button-background-active: color-mix(in srgb, black 20%, AccentColor) !important; --in-content-primary-button-background-active: color-mix(in srgb, black 20%, AccentColor) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
:host, :host,
:root { :root {
--in-content-primary-button-text-color: HighlightText !important; --in-content-primary-button-text-color: HighlightText !important;
@ -959,7 +965,7 @@
} }
} }
} }
@supports -moz-bool-pref("userContent.page.dark_mode") { @media -moz-pref("userContent.page.dark_mode") {
@media (prefers-color-scheme: dark) { @media (prefers-color-scheme: dark) {
/*= Addons.org =============================================================*/ /*= Addons.org =============================================================*/
@-moz-document url-prefix("https://addons.mozilla.org") @-moz-document url-prefix("https://addons.mozilla.org")
@ -1841,7 +1847,7 @@
box-shadow: 0 0 0 3px color-mix(in srgb, var(--in-content-primary-button-background-hover) 80%, transparent) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--in-content-primary-button-background-hover) 80%, transparent) !important;
} }
} }
@supports -moz-bool-pref("userContent.page.dark_mode.pdf") { @media -moz-pref("userContent.page.dark_mode.pdf") {
@-moz-document unobservable-document() { @-moz-document unobservable-document() {
@-moz-document regexp("^(?!.*\\.pdf\\?n).*") { @-moz-document regexp("^(?!.*\\.pdf\\?n).*") {
#outerContainer { #outerContainer {
@ -1861,7 +1867,7 @@
} }
} }
/** Fully Proton Mode *********************************************************/ /** Fully Proton Mode *********************************************************/
@supports -moz-bool-pref("userContent.page.proton") { @media -moz-pref("userContent.page.proton") {
/*= Common contents ==========================================================*/ /*= abouts' common ===========================================================*/ /*= Common contents ==========================================================*/ /*= abouts' common ===========================================================*/
@-moz-document url-prefix("about:"), url-prefix("chrome://pippki/content/"), url-prefix("chrome://browser/content/") @-moz-document url-prefix("about:"), url-prefix("chrome://pippki/content/"), url-prefix("chrome://browser/content/")
{ {
@ -1932,7 +1938,7 @@
/* Ensure font-size isn't overridden by widget styling (e.g. in forms.css) */ /* Ensure font-size isn't overridden by widget styling (e.g. in forms.css) */
font-size: 1em !important; font-size: 1em !important;
} }
@supports -moz-bool-pref("userChrome.rounding.square_button") { @media -moz-pref("userChrome.rounding.square_button") {
button, button,
select, select,
input[type="color"] { input[type="color"] {
@ -2012,7 +2018,7 @@
margin-inline: 0 6px !important; margin-inline: 0 6px !important;
flex-shrink: 0 !important; /* avoid shrinking inside flex container */ flex-shrink: 0 !important; /* avoid shrinking inside flex container */
} }
@supports -moz-bool-pref("userChrome.rounding.square_checklabel") { @media -moz-pref("userChrome.rounding.square_checklabel") {
input[type="checkbox"] { input[type="checkbox"] {
border-radius: 0 !important; border-radius: 0 !important;
} }
@ -2106,7 +2112,7 @@
} }
} }
/*= Field Border =============================================================*/ /*= Field Border =============================================================*/
@supports -moz-bool-pref("userContent.page.field_border") { @media -moz-pref("userContent.page.field_border") {
@media (prefers-reduced-motion: no-preference) { @media (prefers-reduced-motion: no-preference) {
@-moz-document url-prefix("about:") { @-moz-document url-prefix("about:") {
html|input:is( html|input:is(
@ -2286,7 +2292,7 @@
background-position: center !important; background-position: center !important;
color: inherit !important; color: inherit !important;
} }
@supports not -moz-bool-pref("userChrome.rounding.square_button") { @media not -moz-pref("userChrome.rounding.square_button") {
.profiler-icon { .profiler-icon {
border-radius: 8px !important; border-radius: 8px !important;
} }
@ -2320,7 +2326,7 @@
@-moz-document url("chrome://browser/content/places/places.xhtml") @-moz-document url("chrome://browser/content/places/places.xhtml")
{ {
/** Library - Icons Replace *************************************************/ /** Library - Icons Replace *************************************************/
@supports -moz-bool-pref("userChrome.icon.library") { @media -moz-pref("userChrome.icon.library") {
/*= Standard Folder - More Visible ===========================================*/ /*= Standard Folder - More Visible ===========================================*/
/* on Toolbar and Menus */ /* on Toolbar and Menus */
:-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) :-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu)
@ -2499,7 +2505,7 @@
background-position: right center; background-position: right center;
} }
/*= Proton ===============================================================*/ /*= Proton ===============================================================*/
@supports -moz-bool-pref("userContent.page.proton") { @media -moz-pref("userContent.page.proton") {
:root { :root {
--organizer-color: -moz-DialogText; --organizer-color: -moz-DialogText;
--organizer-deemphasized-color: GrayText; --organizer-deemphasized-color: GrayText;
@ -2574,7 +2580,7 @@
padding: 5px !important; padding: 5px !important;
border-radius: 4px !important; border-radius: 4px !important;
} }
@supports -moz-bool-pref("userChrome.rounding.square_button") { @media -moz-pref("userChrome.rounding.square_button") {
#placesToolbar > toolbarbutton { #placesToolbar > toolbarbutton {
border-radius: 0 !important; border-radius: 0 !important;
} }
@ -2606,7 +2612,7 @@
border-radius: 4px !important; border-radius: 4px !important;
margin-inline-end: 2px !important; margin-inline-end: 2px !important;
} }
@supports -moz-bool-pref("userChrome.rounding.square_button") { @media -moz-pref("userChrome.rounding.square_button") {
#placesMenu > menu { #placesMenu > menu {
border-radius: 0 !important; border-radius: 0 !important;
} }
@ -2637,7 +2643,7 @@
padding-block: 2px !important; padding-block: 2px !important;
min-height: 24px !important; min-height: 24px !important;
} }
@supports -moz-bool-pref("userChrome.rounding.square_field") { @media -moz-pref("userChrome.rounding.square_field") {
#searchFilter, #searchFilter,
#detailsPane html|input { #detailsPane html|input {
border-radius: 0 !important; border-radius: 0 !important;
@ -2784,7 +2790,7 @@
-moz-context-properties: fill !important; -moz-context-properties: fill !important;
fill: currentColor !important; fill: currentColor !important;
} }
@supports -moz-bool-pref("userChrome.rounding.square_button") { @media -moz-pref("userChrome.rounding.square_button") {
#editBookmarkPanelRows .expander-up, #editBookmarkPanelRows .expander-up,
#editBookmarkPanelRows .expander-down { #editBookmarkPanelRows .expander-down {
border-radius: 0 !important; border-radius: 0 !important;
@ -2823,7 +2829,7 @@
min-height: 20px !important; min-height: 20px !important;
padding-inline: 4px !important; padding-inline: 4px !important;
} }
@supports -moz-bool-pref("userChrome.rounding.square_field") { @media -moz-pref("userChrome.rounding.square_field") {
#places input { #places input {
border-radius: 0 !important; border-radius: 0 !important;
} }
@ -2846,7 +2852,7 @@
border: 1px solid var(--organizer-border-color) !important; border: 1px solid var(--organizer-border-color) !important;
border-radius: 4px !important; border-radius: 4px !important;
} }
@supports -moz-bool-pref("userChrome.rounding.square_field") { @media -moz-pref("userChrome.rounding.square_field") {
#editBMPanel_tagsSelectorRow > richlistbox { #editBMPanel_tagsSelectorRow > richlistbox {
border-radius: 0 !important; border-radius: 0 !important;
} }
@ -2947,7 +2953,7 @@
color: var(--checkbox-checked-color, AccentColorText) !important; color: var(--checkbox-checked-color, AccentColorText) !important;
background-color: var(--checkbox-checked-bgcolor, AccentColor) !important; background-color: var(--checkbox-checked-bgcolor, AccentColor) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] > .menu-iconic-icon { menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] > .menu-iconic-icon {
color: var(--checkbox-checked-color, -moz-accent-color-foreground) !important; color: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important; background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important;
@ -2959,7 +2965,7 @@
color-mix(in srgb, AccentColor 4%, Field) color-mix(in srgb, AccentColor 4%, Field)
) !important; ) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
menuitem[type="checkbox"]:not([disabled="true"]):hover > .menu-iconic-left > .menu-iconic-icon { menuitem[type="checkbox"]:not([disabled="true"]):hover > .menu-iconic-left > .menu-iconic-icon {
background-color: var( background-color: var(
--checkbox-unchecked-hover-bgcolor, --checkbox-unchecked-hover-bgcolor,
@ -2973,7 +2979,7 @@
color-mix(in srgb, AccentColor 8%, Field) color-mix(in srgb, AccentColor 8%, Field)
) !important; ) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
menuitem[type="checkbox"]:not([disabled="true"]):hover:active > .menu-iconic-left > .menu-iconic-icon { menuitem[type="checkbox"]:not([disabled="true"]):hover:active > .menu-iconic-left > .menu-iconic-icon {
background-color: var( background-color: var(
--checkbox-unchecked-active-bgcolor, --checkbox-unchecked-active-bgcolor,
@ -2987,7 +2993,7 @@
color-mix(in srgb, currentColor 12.5%, AccentColor) color-mix(in srgb, currentColor 12.5%, AccentColor)
) !important; ) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
menuitem[type="checkbox"]:not([disabled="true"]):hover menuitem[type="checkbox"]:not([disabled="true"]):hover
> .menu-iconic-left[checked="true"] > .menu-iconic-left[checked="true"]
> .menu-iconic-icon { > .menu-iconic-icon {
@ -3005,7 +3011,7 @@
color-mix(in srgb, currentColor 25%, AccentColor) color-mix(in srgb, currentColor 25%, AccentColor)
) !important; ) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
menuitem[type="checkbox"]:not([disabled="true"]):hover:active menuitem[type="checkbox"]:not([disabled="true"]):hover:active
> .menu-iconic-left[checked="true"] > .menu-iconic-left[checked="true"]
> .menu-iconic-icon { > .menu-iconic-icon {
@ -3019,7 +3025,7 @@
outline: 2px solid var(--focus-outline-color, AccentColor) !important; outline: 2px solid var(--focus-outline-color, AccentColor) !important;
outline-offset: var(--focus-outline-offset, 2px) !important; outline-offset: var(--focus-outline-offset, 2px) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
menuitem[type="checkbox"]:focus > .menu-iconic-left > .menu-iconic-icon { menuitem[type="checkbox"]:focus > .menu-iconic-left > .menu-iconic-icon {
outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important; outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important;
} }
@ -3029,7 +3035,7 @@
/* color will set the border-color on the check due to how HCM works for in-content pages. */ /* color will set the border-color on the check due to how HCM works for in-content pages. */
color: var(--checkbox-checked-border-color, color-mix(in srgb, AccentColor 4%, Field)) !important; color: var(--checkbox-checked-border-color, color-mix(in srgb, AccentColor 4%, Field)) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
menuitem[type="checkbox"]:not([disabled="true"]) > .menu-iconic-left > .menu-iconic-icon { menuitem[type="checkbox"]:not([disabled="true"]) > .menu-iconic-left > .menu-iconic-icon {
/* color will set the border-color on the check due to how HCM works for in-content pages. */ /* color will set the border-color on the check due to how HCM works for in-content pages. */
color: var(--checkbox-checked-border-color, color-mix(in srgb, -moz-accent-color 4%, Field)) !important; color: var(--checkbox-checked-border-color, color-mix(in srgb, -moz-accent-color 4%, Field)) !important;
@ -3039,7 +3045,7 @@
color: var(--checkbox-checked-border-color, currentColor) !important; color: var(--checkbox-checked-border-color, currentColor) !important;
fill: var(--checkbox-checked-color, AccentColorText) !important; fill: var(--checkbox-checked-color, AccentColorText) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] { menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] {
fill: var(--checkbox-checked-color, -moz-accent-color-foreground) !important; fill: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
} }
@ -3053,7 +3059,7 @@
color: var(--checkbox-checked-border-color-hover, AccentColorText) !important; color: var(--checkbox-checked-border-color-hover, AccentColorText) !important;
fill: var(--checkbox-checked-border-color-hover, AccentColorText) !important; fill: var(--checkbox-checked-border-color-hover, AccentColorText) !important;
} }
@supports -moz-bool-pref("userChrome.compatibility.accent_color") { @media -moz-pref("userChrome.compatibility.accent_color") {
menuitem[type="checkbox"]:not([disabled="true"]):hover:active menuitem[type="checkbox"]:not([disabled="true"]):hover:active
> .menu-iconic-left[checked="true"] > .menu-iconic-left[checked="true"]
> .menu-iconic-icon, > .menu-iconic-icon,
@ -3086,7 +3092,7 @@
} }
} }
/** Rounding ******************************************************************/ /** Rounding ******************************************************************/
@supports -moz-bool-pref("userChrome.rounding.square_button") { @media -moz-pref("userChrome.rounding.square_button") {
.all-buttons-container, .all-buttons-container,
.highlight-buttons > button, .highlight-buttons > button,
.cancel-shot, .cancel-shot,
@ -3136,14 +3142,14 @@
} }
} }
} }
@supports -moz-bool-pref("userChrome.rounding.square_dialog") { @media -moz-pref("userChrome.rounding.square_dialog") {
@-moz-document url("about:home"), url("about:newtab") { @-moz-document url("about:home"), url("about:newtab") {
.modal { .modal {
border-radius: 0 !important; border-radius: 0 !important;
} }
} }
} }
@supports -moz-bool-pref("userChrome.rounding.square_checklabel") { @media -moz-pref("userChrome.rounding.square_checklabel") {
@-moz-document url-prefix("about:"), regexp("^chrome://\\w+/content/.*.xhtml$") @-moz-document url-prefix("about:"), regexp("^chrome://\\w+/content/.*.xhtml$")
{ {
input[type="checkbox"]:not(.toggle-button), input[type="checkbox"]:not(.toggle-button),
@ -3152,7 +3158,7 @@
} }
} }
} }
@supports -moz-bool-pref("userChrome.rounding.square_field") { @media -moz-pref("userChrome.rounding.square_field") {
@-moz-document url-prefix("about:"), regexp("^chrome://\\w+/content/.*.xhtml$") @-moz-document url-prefix("about:"), regexp("^chrome://\\w+/content/.*.xhtml$")
{ {
input:is( input:is(
@ -3196,7 +3202,7 @@
} }
} }
} }
@supports -moz-bool-pref("userChrome.rounding.square_menupopup") { @media -moz-pref("userChrome.rounding.square_menupopup") {
@-moz-document url-prefix("about:"), url-prefix("chrome://") @-moz-document url-prefix("about:"), url-prefix("chrome://")
{ {
panel, panel,
@ -3226,7 +3232,7 @@
} }
} }
} }
@supports -moz-bool-pref("userChrome.rounding.square_infobox") { @media -moz-pref("userChrome.rounding.square_infobox") {
@-moz-document url-prefix("about:"), regexp("^chrome://\\w+/content/.*.xhtml$") @-moz-document url-prefix("about:"), regexp("^chrome://\\w+/content/.*.xhtml$")
{ {
/* /*
@ -3258,7 +3264,7 @@
} }
} }
@-moz-document url-prefix("about:"), regexp(".*.pdf$") { @-moz-document url-prefix("about:"), regexp(".*.pdf$") {
@supports -moz-bool-pref("userChrome.rounding.square_dialog") { @media -moz-pref("userChrome.rounding.square_dialog") {
dialog, dialog,
.dialogBox { .dialogBox {
border-radius: 0 !important; border-radius: 0 !important;
@ -3268,7 +3274,7 @@
@-moz-document url("chrome://browser/content/places/places.xhtml") @-moz-document url("chrome://browser/content/places/places.xhtml")
{ {
/*= Library ==============================================================*/ /*= Library ==============================================================*/
@supports -moz-bool-pref("userChrome.rounding.square_button") { @media -moz-pref("userChrome.rounding.square_button") {
#placesToolbar > toolbarbutton, #placesToolbar > toolbarbutton,
#placesMenu > menu, #placesMenu > menu,
#editBookmarkPanelRows .expander-up, #editBookmarkPanelRows .expander-up,
@ -3276,7 +3282,7 @@
border-radius: 0 !important; border-radius: 0 !important;
} }
} }
@supports -moz-bool-pref("userChrome.rounding.square_field") { @media -moz-pref("userChrome.rounding.square_field") {
#searchFilter, #searchFilter,
#detailsPane html|input, #detailsPane html|input,
#places input #editBMPanel_tagsSelectorRow > richlistbox { #places input #editBMPanel_tagsSelectorRow > richlistbox {
@ -3285,7 +3291,7 @@
} }
} }
/** Monospace *****************************************************************/ /** Monospace *****************************************************************/
@supports -moz-bool-pref("userContent.page.monospace") { @media -moz-pref("userContent.page.monospace") {
@-moz-document url-prefix("about:"), url-prefix("chrome://"), regexp("^((jar:)?file:///).*/$") @-moz-document url-prefix("about:"), url-prefix("chrome://"), regexp("^((jar:)?file:///).*/$")
{ {
* { * {
@ -3294,14 +3300,14 @@
} }
} }
/** Menu - Icons Layout *******************************************************/ /** Menu - Icons Layout *******************************************************/
@supports not -moz-bool-pref("userChrome.icon.disabled") { @media not -moz-pref("userChrome.icon.disabled") {
@supports -moz-bool-pref("userChrome.icon.menu") { @media -moz-pref("userChrome.icon.menu") {
@-moz-document url-prefix("about:"), url-prefix("chrome://"), regexp("^((jar:)?file:///).*/$") @-moz-document url-prefix("about:"), url-prefix("chrome://"), regexp("^((jar:)?file:///).*/$")
{ {
:root { :root {
--uc-folder-icon: url("chrome://global/skin/icons/folder.svg"); --uc-folder-icon: url("chrome://global/skin/icons/folder.svg");
} }
@supports -moz-bool-pref("userChrome.icon.library") { @media -moz-pref("userChrome.icon.library") {
:root { :root {
--uc-folder-icon: url("../icons/folder.svg"); --uc-folder-icon: url("../icons/folder.svg");
} }
@ -3332,7 +3338,7 @@
background-image: var(--menuitem-image); background-image: var(--menuitem-image);
} }
/* For native context menus */ /* For native context menus */
@supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") { @media -moz-pref("widget.macos.native-context-menus") or -moz-pref("widget.gtk.native-context-menus") {
:not(menu, #ContentSelectDropdown) :not(menu, #ContentSelectDropdown)
> menupopup:not(.in-menulist) > menupopup:not(.in-menulist)
> menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]), > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
@ -3385,7 +3391,7 @@
} }
} }
@media (-moz-platform: windows), (-moz-gtk-csd-available) { @media (-moz-platform: windows), (-moz-gtk-csd-available) {
@supports -moz-bool-pref("userChrome.theme.non_native_menu") { @media -moz-pref("userChrome.theme.non_native_menu") {
@media (-moz-platform: windows) and (-moz-gtk-csd-available), @media (-moz-platform: windows) and (-moz-gtk-csd-available),
(-moz-gtk-csd-available) and (-moz-gtk-csd-available) { (-moz-gtk-csd-available) and (-moz-gtk-csd-available) {
:root { :root {
@ -3447,7 +3453,7 @@
} }
} }
/* Padding - Mac */ /* Padding - Mac */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") { @media -moz-pref("layout.css.osx-font-smoothing.enabled") {
:root { :root {
--context-menu-background-padding-default: 10px; --context-menu-background-padding-default: 10px;
--context-menu-mac-padding: 21px; --context-menu-mac-padding: 21px;
@ -3477,7 +3483,7 @@
} }
} }
/*= Context Menu ===========================================================*/ /*= Context Menu ===========================================================*/
@supports -moz-bool-pref("userChrome.icon.context_menu") { @media -moz-pref("userChrome.icon.context_menu") {
/* Icon lists */ /* Icon lists */
/*= downloadsContextMenu =====================================================*/ /*= downloadsContextMenu =====================================================*/
.downloadPauseMenuItem { .downloadPauseMenuItem {
@ -3596,7 +3602,7 @@
--menuitem-image: url("../icons/movetowindow-16.svg"); --menuitem-image: url("../icons/movetowindow-16.svg");
} }
} }
@supports -moz-bool-pref("userChrome.icon.global_menu") { @media -moz-pref("userChrome.icon.global_menu") {
/*= organizeButtonPopup ======================================================*/ /*= organizeButtonPopup ======================================================*/
#newbookmark { #newbookmark {
--menuitem-image: url("chrome://browser/skin/bookmark.svg"); --menuitem-image: url("chrome://browser/skin/bookmark.svg");
@ -3610,7 +3616,7 @@
#orgUndo { #orgUndo {
--menuitem-image: url("../icons/undo.svg"); --menuitem-image: url("../icons/undo.svg");
} }
@supports -moz-bool-pref("userChrome.icon.menu.full") { @media -moz-pref("userChrome.icon.menu.full") {
#orgRedo { #orgRedo {
--menuitem-image: url("../icons/redo.svg"); --menuitem-image: url("../icons/redo.svg");
} }
@ -3644,7 +3650,7 @@
#backupBookmarks { #backupBookmarks {
--menuitem-image: url("../icons/datastore.svg"); --menuitem-image: url("../icons/datastore.svg");
} }
@supports -moz-bool-pref("userChrome.icon.menu.full") { @media -moz-pref("userChrome.icon.menu.full") {
#fileRestoreMenu { #fileRestoreMenu {
--menuitem-image: url("../icons/datarestore.svg"); --menuitem-image: url("../icons/datarestore.svg");
} }
@ -3661,7 +3667,7 @@
} }
} }
@-moz-document url-prefix("about:addons") { @-moz-document url-prefix("about:addons") {
@supports -moz-bool-pref("userChrome.icon.context_menu") { @media -moz-pref("userChrome.icon.context_menu") {
button:is([role="menuitem"], [role="menuitemcheckbox"]) { button:is([role="menuitem"], [role="menuitemcheckbox"]) {
background-image: var(--icon, url("../icons/blank.svg")); /* Don't use !important. because of [checked] */ background-image: var(--icon, url("../icons/blank.svg")); /* Don't use !important. because of [checked] */
} }
@ -3691,7 +3697,7 @@
} }
} }
@-moz-document url-prefix("about:logins") { @-moz-document url-prefix("about:logins") {
@supports -moz-bool-pref("userChrome.icon.context_menu") { @media -moz-pref("userChrome.icon.context_menu") {
.menuitem-export { .menuitem-export {
background-image: url("../icons/toolbarButton-download.svg") !important; background-image: url("../icons/toolbarButton-download.svg") !important;
} }
@ -3702,7 +3708,7 @@
/** Download Panel ************************************************************/ /** Download Panel ************************************************************/
@-moz-document url-prefix("about:downloads") { @-moz-document url-prefix("about:downloads") {
@media (prefers-reduced-motion: no-preference) { @media (prefers-reduced-motion: no-preference) {
@supports -moz-bool-pref("userChrome.decoration.download_panel") { @media -moz-pref("userChrome.decoration.download_panel") {
/* Accent Color for downloaded item */ /* Accent Color for downloaded item */
#downloadsListBox .download-state[exists] .downloadDetails { #downloadsListBox .download-state[exists] .downloadDetails {
color: var(--button-primary-bgcolor); color: var(--button-primary-bgcolor);
@ -3723,8 +3729,7 @@
} }
} }
} }
} } /*@ DEPRECATED @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/*@ NIGHTLY @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
/** Compatibility *************************************************************/ /** Compatibility *************************************************************/
@-moz-document url-prefix("about:preferences") { @-moz-document url-prefix("about:preferences") {
.content-blocking-warning.info-box-container > hbox > .content-blocking-warning-image { .content-blocking-warning.info-box-container > hbox > .content-blocking-warning-image {
@ -4094,7 +4099,12 @@
} }
/** Activity Stream - Web Site Icon: full size ******************************/ /** Activity Stream - Web Site Icon: full size ******************************/
@media (-moz-bool-pref: "userContent.newTab.full_icon") { @media (-moz-bool-pref: "userContent.newTab.full_icon") {
.top-site-outer {
width: 120px !important; /* v135: calc(var(--size-item-large) * 3); */
}
.top-site-outer .tile { .top-site-outer .tile {
width: 80px !important; /* v135: calc(var(--size-item-large) * 2); */
height: 80px !important; /* v135: calc(var(--size-item-large) * 2); */
overflow: hidden; overflow: hidden;
} }
.top-site-outer .icon-wrapper { .top-site-outer .icon-wrapper {
@ -4152,12 +4162,12 @@
border-color: var(--newtab-primary-action-background) !important; border-color: var(--newtab-primary-action-background) !important;
transition: border-color 0.5s var(--animation-easing-function); transition: border-color 0.5s var(--animation-easing-function);
} }
} } /** Activity Stream - Pocket order to last **********************************/
/** Activity Stream - Pocket order to last **********************************/
@media (-moz-bool-pref: "userContent.newTab.pocket_to_last") { @media (-moz-bool-pref: "userContent.newTab.pocket_to_last") {
.body-wrapper.on { .body-wrapper.on {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap !important;
flex-direction: row !important;
} }
.body-wrapper.on > .discovery-stream.ds-layout { .body-wrapper.on > .discovery-stream.ds-layout {
flex-basis: 100%; flex-basis: 100%;

8
css/leptonContentESR.css generated
View file

@ -361,7 +361,12 @@
} }
/** Activity Stream - Web Site Icon: full size ******************************/ /** Activity Stream - Web Site Icon: full size ******************************/
@supports -moz-bool-pref("userContent.newTab.full_icon") { @supports -moz-bool-pref("userContent.newTab.full_icon") {
.top-site-outer {
width: 120px !important; /* v135: calc(var(--size-item-large) * 3); */
}
.top-site-outer .tile { .top-site-outer .tile {
width: 80px !important; /* v135: calc(var(--size-item-large) * 2); */
height: 80px !important; /* v135: calc(var(--size-item-large) * 2); */
overflow: hidden; overflow: hidden;
} }
.top-site-outer .icon-wrapper { .top-site-outer .icon-wrapper {
@ -426,7 +431,8 @@
@supports -moz-bool-pref("userContent.newTab.pocket_to_last") { @supports -moz-bool-pref("userContent.newTab.pocket_to_last") {
.body-wrapper.on { .body-wrapper.on {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap !important;
flex-direction: row !important;
} }
.body-wrapper.on > .discovery-stream.ds-layout { .body-wrapper.on > .discovery-stream.ds-layout {
flex-basis: 100%; flex-basis: 100%;

8
src/autohide/_navbar.scss
View file

@ -14,10 +14,10 @@
&, #urlbar { &, #urlbar {
opacity: 1; opacity: 1;
} }
#urlbar { }
// #1028 // #1028
pointer-events: auto; #navigator-toolbox:not(:hover, :focus-within) #nav-bar:not([customizing]) #urlbar {
} pointer-events: none;
} }
} }

5
src/combined/_back_forward_button.scss
View file

@ -3,6 +3,11 @@
@mixin _combined_forward_button() { @mixin _combined_forward_button() {
@if mode.isMediaPref() { @if mode.isMediaPref() {
@#{media} #{'-moz-pref("userChrome.combined.urlbar.nav_button") or ((not -moz-pref("userChrome.combined.sub_button.as_normal")) or (-moz-pref("userChrome.combined.nav_button") and -moz-pref("userChrome.combined.urlbar.home_button")))'} {
@content;
}
}
@else if mode.isMediaBoolPref() {
@media (-moz-bool-pref: '"userChrome.combined.urlbar.nav_button"'), @media (-moz-bool-pref: '"userChrome.combined.urlbar.nav_button"'),
((not (-moz-bool-pref: '"userChrome.combined.sub_button.as_normal"')) or ((not (-moz-bool-pref: '"userChrome.combined.sub_button.as_normal"')) or
( (

7
src/contents/_activity_stream.scss
View file

@ -36,7 +36,11 @@
/** Activity Stream - Web Site Icon: full size ******************************/ /** Activity Stream - Web Site Icon: full size ******************************/
@include Option("userContent.newTab.full_icon") { @include Option("userContent.newTab.full_icon") {
.top-site-outer { .top-site-outer {
width: 120px !important; /* v135: calc(var(--size-item-large) * 3); */
.tile { .tile {
width: 80px !important; /* v135: calc(var(--size-item-large) * 2); */
height: 80px !important; /* v135: calc(var(--size-item-large) * 2); */
overflow: hidden; overflow: hidden;
} }
@ -115,7 +119,8 @@
@include Option("userContent.newTab.pocket_to_last") { @include Option("userContent.newTab.pocket_to_last") {
.body-wrapper.on { .body-wrapper.on {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap !important;
flex-direction: row !important;
> .discovery-stream.ds-layout { > .discovery-stream.ds-layout {
flex-basis: 100%; flex-basis: 100%;

7
src/leptonChromeNightly.scss
View file

@ -3,8 +3,9 @@
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); @namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml"); @namespace html url("http://www.w3.org/1999/xhtml");
@import "leptonChrome";
/*@ NIGHTLY @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@include mode.MEDIA_PREF; @include mode.MEDIA_PREF;
@import "leptonChrome"; @import "leptonChrome";
/*@ DEPRECATED @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@include mode.MEDIA_BOOL_PREF;
@import "leptonChrome";

7
src/leptonContentNightly.scss
View file

@ -3,8 +3,9 @@
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); @namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml"); @namespace html url("http://www.w3.org/1999/xhtml");
@import "leptonContent";
/*@ NIGHTLY @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@include mode.MEDIA_PREF; @include mode.MEDIA_PREF;
@import "leptonContent"; @import "leptonContent";
/*@ DEPRECATED @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@*/
@include mode.MEDIA_BOOL_PREF;
@import "leptonContent";

24
src/utils/_mode.scss
View file

@ -1,5 +1,5 @@
$_osESR: false !default; $_osESR: false !default;
$_mediaPref: false !default; $_pref: "support-bool-pref" !default; // "support-bool-pref" | "media-bool-pref" | "media-pref"
@mixin ESR() { @mixin ESR() {
$_osESR: true !global; $_osESR: true !global;
@ -9,12 +9,16 @@ $_mediaPref: false !default;
$_osESR: false !global; $_osESR: false !global;
} }
@mixin SUPPORT_PREF() { @mixin SUPPORT_BOOL_PREF() {
$_mediaPref: false !global; $_pref: "support-bool-pref" !global;
}
@mixin MEDIA_BOOL_PREF() {
$_pref: "media-bool-pref" !global;
} }
@mixin MEDIA_PREF() { @mixin MEDIA_PREF() {
$_mediaPref: true !global; $_pref: "media-pref" !global;
} }
@function isESR() { @function isESR() {
@ -25,6 +29,14 @@ $_mediaPref: false !default;
@return not $_osESR; @return not $_osESR;
} }
@function isMediaPref() { @function isSupportBoolPref() {
@return isSTANDARD() and $_mediaPref; @return isESR() and $_pref == "support-bool-pref";
}
@function isMediaBoolPref() {
@return isSTANDARD() and $_pref == "media-bool-pref";
}
@function isMediaPref() {
@return isSTANDARD() and $_pref == "media-pref";
} }

75
src/utils/_option.scss
View file

@ -11,14 +11,17 @@
@return if($positive, $str, "(not " + $str + ")"); @return if($positive, $str, "(not " + $str + ")");
} }
@function _pref($option) { @function _supportPref($option) {
@return "-moz-bool-pref(\"#{$option}\")"; @return "-moz-bool-pref(\"#{$option}\")";
} }
@function _prefMedia($option) { @function _mediaBoolPref($option) {
@return "(-moz-bool-pref: \"#{$option}\")"; @return "(-moz-bool-pref: \"#{$option}\")";
} }
@function _mediaPref($option) {
@return "-moz-pref(\"#{$option}\")";
}
@function _getOption($optionNames, $positive: true) { @function _getOptionSupports($optionNames, $positive: true) {
$result: ""; $result: "";
@for $i from 1 through length($optionNames) { @for $i from 1 through length($optionNames) {
$option: nth($optionNames, $i); $option: nth($optionNames, $i);
@ -30,27 +33,27 @@
$result: $result + _prefix($separator, $i); $result: $result + _prefix($separator, $i);
@if type-of($option) == "list" { @if type-of($option) == "list" {
$result: $result + "(" + _getOption($option, $positive) + ")"; $result: $result + "(" + _getOptionSupports($option, $positive) + ")";
} }
@else { @else {
$result: $result + _not(_pref($option), $positive); $result: $result + _not(_supportPref($option), $positive);
} }
} }
@return $result; @return $result;
} }
@function _optionWrapper($optionNames, $positive: true) { @function _getOptionSupportsWrapper($optionNames, $positive: true) {
// Test warning for top level `not` // Test warning for top level `not`
@if length($optionNames) == 1 { @if length($optionNames) == 1 {
$option: nth($optionNames, 1); $option: nth($optionNames, 1);
@if not (type-of($option) == "list") { @if not (type-of($option) == "list") {
$option: _pref($option); $option: _supportPref($option);
@return if($positive, $option, "not " + $option); @return if($positive, $option, "not " + $option);
} }
} }
@return _getOption($optionNames, $positive); @return _getOptionSupports($optionNames, $positive);
} }
@function _getOptionMedia($optionNames, $positive: true) { @function _getOptionMediaBool($optionNames, $positive: true) {
$result: ""; $result: "";
@for $i from 1 through length($optionNames) { @for $i from 1 through length($optionNames) {
$option: nth($optionNames, $i); $option: nth($optionNames, $i);
@ -62,23 +65,60 @@
$result: $result + _prefix($separator, $i); $result: $result + _prefix($separator, $i);
@if type-of($option) == "list" { @if type-of($option) == "list" {
$result: $result + _getOptionMedia($option, $positive) ; $result: $result + _getOptionMediaBool($option, $positive) ;
} }
@else { @else {
$result: $result + _not(_prefMedia($option), $positive); $result: $result + _not(_mediaBoolPref($option), $positive);
} }
} }
@return $result; @return $result;
} }
@function _getOptionMedia($optionNames, $positive: true) {
$result: "";
@for $i from 1 through length($optionNames) {
$option: nth($optionNames, $i);
$separator: if(
list-separator($optionNames) == "comma", "or", if(
list-separator($optionNames) == "space", "and", null
)
);
$result: $result + _prefix($separator, $i);
@if type-of($option) == "list" {
$result: $result + "(" + _getOptionMedia($option, $positive) + ")";
}
@else {
$result: $result + _not(_mediaPref($option), $positive);
}
}
@return $result;
}
@function _getOptionMediaWrapper($optionNames, $positive: true) {
// Test warning for top level `not`
@if length($optionNames) == 1 {
$option: nth($optionNames, 1);
@if not (type-of($option) == "list") {
$option: _mediaPref($option);
@return if($positive, $option, "not " + $option);
}
}
@return _getOptionMedia($optionNames, $positive);
}
@mixin Option($optionNames...) { @mixin Option($optionNames...) {
@if mode.isMediaPref() { @if mode.isMediaPref() {
@media #{_getOptionMedia($optionNames)} { @#{media} #{_getOptionMediaWrapper($optionNames)} {
@content;
}
}
@else if mode.isMediaBoolPref() {
@media #{_getOptionMediaBool($optionNames)} {
@content; @content;
} }
} }
@else { @else {
@supports #{_optionWrapper($optionNames)} { @supports #{_getOptionSupportsWrapper($optionNames)} {
@content; @content;
} }
} }
@ -86,12 +126,17 @@
@mixin NotOption($optionNames...) { @mixin NotOption($optionNames...) {
@if mode.isMediaPref() { @if mode.isMediaPref() {
@media #{_getOptionMedia($optionNames, false)} { @#{media} #{_getOptionMediaWrapper($optionNames, false)} {
@content;
}
}
@else if mode.isMediaBoolPref() {
@media #{_getOptionMediaBool($optionNames, false)} {
@content; @content;
} }
} }
@else { @else {
@supports #{_optionWrapper($optionNames, false)} { @supports #{_getOptionSupportsWrapper($optionNames, false)} {
@content; @content;
} }
} }