diff --git a/arch-config/.mozilla/firefox/default-release/chrome/LEPTON b/arch-config/.mozilla/firefox/default-release/chrome/LEPTON
index 9541d392..5e79670c 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/LEPTON
+++ b/arch-config/.mozilla/firefox/default-release/chrome/LEPTON
@@ -1,3 +1,3 @@
[Info]
-Ver=v5.2.0
+Ver=v5.2.1
Branch=photon-style
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/__tests__/native_menu.test.scss b/arch-config/.mozilla/firefox/default-release/chrome/__tests__/native_menu.test.scss
new file mode 100644
index 00000000..aeefbe73
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/__tests__/native_menu.test.scss
@@ -0,0 +1,20 @@
+@use 'true' as *;
+@use "example" as *;
+@use "../src/utils/native_menu";
+
+@include test-module("Native Menu Option [mix]") {
+ @include test("simple") {
+ @include assert {
+ @include output {
+ @include native_menu.NativeMenu {
+ @include example;
+ }
+ }
+ @include expect {
+ @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") {
+ @include example;
+ }
+ }
+ }
+ }
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/css/leptonChrome.css b/arch-config/.mozilla/firefox/default-release/chrome/css/leptonChrome.css
index 6b1082d5..4e9a9792 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/css/leptonChrome.css
+++ b/arch-config/.mozilla/firefox/default-release/chrome/css/leptonChrome.css
@@ -229,8 +229,7 @@
background-color: color-mix(in srgb, -moz-menuhover 5%, transparent) !important;
border-color: color-mix(in srgb, -moz-menuhover 60%, transparent) !important;
}
-
- menu[_moz-menuactive="true"][disabled="disabled"],
+ menu[_moz-menuactive="true"][disabled="true"],
menuitem[_moz-menuactive="true"][disabled="true"] {
background-color: color-mix(in srgb, currentColor 5%, transparent) !important;
border-color: color-mix(in srgb, currentColor 60%, transparent) !important;
@@ -256,8 +255,7 @@
background-color: color-mix(in srgb, -moz-menuhover 17%, transparent) !important;
border-color: color-mix(in srgb, -moz-menuhover 80%, transparent) !important;
}
-
- menu[_moz-menuactive="true"][disabled="disabled"],
+ menu[_moz-menuactive="true"][disabled="true"],
menuitem[_moz-menuactive="true"][disabled="true"] {
background-color: color-mix(in srgb, currentColor 17%, transparent) !important;
border-color: color-mix(in srgb, currentColor 80%, transparent) !important;
@@ -318,6 +316,21 @@
}
}
}
+ /*= Titlebar Container Size at maximized #384 ================================*/
+ @supports -moz-bool-pref("userChrome.compatibility.os.windows_maximized") {
+ @media (-moz-os-version: windows-win7),
+ (-moz-platform: windows-win7),
+ (-moz-os-version: windows-win8),
+ (-moz-platform: windows-win8),
+ (-moz-os-version: windows-win10),
+ (-moz-platform: windows-win10) {
+ :root[tabsintitlebar][sizemode="maximized"] #titlebar {
+ /* -moz-default-appearance: -moz-window-titlebar */
+ appearance: none !important;
+ padding-top: 8px;
+ }
+ }
+ }
}
/*= Others - Compatibility ===================================================*/
@supports -moz-bool-pref("userChrome.compatibility.panel_cutoff") {
@@ -694,7 +707,6 @@
color: -moz-accent-color-foreground;
background-color: -moz-accent-color;
}
-
:root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) .toolbar-items,
:root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) .toolbar-items {
--toolbarbutton-icon-fill: currentColor;
@@ -1225,10 +1237,11 @@
*/
}
- /* Fallback background */
+ /* Fallback background - Set to Legacy. It will be removed Next update
menupopup:not(.cui-widget-panel.cui-widget-panelview, [placespopup="true"]) {
background-color: var(--lwt-accent-color, var(--in-content-page-background)) !important;
}
+ */
}
/* Default theme color preservation */
:root[lwtheme-mozlightdark] menupopup:not(#BMB_bookmarksPopup, [placespopup="true"]),
@@ -1250,6 +1263,29 @@
--panel-background: var(--menu-background-color) !important;
}
}
+ /*== Info Bar Color ==========================================================*/
+ .container.infobar {
+ background-color: var(--urlbar-box-bgcolor);
+ }
+
+ .notification-button {
+ background-color: var(--button-bgcolor);
+ }
+ .notification-button:hover {
+ background-color: var(--button-hover-bgcolor);
+ }
+ .notification-button:hover:active {
+ background-color: var(--button-active-bgcolor);
+ }
+
+ html|button.ghost-button:not(.semi-transparent):enabled:hover {
+ background-color: var(--button-hover-bgcolor) !important;
+ }
+
+ html|button.ghost-button:not(.semi-transparent):enabled:hover:active {
+ background-color: var(--in-content-button-background-active) !important;
+ }
+
/*== Bookmark Popup Color ====================================================*/
#editBMPanel_folderTree:-moz-lwtheme,
#editBMPanel_tagsSelector:-moz-lwtheme {
@@ -1338,7 +1374,6 @@
border: none !important;
clip-path: inset(0 round var(--panel-border-radius));
}
-
#PopupAutoComplete > richlistbox {
border-radius: var(--panel-border-radius) !important;
background-color: var(--panel-bgcolor) !important;
@@ -1356,7 +1391,6 @@
#PopupAutoComplete > richlistbox > richlistitem[originaltype="login"] > .ac-site-icon {
fill: GrayText !important;
}
-
#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"] {
--panel-border-color: var(--panel-bgcolor);
color: var(--arrowpanel-color, var(--in-content-page-color)) !important;
@@ -1366,7 +1400,6 @@
border-color: var(--panel-border-color) !important;
/* Original: rgba(38,38,38,.15) */
}
-
#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"]:hover,
#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"][selected] {
background-color: var(--arrowpanel-dimmed-further, rgba(204, 204, 204, 0.5)) !important;
@@ -1448,7 +1481,6 @@
#alertSettings > .button-box > .box-inherit {
margin: -4px 4px 3px 0 !important;
}
-
#alertSettings > .button-box > .box-inherit > .button-icon {
padding: 1px;
}
@@ -1516,15 +1548,13 @@
margin-inline: 4px !important;
min-width: 6.3em !important;
}
-
- /* Medium and small buttons get sized to 7/14 and 6/12px padding (when adding
- * the 1px border): */
button.medium {
+ /* Medium and small buttons get sized to 7/14 and 6/12px padding (when adding
+ * the 1px border): */
padding: 6px 13px !important;
min-height: 28px !important;
font-size: 0.95em !important;
}
-
button.small {
padding: 5px 11px !important;
min-height: 24px !important;
@@ -1536,15 +1566,6 @@
margin: 0 !important;
}
- button:-moz-focusring,
- xul|menulist:-moz-focusring,
- xul|checkbox:-moz-focusring > .checkbox-check,
- xul|radio[focused="true"]:-moz-focusring {
- box-shadow: none !important;
- outline: 2px solid var(--in-content-focus-outline-color) !important;
- outline-offset: 2px !important;
- }
-
button:not([disabled="true"]):hover {
background-color: var(--in-content-button-background-hover) !important;
color: var(--in-content-button-text-color-hover) !important;
@@ -1598,6 +1619,15 @@
color: var(--in-content-primary-button-text-color) !important;
}
}
+ button:-moz-focusring,
+ xul|menulist:-moz-focusring,
+ xul|checkbox:-moz-focusring > .checkbox-check,
+ xul|radio[focused="true"]:-moz-focusring {
+ box-shadow: none !important;
+ outline: 2px solid var(--in-content-focus-outline-color) !important;
+ outline-offset: 2px !important;
+ }
+
/*- Radio Button -----------------------------------------------------------*/
xul|radio {
/* margin-inline-start: 0 !important; */
@@ -1608,27 +1638,18 @@
appearance: none !important;
width: 16px !important;
height: 16px !important;
- padding: 0 !important;
border: 1px solid var(--in-content-box-border-color) !important;
border-radius: 100% !important;
+ padding: 0 !important;
+ margin-inline: 0 6px !important;
margin-block: 2px !important;
/* extend the vertical clicktarget */
- margin-inline: 0 6px !important;
background-color: var(--in-content-button-background) !important;
background-position: center !important;
flex-shrink: 0 !important;
/* avoid shrinking inside flex container */
}
- xul|radio:not([disabled="true"]):hover > xul|*.radio-check {
- background-color: var(--in-content-button-background-hover) !important;
- color: var(--in-content-button-text-color-hover) !important;
- }
-
- xul|radio:not([disabled="true"]):hover:active > xul|*.radio-check {
- background-color: var(--in-content-button-background-active) !important;
- }
-
xul|*.radio-check[selected] {
-moz-context-properties: fill !important;
fill: currentColor !important;
@@ -1640,11 +1661,18 @@
color-adjust: exact !important;
}
+ xul|radio:not([disabled="true"]):hover > xul|*.radio-check {
+ background-color: var(--in-content-button-background-hover) !important;
+ color: var(--in-content-button-text-color-hover) !important;
+ }
+ xul|radio:not([disabled="true"]):hover:active > xul|*.radio-check {
+ background-color: var(--in-content-button-background-active) !important;
+ }
+
xul|radio:not([disabled="true"])[selected]:hover > xul|*.radio-check {
background-color: var(--in-content-primary-button-background-hover) !important;
color: var(--in-content-primary-button-text-color-hover) !important;
}
-
xul|radio:not([disabled="true"])[selected]:hover:active > xul|*.radio-check {
background-color: var(--in-content-primary-button-background-active) !important;
}
@@ -1659,11 +1687,6 @@
xul|radio[disabled="true"],
xul|label[disabled="true"] {
color: inherit !important;
- }
-
- xul|checkbox[disabled="true"],
- xul|radio[disabled="true"],
- xul|label[disabled="true"] {
opacity: 0.5 !important;
}
@@ -1675,30 +1698,31 @@
margin: 4px 2px !important;
}
- .checkbox-icon[src] {
- margin-inline-end: 2px !important;
- }
-
- .checkbox-label {
- margin: 1px 0 !important;
- }
-
- checkbox[disabled="true"] {
- opacity: 0.4 !important;
- }
-
.checkbox-check {
appearance: none !important;
- color: var(--checkbox-border-color, ThreeDDarkShadow) !important;
- background-color: var(--checkbox-unchecked-bgcolor, Field) !important;
+ width: 16px !important;
+ height: 16px !important;
border: 1px solid currentColor !important;
border-radius: 2px !important;
+ color: var(--checkbox-border-color, ThreeDDarkShadow) !important;
+ background-color: var(--checkbox-unchecked-bgcolor, Field) !important;
margin-inline-end: 6px !important;
+ /* or 2px */
+ margin-block: 2px !important;
+ /* From common.css */
}
- .checkbox-check {
- height: 16px !important;
- width: 16px !important;
+ .checkbox-check[checked] {
+ -moz-context-properties: fill !important;
+ fill: currentColor !important;
+ color: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
+ border-color: var(--checkbox-checked-border-color, transparent) !important;
+ background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important;
+ background-image: url("chrome://global/skin/icons/check.svg") !important;
+ background-position: center !important;
+ background-repeat: no-repeat !important;
+ /* Style the button also when printing with "Print Backgrounds" unchecked */
+ color-adjust: exact !important;
}
checkbox:not([disabled="true"]):hover > .checkbox-check {
@@ -1707,34 +1731,18 @@
color-mix(in srgb, -moz-accent-color 4%, Field)
) !important;
}
-
checkbox:not([disabled="true"]):hover:active > .checkbox-check {
background-color: var(
--checkbox-unchecked-active-bgcolor,
color-mix(in srgb, -moz-accent-color 8%, Field)
) !important;
}
-
- .checkbox-check[checked] {
- border-color: var(--checkbox-checked-border-color, transparent) !important;
- background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important;
- background-image: url("chrome://global/skin/icons/check.svg") !important;
- background-position: center !important;
- background-repeat: no-repeat !important;
- -moz-context-properties: fill !important;
- fill: currentColor !important;
- color: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
- /* Style the button also when printing with "Print Backgrounds" unchecked */
- color-adjust: exact !important;
- }
-
checkbox:not([disabled="true"]):hover > .checkbox-check[checked] {
background-color: var(
--checkbox-checked-hover-bgcolor,
color-mix(in srgb, currentColor 12.5%, -moz-accent-color)
) !important;
}
-
checkbox:not([disabled="true"]):hover:active > .checkbox-check[checked] {
background-color: var(
--checkbox-checked-active-bgcolor,
@@ -1758,17 +1766,25 @@
fill: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
}
- checkbox:not([disabled="true"]):hover:active > .checkbox-check[checked],
- checkbox:not([disabled="true"]):hover > .checkbox-check[checked] {
+ checkbox:not([disabled="true"]):hover:active > .checkbox-check[checked] > .checkbox-check[checked],
+ checkbox:not([disabled="true"]):hover > .checkbox-check[checked] > .checkbox-check[checked] {
color: var(--checkbox-checked-border-color-hover, -moz-accent-color-foreground) !important;
fill: var(--checkbox-checked-border-color-hover, -moz-accent-color-foreground) !important;
}
}
- /* From common.css */
- xul|*.checkbox-check {
- margin-block: 2px !important;
+ .checkbox-icon[src] {
+ margin-inline-end: 2px !important;
}
+ .checkbox-label {
+ margin: 1px 0 !important;
+ }
+
+ checkbox[disabled="true"] {
+ opacity: 0.4 !important;
+ }
+
+ /* From common.css */
xul|richlistitem > xul|*.checkbox-check {
margin: 3px 6px !important;
}
@@ -1784,25 +1800,20 @@
padding-inline: 12px 8px !important;
margin: 5px 2px 3px !important;
}
-
xul|menulist[size="medium"] {
padding-block: 6px !important;
padding-inline: 16px 10px !important;
}
-
xul|menulist[size="large"] {
padding-block: 8px !important;
padding-inline: 16px 12px !important;
}
-
xul|menulist:hover {
background-color: var(--button-hover-bgcolor, color-mix(in srgb, currentColor 10%, ButtonFace)) !important;
}
-
xul|menulist:hover:active {
background-color: var(--button-active-bgcolor, color-mix(in srgb, currentColor 20%, ButtonFace)) !important;
}
-
xul|menulist:-moz-focusring {
outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important;
outline-offset: var(--focus-outline-offset, 2px) !important;
@@ -1820,11 +1831,10 @@
width: 12px !important;
height: 12px !important;
}
-
- /* dropmarker::part(icon)
- * ::part is not apply chrome
- */
dropmarker[exportparts="icon: dropmarker-icon"] {
+ /* dropmarker::part(icon)
+ * ::part is not apply chrome
+ */
list-style-image: url("chrome://global/skin/icons/arrow-down.svg") !important;
-moz-context-properties: fill !important;
fill: currentColor !important;
@@ -1865,13 +1875,11 @@
color: var(--in-content-item-hover-text) !important;
background-color: var(--in-content-item-hover) !important;
}
-
xul|menulist > xul|menupopup > xul|menu:not([disabled="true"])[selected="true"],
xul|menulist > xul|menupopup > xul|menuitem:not([disabled="true"])[selected="true"] {
color: var(--in-content-item-selected-text) !important;
background-color: var(--in-content-item-selected) !important;
}
-
xul|menulist > xul|menupopup > xul|menu[disabled="true"],
xul|menulist > xul|menupopup > xul|menuitem[disabled="true"] {
color: #999 !important;
@@ -2079,21 +2087,18 @@
padding: 8px !important;
margin: 2px 4px !important;
}
-
#locationTextBox:focus {
border-color: transparent !important;
outline: 2px solid var(--in-content-focus-outline-color) !important;
outline-offset: -1px !important;
/* Prevents antialising around the corners */
}
-
#locationTextBox:-moz-ui-invalid {
border-color: transparent !important;
outline: 2px solid var(--in-content-border-invalid) !important;
outline-offset: -1px !important;
/* Prevents antialising around the corners */
}
-
#locationTextBox:disabled {
opacity: 0.4 !important;
}
@@ -2107,7 +2112,6 @@
-moz-context-properties: fill !important;
fill: currentColor !important;
}
-
#exceptiondialog:first-child > hbox > vbox > image {
display: none !important;
}
@@ -2123,26 +2127,6 @@
border-radius: 8px !important;
padding: var(--in-content-button-vertical-padding) var(--in-content-button-horizontal-padding) !important;
margin: 4px !important;
- }
-
- #viewGroup > radio:hover {
- background-color: var(--in-content-button-background-hover) !important;
- /* #E0E8F6; */
- }
-
- #viewGroup > radio[selected="true"] {
- color: var(--in-content-button-text-color) !important;
- /* SelectedItemText */
- background-color: var(--in-content-button-background-active) !important;
- /* #C1D2EE; */
- }
-
- #viewGroup > radio {
- color: var(--in-content-deemphasized-text) !important;
- /* FieldText */
- }
-
- #viewGroup > radio {
list-style-image: none !important;
background-image: var(--viewgroup-image) !important;
background-repeat: no-repeat;
@@ -2150,6 +2134,18 @@
background-size: 32px !important;
-moz-context-properties: fill !important;
fill: currentColor !important;
+ color: var(--in-content-deemphasized-text) !important;
+ /* FieldText */
+ }
+ #viewGroup > radio:hover {
+ background-color: var(--in-content-button-background-hover) !important;
+ /* #E0E8F6; */
+ }
+ #viewGroup > radio[selected="true"] {
+ color: var(--in-content-button-text-color) !important;
+ /* SelectedItemText */
+ background-color: var(--in-content-button-background-active) !important;
+ /* #C1D2EE; */
}
#generalTab {
@@ -2173,13 +2169,13 @@
margin: 0 !important;
padding: 0 6px !important;
}
-
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
#viewGroup > radio > .radio-label-box {
padding-top: 32px !important;
/* as -moz-image-region: rect(0px, 32px, 32px, 0px); */
}
}
+
#mainDeck input {
color: var(--in-content-page-color) !important;
}
@@ -2204,7 +2200,6 @@
background: var(--in-content-table-header-background) !important;
color: var(--in-content-table-header-color) !important;
}
-
treecols > treecol,
treecols > treecolpicker.treecol-image {
-moz-appearance: none !important;
@@ -2227,27 +2222,22 @@
treechildren::-moz-tree-row(odd) {
background-color: var(--in-content-box-background-odd) !important;
}
-
treechildren::-moz-tree-row(hover) {
color: var(--in-content-item-hover-text) !important;
background-color: var(--in-content-item-hover) !important;
}
-
treechildren::-moz-tree-row(selected) {
background-color: var(--in-content-item-selected) !important;
}
-
treechildren::-moz-tree-cell {
border-inline: 1px solid var(--in-content-table-border-color) !important;
border-spacing: 0 !important;
padding: 4px !important;
margin: 0 !important;
}
-
treechildren::-moz-tree-cell-text(hover) {
color: var(--in-content-item-hover-text) !important;
}
-
treechildren::-moz-tree-cell-text(selected) {
font-weight: 600 !important;
color: var(--in-content-item-selected-text) !important;
@@ -2299,7 +2289,6 @@
--organizer-toolbar-field-focus-box-shadow: unset;
--organizer-pane-field-border-color: ThreeDShadow;
}
-
@media not all and (prefers-contrast) {
:root {
--organizer-color: var(--in-content-page-color);
@@ -2328,7 +2317,6 @@
--organizer-toolbar-field-focus-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.23);
--organizer-pane-field-border-color: color-mix(in srgb, currentColor 41%, transparent);
}
-
@media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) {
:root {
--organizer-color: rgb(251, 251, 254);
@@ -2344,6 +2332,7 @@
}
}
}
+
/*- Toolbar & Menus ------------------------------------------------------*/
#placesToolbar {
appearance: none !important;
@@ -2353,22 +2342,18 @@
padding: 4px !important;
padding-inline-end: 6px !important;
}
-
#placesToolbar > toolbarbutton {
appearance: none !important;
padding: 5px !important;
border-radius: 4px !important;
}
-
#placesToolbar > toolbarbutton[disabled] {
opacity: 0.6 !important;
}
-
#placesToolbar > toolbarbutton:not([disabled]):hover {
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-hover-color) !important;
}
-
#placesToolbar > toolbarbutton:not([disabled]):hover:active {
background-color: var(--organizer-selected-background) !important;
}
@@ -2383,7 +2368,6 @@
#placesMenu {
margin-inline-start: 6px !important;
}
-
#placesMenu > menu {
appearance: none !important;
color: var(--organizer-color) !important;
@@ -2392,19 +2376,16 @@
padding-inline-start: 5px !important;
margin-inline-end: 2px !important;
}
-
#placesMenu > menu[_moz-menuactive="true"],
#placesMenu > menu:hover {
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-hover-color) !important;
}
-
#placesMenu > menu:hover:active,
#placesMenu > menu[open] {
background-color: var(--organizer-selected-background) !important;
color: var(--organizer-selected-color) !important;
}
-
#placesMenu > menu > .menubar-text {
margin-block: 0 !important;
/* override menu.css */
@@ -2495,7 +2476,6 @@
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-color) !important;
}
-
treecol:not([hideheader="true"], [sortable="false"]):hover:active,
treecolpicker:hover:active {
background-color: var(--organizer-selected-background) !important;
@@ -2526,38 +2506,31 @@
treechildren::-moz-tree-row {
background-color: transparent !important;
}
-
treechildren::-moz-tree-row(hover) {
background-color: var(--organizer-hover-background) !important;
}
-
treechildren::-moz-tree-row(selected) {
background-color: var(--organizer-selected-background) !important;
color: var(--organizer-selected-color) !important;
border: 1px solid transparent !important;
}
-
treechildren::-moz-tree-image(hover),
treechildren::-moz-tree-twisty(hover),
treechildren::-moz-tree-cell-text(hover) {
color: var(--organizer-hover-color) !important;
}
-
treechildren::-moz-tree-image(selected),
treechildren::-moz-tree-twisty(selected),
treechildren::-moz-tree-cell-text(selected) {
color: var(--organizer-selected-color) !important;
}
-
treechildren::-moz-tree-separator {
height: 1px !important;
border-color: var(--organizer-separator-color) !important;
}
-
treechildren::-moz-tree-separator(hover) {
border-color: var(--organizer-hover-color) !important;
}
-
treechildren::-moz-tree-separator(selected) {
border-color: var(--organizer-selected-color) !important;
}
@@ -2581,36 +2554,34 @@
border-radius: 4px !important;
color: var(--organizer-color) !important;
background-color: var(--organizer-content-background) !important;
- list-style-image: url("chrome://global/skin/icons/arrow-down-12.svg");
-moz-context-properties: fill !important;
fill: currentColor !important;
}
-
#editBookmarkPanelRows .expander-up:hover,
#editBookmarkPanelRows .expander-down:hover {
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-hover-color) !important;
}
-
#editBookmarkPanelRows .expander-up:hover:active,
#editBookmarkPanelRows .expander-down:hover:active {
background-color: var(--organizer-selected-background) !important;
color: var(--organizer-selected-color) !important;
}
-
#editBookmarkPanelRows .expander-up:focus-visible,
#editBookmarkPanelRows .expander-down:focus-visible {
outline: 2px solid var(--organizer-outline-color) !important;
outline-offset: -1px !important;
}
+ #editBookmarkPanelRows .expander-up > .button-box,
+ #editBookmarkPanelRows .expander-down > .button-box {
+ padding: 0 !important;
+ }
#editBookmarkPanelRows .expander-up {
list-style-image: url("chrome://global/skin/icons/arrow-up-12.svg");
}
-
- #editBookmarkPanelRows .expander-up > .button-box,
- #editBookmarkPanelRows .expander-down > .button-box {
- padding: 0 !important;
+ #editBookmarkPanelRows .expander-down {
+ list-style-image: url("chrome://global/skin/icons/arrow-down-12.svg");
}
#places input {
@@ -2621,12 +2592,10 @@
min-height: 20px !important;
padding-inline: 4px !important;
}
-
#places input:focus {
outline: 2px solid var(--organizer-outline-color) !important;
outline-offset: -1px !important;
}
-
#places input:not(:read-write):focus {
outline: none !important;
}
@@ -2643,16 +2612,13 @@
border: 1px solid var(--organizer-border-color) !important;
border-radius: 4px !important;
}
-
#editBMPanel_tagsSelectorRow > richlistbox > richlistitem {
border: 1px solid transparent !important;
}
-
#editBMPanel_tagsSelectorRow > richlistbox > richlistitem:hover {
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-hover-color) !important;
}
-
#editBMPanel_tagsSelectorRow > richlistbox > richlistitem[selected] {
background-color: var(--organizer-selected-background) !important;
color: var(--organizer-selected-color) !important;
@@ -5844,7 +5810,7 @@
list-style-image: url("../icons/window-dev-tools.svg");
}
- /* Browser Content Toolbaox - */
+ /* Browser Content Toolbox */
#appmenu-developer-tools-view .subviewbutton:nth-child(5),
#PanelUI-developer-tools-view .subviewbutton:nth-child(5) {
list-style-image: url("../icons/command-frames.svg");
@@ -5954,7 +5920,7 @@
}
#allTabsMenu-hiddenTabsButton {
- list-style-image: url("../icons/password-hide.svg");
+ list-style-image: url("../icons/eye-hide.svg");
}
#allTabsMenu-containerTabsView .subviewbutton:last-child {
@@ -5980,6 +5946,14 @@
display: -moz-box !important;
}
}
+ /* BMB_bookmarksToolbarPopup */
+ #BMB_viewBookmarksToolbar[data-l10n-args='{"isVisible":true}'] {
+ --menuitem-image: url("../icons/eye-hide.svg");
+ }
+ #BMB_viewBookmarksToolbar[data-l10n-args='{"isVisible":false}'] {
+ --menuitem-image: url("../icons/eye-show.svg");
+ }
+
/*= protections-popup ========================================================*/
#protections-popup-settings-button > .protections-popup-settings-icon,
#protections-popup-show-report-button > .protections-popup-show-report-icon {
@@ -6045,30 +6019,31 @@
}
/** Menu - Icons Layout *******************************************************/
@supports -moz-bool-pref("userChrome.icon.menu") {
- menupopup menuitem:not([type="checkbox"], [type="radio"]),
- menupopup menu:not([type="checkbox"], [type="radio"]),
+ menupopup menuitem:not([type="checkbox"][checked="true"], [type="radio"]),
+ menupopup menu:not([type="checkbox"][checked="true"], [type="radio"]),
#main-menubar > menu {
-moz-appearance: none !important;
/* Linux: menulist */
}
/* Icon */
- :not(menu, #ContentSelectDropdown)
- > menupopup
- > menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- :not(menu, #ContentSelectDropdown)
- > menupopup
- > menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
#main-menubar > menu,
+ :not(menu, #ContentSelectDropdown)
+ > menupopup
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ :not(menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, .in-menulist, [checked="true"]),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu,
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup) > menuitem,
+ menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup)
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup)
+ > menuitem,
.openintabs-menuitem,
- #blockedPopupDontShowMessage {
+ #blockedPopupDontShowMessage,
+ #BMB_viewBookmarksToolbar {
/* Color */
-moz-context-properties: fill, fill-opacity !important;
fill: currentColor !important;
@@ -6078,17 +6053,16 @@
background-image: var(--menuitem-image);
}
- /* For native context menus on macOS */
- @supports -moz-bool-pref("widget.macos.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") {
:not(menu, #ContentSelectDropdown)
> menupopup
- > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
- :not(menu, #ContentSelectDropdown)
- > menupopup
- > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist) {
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ :not(menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, .in-menulist, [checked="true"]) {
list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important;
}
}
+
/* Padding */
:root {
--context-menu-background-padding-default: 5px;
@@ -6097,15 +6071,24 @@
:not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem:not(.menuitem-iconic),
:not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu:not(.menu-iconic),
+ :not(menu, #ContentSelectDropdown, #context-navigation)
+ > menupopup
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ :not(menu, #ContentSelectDropdown, #context-navigation)
+ > menupopup
+ > menu:not(.menu-iconic, .in-menulist, [checked="true"]),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"], .bookmark-item),
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu,
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup) > menuitem,
+ menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup)
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup)
+ > menuitem,
.openintabs-menuitem,
- #blockedPopupDontShowMessage {
+ #blockedPopupDontShowMessage,
+ #BMB_viewBookmarksToolbar {
background-position: left var(--context-menu-background-padding) center !important;
padding-inline-start: var(--context-menu-background-padding) !important;
}
@@ -6117,17 +6100,14 @@
padding-inline-start: calc(16px + var(--context-menu-background-padding-default)) !important;
padding-inline-end: 3px;
}
-
#main-menubar > menu:first-child {
background-position: left calc(3px + var(--context-menu-background-padding-default)) center !important;
padding-inline-start: calc(19px + var(--context-menu-background-padding-default)) !important;
}
-
#main-menubar > menu > menupopup {
--menuitem-image: none;
/* Prevent Image Inheritance */
}
-
@supports not -moz-bool-pref("userChrome.padding.global_menubar") {
#main-menubar > menu {
padding-block: 2px !important;
@@ -6135,24 +6115,6 @@
}
}
/* Padding - Windows */
- @media (-moz-os-version: windows-win7),
- (-moz-platform: windows-win7),
- (-moz-os-version: windows-win8),
- (-moz-platform: windows-win8),
- (-moz-os-version: windows-win10),
- (-moz-platform: windows-win10) {
- /* Checkbox */
- :root {
- --context-menu-text-padding: calc(var(--menu-padding) + var(--context-menu-background-padding-default) + 16px);
- }
-
- :not(menu, #ContentSelectDropdown, #context-navigation)
- > menupopup
- > menuitem[type="checkbox"]:not([checked="true"])
- > .menu-iconic-left {
- padding-inline-start: var(--context-menu-text-padding);
- }
- }
@media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) {
:root {
--context-menu-background-padding-default: 2px;
@@ -6169,19 +6131,22 @@
(-moz-platform: windows-win8) {
:not(menu, #ContentSelectDropdown, #context-navigation)
> menupopup
- > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
:not(menu, #ContentSelectDropdown, #context-navigation)
> menupopup
- > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist),
+ > menu:not(.menu-iconic, .in-menulist, [checked="true"]),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"], .bookmark-item),
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu,
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup) > menuitem,
+ menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup)
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup)
+ > menuitem,
.openintabs-menuitem,
- #blockedPopupDontShowMessage {
+ #blockedPopupDontShowMessage,
+ #BMB_viewBookmarksToolbar {
background-position: left var(--context-menu-background-padding) center !important;
padding-inline-start: 0 !important;
}
@@ -6198,19 +6163,22 @@
:not(menu, #ContentSelectDropdown, #context-navigation)
> menupopup
- > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
:not(menu, #ContentSelectDropdown, #context-navigation)
> menupopup
- > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist),
+ > menu:not(.menu-iconic, .in-menulist, [checked="true"]),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"], .bookmark-item),
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu,
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup) > menuitem,
+ menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup)
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup)
+ > menuitem,
.openintabs-menuitem,
- #blockedPopupDontShowMessage {
+ #blockedPopupDontShowMessage,
+ #BMB_viewBookmarksToolbar {
padding-inline-start: var(--menu-background-padding-default) !important;
margin-left: 0 !important;
}
@@ -6235,32 +6203,29 @@
/* context menu width */
:not(menu, #ContentSelectDropdown, #context-navigation)
> menupopup
- > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
:not(menu, #ContentSelectDropdown, #context-navigation)
> menupopup
- > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist),
+ > menu:not(.menu-iconic, .in-menulist, [checked="true"]),
#blockedPopupDontShowMessage {
padding-inline-end: var(--context-menu-background-padding) !important;
}
/* text position */
:not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem > .menu-text,
- :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu > menu-text {
+ :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu > .menu-text {
padding-inline-start: var(--context-menu-mac-padding) !important;
}
/* Checkbox menuitem, None iconic menu */
- :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem[type="checkbox"],
+ :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem[checked="true"],
:not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu:not(.menu-iconic) {
padding-inline-start: calc(var(--context-menu-background-padding) + var(--context-menu-mac-padding)) !important;
}
/* Global Menu */
/* Disabled. some icons not appear
- menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"], .bookmark-item),
- menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]) {
+ menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup) menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked=true]), menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup) menu:not(.menu-iconic, .in-menulist, [checked=true]) {
list-style-image: var(--menuitem-image, url("../icons/blank.svg"));
}
*/
@@ -6419,6 +6384,12 @@
--menuitem-image: url("../icons/share.svg");
}
+ @supports -moz-bool-pref("userChrome.icon.menu.full") {
+ #context_shareTabURL,
+ menuitem.share-tab-url-item {
+ --menuitem-image: url("../icons/share.svg");
+ }
+ }
#context_reopenInContainer {
--menuitem-image: url("../icons/container-openin-16.svg");
}
@@ -6463,14 +6434,20 @@
--menuitem-image: url("chrome://browser/skin/pin-12.svg");
}
- .toolbar-context-autohide-downloads-button {
- --menuitem-image: url("../icons/password-hide.svg");
+ #toolbar-context-autohide-downloads-button {
+ /* checkbox */
+ --menuitem-image: url("../icons/eye-tracking-off.svg");
}
.customize-context-removeFromToolbar {
--menuitem-image: url("chrome://global/skin/icons/delete.svg");
}
+ #toolbar-context-always-open-downloads-panel {
+ /* checkbox */
+ --menuitem-image: url("../icons/drawer-arrow-download.svg");
+ }
+
#toolbar-context-openANewTab {
--menuitem-image: url("chrome://browser/skin/new-tab.svg");
}
@@ -6495,7 +6472,7 @@
#toggle_toolbar-menubar {
/* checkbox */
- /* --menuitem-image: url("../icons/calendar-agenda.svg"); */
+ --menuitem-image: url("../icons/calendar-agenda.svg");
}
#toggle_PersonalToolbar {
@@ -6507,6 +6484,15 @@
--menuitem-image: url("chrome://browser/skin/customize.svg");
}
+ .fullscreen-context-autohide {
+ /* checkbox */
+ --menuitem-image: url("../icons/eye-tracking-off.svg");
+ }
+
+ #toolbar-context-menu > menuitem[data-l10n-id="full-screen-exit"] {
+ --menuitem-image: url("chrome://browser/skin/fullscreen-exit.svg");
+ }
+
/*= contentAreaContextMenu ===================================================*/
#context-viewsource-goToLine {
--menuitem-image: url("../icons/text-number-format.svg");
@@ -6514,12 +6500,12 @@
#context-viewsource-wrapLongLines {
/* checkbox */
- /* --menuitem-image: url("../icons/arrow-sort-down-lines.svg"); */
+ --menuitem-image: url("../icons/arrow-sort-down-lines.svg");
}
#context-viewsource-highlightSyntax {
/* checkbox */
- /* --menuitem-image: url("../icons/code.svg"); */
+ --menuitem-image: url("../icons/code.svg");
}
#spell-no-suggestions {
@@ -6604,7 +6590,7 @@
#context-media-loop {
/* checkbox */
- /* --menuitem-image: url("../icons/arrow-repeat-all.svg"); */
+ --menuitem-image: url("../icons/arrow-repeat-all.svg");
}
#context-leave-dom-fullscreen {
@@ -6629,7 +6615,7 @@
#context-video-pictureinpicture {
/* checkbox */
- /* --menuitem-image: url("chrome://global/skin/media/picture-in-picture-open.svg"); */
+ --menuitem-image: url("chrome://global/skin/media/picture-in-picture-open.svg");
}
#context-reloadimage {
@@ -6720,6 +6706,12 @@
--menuitem-image: url("../icons/undo.svg");
}
+ @supports -moz-bool-pref("userChrome.icon.menu.full") {
+ #context-redo {
+ --menuitem-image: url("../icons/redo.svg");
+ }
+ }
+
#context-cut {
--menuitem-image: url("chrome://browser/skin/edit-cut.svg");
}
@@ -6763,6 +6755,7 @@
#spell-check-enabled {
/* checkbox */
+ --menuitem-image: url("../icons/text-proofing-tools.svg");
}
#spell-add-dictionaries-main {
@@ -6798,7 +6791,7 @@
/* iconic */
}
- @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+ @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") {
#context-back {
--menuitem-image: url("chrome://browser/skin/back.svg");
}
@@ -6819,6 +6812,64 @@
--menuitem-image: url("chrome://browser/skin/bookmark.svg");
}
}
+ /*= downloadsContextMenu =====================================================*/
+ .downloadPauseMenuItem {
+ --menuitem-image: url("chrome://global/skin/media/pause-fill.svg");
+ }
+
+ .downloadResumeMenuItem {
+ --menuitem-image: url("chrome://global/skin/media/play-fill.svg");
+ }
+
+ .downloadUnblockMenuItem {
+ --menuitem-image: url("../icons/checkmark-circle.svg");
+ }
+
+ .downloadUseSystemDefaultMenuItem {
+ --menuitem-image: url("chrome://browser/skin/open.svg");
+ }
+
+ .downloadAlwaysUseSystemDefaultMenuItem {
+ /* checkbox */
+ --menuitem-image: url("../icons/folder-globe.svg");
+ }
+
+ .downloadAlwaysOpenSimilarFilesMenuItem {
+ /* checkbox */
+ --menuitem-image: url("../icons/fluid.svg");
+ }
+
+ .downloadShowMenuItem {
+ --menuitem-image: url("chrome://global/skin/icons/folder.svg");
+ }
+ @supports -moz-bool-pref("userChrome.icon.library") {
+ .downloadShowMenuItem {
+ --menuitem-image: url("../icons/folder.svg");
+ }
+ }
+
+ #downloadsContextMenu > menuitem.downloadOpenReferrerMenuItem,
+ #downloadsContextMenu > menuitem[command="downloadsCmd_openReferrer"] {
+ --menuitem-image: url("../icons/link-square.svg");
+ }
+ #downloadsContextMenu > menuitem.downloadCopyLocationMenuItem,
+ #downloadsContextMenu > menuitem[command="downloadsCmd_copyLocation"] {
+ --menuitem-image: url("../icons/link.svg");
+ }
+
+ .downloadDeleteFileMenuItem {
+ --menuitem-image: url("chrome://global/skin/icons/delete.svg");
+ }
+
+ .downloadRemoveFromHistoryMenuItem {
+ --menuitem-image: url("../icons/eraser.svg");
+ }
+
+ #downloadsContextMenu > menuitem[command="downloadsCmd_clearList"],
+ #downloadsContextMenu > menuitem[command="downloadsCmd_clearDownloads"] {
+ --menuitem-image: url("../icons/broom.svg");
+ }
+
/*= placeContext =============================================================*/
#placesContext_open {
--menuitem-image: url("../icons/link-square.svg");
@@ -6835,6 +6886,10 @@
--menuitem-image: url("chrome://browser/skin/new-tab.svg");
}
+ #placesContext_open\:newcontainertab {
+ --menuitem-image: url("../icons/container-openin-16.svg");
+ }
+
#placesContext_open\:newwindow {
--menuitem-image: url("chrome://browser/skin/window.svg");
}
@@ -6880,10 +6935,12 @@
--menuitem-image: url("chrome://browser/skin/bookmark.svg");
}
+ #placesContext_showInFolder,
#placesContext_new\:folder {
--menuitem-image: url("chrome://global/skin/icons/folder.svg");
}
@supports -moz-bool-pref("userChrome.icon.library") {
+ #placesContext_showInFolder,
#placesContext_new\:folder {
--menuitem-image: url("../icons/folder.svg");
}
@@ -6903,7 +6960,7 @@
#show-other-bookmarks_PersonalToolbar {
/* checkbox */
- /* --menuitem-image: url("../icons/star-line-horizontal.svg"); */
+ --menuitem-image: url("../icons/star-line-horizontal.svg");
}
#placesContext_showAllBookmarks {
@@ -6931,6 +6988,7 @@
/*= autohide-context =========================================================*/
#autohide-context > menuitem[data-l10n-id="full-screen-autohide"] {
/* checkbox */
+ --menuitem-image: url("../icons/eye-tracking-off.svg");
}
#autohide-context > menuitem[data-l10n-id="full-screen-exit"] {
@@ -6946,8 +7004,7 @@
.pageActionContextMenuItem.extensionPinned.extensionUnpinned.manageExtensionItem {
--menuitem-image: url("chrome://global/skin/icons/settings.svg");
}
-
- .pageActionContextMenuItem.extensionPinned.extensionUnpinned.removeExtensionItem {
+ .pageActionContextMenuItem.extensionPinned.extensionUnpinned .removeExtensionItem {
--menuitem-image: url("chrome://global/skin/icons/delete.svg");
}
@@ -6977,57 +7034,7 @@
/*= downloads-button-autohide-panel ==========================================*/
#downloads-button-autohide-checkbox {
/* checkbox */
- }
-
- /*= downloadsContextMenu =====================================================*/
- .downloadPauseMenuItem {
- --menuitem-image: url("chrome://global/skin/media/pause-fill.svg");
- }
-
- .downloadResumeMenuItem {
- --menuitem-image: url("chrome://global/skin/media/play-fill.svg");
- }
-
- .downloadUnblockMenuItem {
- --menuitem-image: url("../icons/checkmark-circle.svg");
- }
-
- .downloadUseSystemDefaultMenuItem {
- --menuitem-image: url("chrome://browser/skin/open.svg");
- }
-
- .downloadAlwaysUseSystemDefaultMenuItem {
- /* checkbox */
- }
-
- .downloadShowMenuItem {
- --menuitem-image: url("chrome://global/skin/icons/folder.svg");
- }
- @supports -moz-bool-pref("userChrome.icon.library") {
- .downloadShowMenuItem {
- --menuitem-image: url("../icons/folder.svg");
- }
- }
-
- #downloadsContextMenu > menuitem[command="downloadsCmd_openReferrer"] {
- --menuitem-image: url("../icons/link-square.svg");
- }
-
- #downloadsContextMenu > menuitem[command="downloadsCmd_copyLocation"] {
- --menuitem-image: url("../icons/link.svg");
- }
-
- .downloadDeleteFileMenuItem {
- --menuitem-image: url("chrome://global/skin/icons/delete.svg");
- }
-
- .downloadRemoveFromHistoryMenuItem {
- --menuitem-image: url("../icons/eraser.svg");
- }
-
- #downloadsContextMenu > menuitem[command="downloadsCmd_clearList"],
- #downloadsContextMenu > menuitem[command="downloadsCmd_clearDownloads"] {
- --menuitem-image: url("../icons/broom.svg");
+ --menuitem-image: url("../icons/eye-tracking-off.svg");
}
/*= SyncedTabsSidebarContext =================================================*/
@@ -7101,6 +7108,12 @@
--menuitem-image: url("../icons/undo.svg");
}
+ @supports -moz-bool-pref("userChrome.icon.menu.full") {
+ #urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_redo"] {
+ --menuitem-image: url("../icons/redo.svg");
+ }
+ }
+
#urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_cut"] {
--menuitem-image: url("chrome://browser/skin/edit-cut.svg");
}
@@ -7127,6 +7140,12 @@
--menuitem-image: url("../icons/undo.svg");
}
+ @supports -moz-bool-pref("userChrome.icon.menu.full") {
+ .textbox-contextmenu > menuitem[data-l10n-id="text-action-redo"] {
+ --menuitem-image: url("../icons/redo.svg");
+ }
+ }
+
.textbox-contextmenu > menuitem[data-l10n-id="text-action-cut"] {
--menuitem-image: url("chrome://browser/skin/edit-cut.svg");
}
@@ -7153,38 +7172,25 @@
}
/*= context_sendTabToDevicePopupMenu =========================================*/
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="phone"] {
+ .sync-menuitem.sendtab-target[clientType="phone"] {
--menuitem-image: url("chrome://browser/skin/device-phone.svg");
}
-
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="tablet"] {
+ .sync-menuitem.sendtab-target[clientType="tablet"] {
--menuitem-image: url("chrome://browser/skin/device-tablet.svg");
}
-
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="desktop"] {
+ .sync-menuitem.sendtab-target[clientType="desktop"] {
--menuitem-image: url("chrome://browser/skin/device-desktop.svg");
}
-
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="tv"] {
+ .sync-menuitem.sendtab-target[clientType="tv"] {
--menuitem-image: url("chrome://browser/skin/device-tv.svg");
}
-
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="vr"] {
+ .sync-menuitem.sendtab-target[clientType="vr"] {
--menuitem-image: url("chrome://browser/skin/device-vr.svg");
}
-
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType=""] {
+ .sync-menuitem.sendtab-target[clientType=""] {
--menuitem-image: url("../icons/send-to-device.svg");
}
-
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target:not([clientType]) {
+ .sync-menuitem.sendtab-target:not([clientType]) {
--menuitem-image: url("chrome://global/skin/icons/settings.svg");
}
}
@@ -7225,6 +7231,10 @@
--menuitem-image: url("chrome://browser/skin/new-tab.svg");
}
+ #menu_newUserContext {
+ --menuitem-image: url("../icons/container-openin-16.svg");
+ }
+
#menu_newNavigator {
--menuitem-image: url("chrome://browser/skin/window.svg");
}
@@ -7253,6 +7263,11 @@
--menuitem-image: url("chrome://browser/skin/import.svg");
}
+ #goOfflineMenuitem {
+ /* checkbox */
+ --menuitem-image: url("../icons/plug-disconnected.svg");
+ }
+
#menu_FileQuitItem {
--menuitem-image: url("../icons/quit.svg");
}
@@ -7267,6 +7282,12 @@
--menuitem-image: url("../icons/undo.svg");
}
+ @supports -moz-bool-pref("userChrome.icon.menu.full") {
+ #menu_redo {
+ --menuitem-image: url("../icons/redo.svg");
+ }
+ }
+
#menu_cut {
--menuitem-image: url("chrome://browser/skin/edit-cut.svg");
}
@@ -7317,6 +7338,7 @@
}
#fullScreenItem {
+ /* checkbox */
--menuitem-image: url("chrome://browser/skin/fullscreen.svg");
}
@@ -7324,6 +7346,10 @@
--menuitem-image: url("chrome://browser/skin/reader-mode.svg");
}
+ #menu_showAllTabs {
+ --menuitem-image: url("../icons/tab.svg");
+ }
+
#documentDirection-swap {
--menuitem-image: url("../icons/text-direction-horizontal-ltr.svg");
}
@@ -7363,6 +7389,10 @@
--menuitem-image: url("../icons/restore-session.svg");
}
+ #hiddenTabsMenu {
+ --menuitem-image: url("../icons/eye-hide.svg");
+ }
+
#historyUndoMenu {
--menuitem-image: url("chrome://browser/skin/tab.svg");
}
@@ -7421,6 +7451,11 @@
}
/* menuWebDeveloperPopup sub menu */
+ #menu_devToolbox {
+ /* checkbox */
+ --menuitem-image: url("../icons/developer.svg");
+ }
+
#menu_taskManager {
--menuitem-image: url("../icons/performance.svg");
}
@@ -7441,6 +7476,16 @@
--menuitem-image: url("chrome://devtools/skin/images/command-console.svg");
}
+ #menu_responsiveUI {
+ /* checkbox */
+ --menuitem-image: url("../icons/command-responsivemode.svg");
+ }
+
+ #menu_eyedropper {
+ /* checkbox */
+ --menuitem-image: url("chrome://devtools/skin/images/command-eyedropper.svg");
+ }
+
#menu_pageSource {
--menuitem-image: url("../icons/document-search.svg");
}
@@ -7587,11 +7632,9 @@
/* This button needs to align with the tree above it. */
margin-inline-start: 4px;
}
-
#editBMPanel_newFolderButton:hover {
background-color: var(--button-hover-bgcolor);
}
-
#editBMPanel_newFolderButton:hover:active {
background-color: var(--button-active-bgcolor);
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/css/leptonContent.css b/arch-config/.mozilla/firefox/default-release/chrome/css/leptonContent.css
index 371e4458..b346bde5 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/css/leptonContent.css
+++ b/arch-config/.mozilla/firefox/default-release/chrome/css/leptonContent.css
@@ -4,18 +4,19 @@
/* Control Bar Size */
@supports -moz-bool-pref("userContent.player.size") {
#controlsContainer {
- --button-size: 32px !important;
- /* Original: 30px */
--controlBar-height: 40px;
/* Original: 40px, Replace to this value */
}
-
#controlsContainer .touch {
--button-size: 48px !important;
/* Original: 40px */
--controlBar-height: 52px;
/* Original: 52px */
}
+ #controlsContainer .controlBar {
+ height: var(--controlBar-height) !important;
+ /* Original: 40px */
+ }
.videocontrols[inDOMFullscreen] #controlsContainer {
--button-size: 64px !important;
@@ -27,19 +28,12 @@
--controlBar-height: 64px;
/* Original: 40px */
}
-
.videocontrols[inDOMFullscreen] #controlsContainer .touch {
--button-size: 72px !important;
/* Original: 40px */
--controlBar-height: 64px;
/* Original: 52px */
}
-
- #controlsContainer .controlBar {
- height: var(--controlBar-height) !important;
- /* Original: 40px */
- }
-
.videocontrols[inDOMFullscreen] #controlsContainer .controlBar {
padding-bottom: 8px !important;
}
@@ -58,12 +52,6 @@
box-shadow: 0 5px 10px -3px var(--box-shadow1), 0 3px 16px 2px var(--box-shadow2), 0 8px 12px 1px var(--box-shadow3);
/* Or: 0 2px 15px rgba(0,0,0,.1); */
}
-
- video {
- --duration-color: #eee;
- --media-background: linear-gradient(transparent, rgba(26, 26, 26, 0.85));
- }
-
@media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) {
audio {
--box-shadow1: rgba(249, 249, 250, 0.12);
@@ -71,6 +59,11 @@
--box-shadow3: rgba(82, 82, 94, 0.04);
}
}
+
+ video {
+ --duration-color: #eee;
+ --media-background: linear-gradient(transparent, rgba(26, 26, 26, 0.85));
+ }
@media (prefers-contrast) {
video {
--duration-color: #929292;
@@ -79,10 +72,10 @@
/* Like Original */
}
}
+
#controlsContainer .controlBar {
background: var(--media-background) !important;
}
-
#controlsContainer .duration {
color: var(--duration-color) !important;
/* Original: #929292 */
@@ -163,7 +156,6 @@
padding-inline: var(--controlBar-padding-inline) !important;
/* Original: 9px */
}
-
#controlsContainer .scrubberStack {
/* Vertical */
order: var(--scrubberStack-order);
@@ -174,7 +166,6 @@
width: var(--scrubberStack-twoline-width, var(--scrubberStack-width));
margin-inline: var(--scrubberStack-margin-inline) !important;
}
-
#controlsContainer .positionDurationBox {
flex-grow: var(--positionDurationBox-flex-grow);
margin-left: var(--positionDurationBox-margin-left);
@@ -194,7 +185,6 @@
#controlsContainer .fullscreenButton {
background-image: url("../icons/enter-fullscreen.svg") !important;
}
-
#controlsContainer .fullscreenButton[fullscreened] {
background-image: url("../icons/exit-fullscreen.svg") !important;
}
@@ -211,11 +201,9 @@
cursor: pointer;
opacity: 0.65 !important;
}
-
#controlsContainer .controlsSpacerStack:hover > .clickToPlay {
opacity: 0.85 !important;
}
-
#controlsContainer .controlsSpacerStack:hover > .clickToPlay:hover {
opacity: 1 !important;
fill: #48a0f7 !important;
@@ -230,13 +218,11 @@
transition: transform 350ms ease;
opacity: 1 !important;
}
-
#controlsContainer .controlBar[hidden] {
transform: translateY(100%);
transition: transform 350ms ease-in-out, opacity 1s ease 100ms !important;
opacity: 0 !important;
}
-
#controlsContainer .controlBar[hidden] .progressBar,
#controlsContainer .controlBar[hidden] .bufferBar {
display: unset !important;
@@ -291,7 +277,6 @@
.top-site-outer .tile {
overflow: hidden;
}
-
.top-site-outer .tile .icon-wrapper {
width: 100% !important;
/* Original: 48px */
@@ -313,7 +298,6 @@
button.close-button {
transition: background 1.5s var(--animation-easing-function);
}
-
.top-site-outer:hover,
#searchSubmit:hover,
button.icon:hover,
@@ -346,7 +330,6 @@
display: flex;
flex-wrap: wrap;
}
-
.body-wrapper.on > .discovery-stream.ds-layout {
flex-basis: 100%;
}
@@ -369,7 +352,6 @@
--newtab-search-dropdown-color: var(--newtab-search-background-color) !important;
--newtab-element-hover-color: color-mix(in srgb, currentColor 9%, transparent) !important;
}
-
@media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) {
#root {
/* Default Dark Mode */
@@ -377,6 +359,7 @@
/* Same as dark theme's --panel-background */
}
}
+
.activity-stream[lwt-sidebar]:not([style*="--newtab-background-color: rgba(43, 42, 51, 1);"]) #root {
/* Light weight theme */
--newtab-search-background-color: var(--lwt-sidebar-background-color);
@@ -433,18 +416,15 @@
.contentSearchSuggestionTable .contentSearchSettingsButton:hover {
color: var(--newtab-text-primary-color) !important;
}
-
.contentSearchSuggestionTable .contentSearchSuggestionRow.selected,
.contentSearchSuggestionTable .contentSearchSettingsButton:hover,
.contentSearchSuggestionTable .contentSearchOneOffItem.selected {
background: var(--newtab-element-hover-color) !important;
}
-
.contentSearchSuggestionTable .contentSearchSuggestionRow.selected:active,
.contentSearchSuggestionTable .contentSearchOneOffItem:active {
background: var(--newtab-element-active-color) !important;
}
-
.contentSearchSuggestionTable .contentSearchSuggestionRow.selected .historyIcon {
fill: var(--newtab-icon-secondary-color) !important;
}
@@ -560,6 +540,7 @@
/*= Fully Dark Mode - Dark Mode Colors =======================================*/
@supports -moz-bool-pref("userContent.page.proton_color") {
@-moz-document url-prefix("about:"),
+ url-prefix("chrome://browser/content/places/places.xhtml"),
url-prefix("https://addons.mozilla.org"),
url-prefix("https://support.mozilla.org"),
url-prefix("https://accounts.firefox.com"),
@@ -786,13 +767,16 @@
/* Basic */
.Page-content,
.SecondaryHero,
- body:not(.developer-hub):not(.statistics),
+ body,
main[aria-label="Content"] {
color: var(--in-content-page-color) !important;
background: var(--in-content-page-background) !important;
}
/* Text */
+ input,
+ textarea,
+ select,
.AutoSearchInput-query,
.AutoSearchInput-suggestions-list,
.Page-content h1,
@@ -801,6 +785,7 @@
.Home-SubjectShelf-link:link,
.Home-SubjectShelf-link:visited,
.DropdownMenuItem-link a,
+ .DropdownMenuItem-link button,
.Select,
.Badge,
.Notice-generic,
@@ -826,6 +811,7 @@
.SearchResult:hover .SearchResult-link,
.Home-SubjectShelf-link:is(:active, :focus, :hover),
.DropdownMenuItem-link a:is(:active, :focus, :hover),
+ .DropdownMenuItem-link button:is(:active, :focus, :hover),
.AddonMeta .MetadataCard-title a:is(:active, :hover),
.AddonMeta .MetadataCard-title a.AddonMeta-reviews-content-link:is(:active, :hover),
.AddonMeta .MetadataCard-content a:is(:active, :hover),
@@ -842,6 +828,7 @@
.AddonTitle a,
.TooltipMenu-opener,
.LanguageTools .Card-contents a,
+ .Button--primary,
.blog-entry-read-more-link,
.blogpost-nav-next.blogpost-nav-no-prev:hover p,
.blogpost-content-wrapper p a,
@@ -883,12 +870,16 @@
}
/* Background */
- .Button--action {
+ .Button--action,
+ .DevHub-Navigation ul li.DevHub-Navigation-Register .Button,
+ .DevHub-MyAddons-item-buttons-submit .Button {
color: var(--in-content-primary-button-text-color) !important;
background: var(--in-content-primary-button-background) !important;
}
+ select,
.Select,
+ .Button--primary,
.Button--neutral,
.Button--neutral:link,
.Notice-button,
@@ -896,6 +887,7 @@
background-color: var(--in-content-button-background) !important;
}
+ .Button--primary:hover,
.Button--neutral.Button--micro:not(.Button--disabled):hover,
.Button--neutral:not(.Button--disabled):hover,
.Notice-button:hover {
@@ -903,7 +895,9 @@
}
.Button--action.Button--micro:not(.Button--disabled):hover,
- .Button--action:not(.Button--disabled):hover {
+ .Button--action:not(.Button--disabled):hover,
+ .DevHub-Navigation ul li.DevHub-Navigation-Register .Button:hover,
+ .DevHub-MyAddons-item-buttons-submit .Button:hover {
background: var(--in-content-primary-button-background-hover) !important;
}
@@ -911,6 +905,8 @@
background: linear-gradient(rgba(255, 255, 255, 0), var(--in-content-table-background)) !important;
}
+ input,
+ textarea,
.AutoSearchInput-query,
.AutoSearchInput-suggestions-list,
.SecondaryHero-module,
@@ -981,15 +977,30 @@
box-shadow: 0 0 2px var(--in-content-border-color) !important;
}
+ input,
+ textarea,
+ select {
+ border-color: var(--in-content-box-border-color) !important;
+ }
+
+ .UserProfileEdit input:disabled,
+ .UserProfileEdit textarea:disabled {
+ background-color: var(--in-content-box-background-odd) !important;
+ }
+
.AutoSearchInput-query {
border: 1px solid var(--in-content-table-background) !important;
}
- .AutoSearchInput-query:is(:hover, :focus) {
+ .AutoSearchInput-query:is(:hover, :focus),
+ .UserProfileEditNotifications .UserProfileEditNotification-input:checked ~ .UserProfileEditNotification-checkbox {
border-color: var(--in-content-primary-button-background) !important;
}
- .AutoSearchInput-query:focus {
+ .UserProfileEdit input:focus,
+ .UserProfileEdit textarea:focus,
+ .AutoSearchInput-query:focus,
+ .UserProfileEditNotifications .UserProfileEditNotification-input:focus ~ .UserProfileEditNotification-checkbox {
box-shadow: inset 0 0 0 1px var(--in-content-primary-button-background),
0 0 0 1px var(--in-content-primary-button-background), 0 0 0 4px rgba(0, 211, 255, 0.3) !important;
}
@@ -1012,6 +1023,12 @@
}
/* /developers/ */
+ .DevHub-Navigation-Logo > .Logo::before {
+ -moz-context-properties: fill !important;
+ fill: var(--in-content-primary-button-background) !important;
+ background-image: url("../icons/addons-logo.svg") !important;
+ }
+
.DevHub-Navigation,
.DevHub-submit-addon,
.DevHub-get-involved,
@@ -1020,12 +1037,16 @@
color: var(--in-content-page-color) !important;
}
- .DevHub-Footer,
- .DevHub-callout-box {
+ .DevHub-Footer {
background: var(--in-content-box-background) !important;
color: var(--in-content-page-color) !important;
}
+ .DevHub-callout-box {
+ background: var(--in-content-box-background-odd) !important;
+ color: var(--in-content-page-color) !important;
+ }
+
.DevHub-Navigation.scheme-light ul li a,
.DevHub-Footer-sections-header,
.DevHub-Footer-section h4,
@@ -1034,12 +1055,291 @@
color: var(--in-content-page-color) !important;
}
+ .DevHub-content-copy p,
+ .DevHub-callout-box p {
+ color: var(--in-content-deemphasized-text) !important;
+ }
+
.DevHub-Banner a,
.DevHub-Footer a,
.DevHub-MyAddons-list a,
- .DevHub-MyAddons-item-buttons-all {
+ .DevHub-MyAddons-item-buttons-all,
+ .DevHub-content-copy a,
+ .DevHub-callout-box a {
color: var(--in-content-link-color) !important;
}
+
+ body:is(.developer-hub, .statistics) {
+ /* Elements */
+ /* .developer-hub */
+ /* Text */
+ /* .developer-hub */
+ /* Background */
+ /* Border */
+ /* Othres */
+ }
+ body:is(.developer-hub, .statistics) #main-wrapper,
+ body:is(.developer-hub, .statistics) .menu-nav > ul > li > ul::after,
+ body:is(.developer-hub, .statistics) .menu-nav > ul > li:hover::after,
+ body:is(.developer-hub, .statistics) .menu-nav > ul > li > ul,
+ body:is(.developer-hub, .statistics) .menu-nav > ul > li > ul a,
+ body:is(.developer-hub, .statistics) .menu-nav em,
+ body:is(.developer-hub, .statistics) .primary,
+ body:is(.developer-hub, .statistics) .secondary,
+ body:is(.developer-hub, .statistics) .dashboard .listing .item {
+ background: var(--in-content-page-background) !important;
+ color: var(--in-content-page-color) !important;
+ }
+ body:is(.developer-hub, .statistics) .menu-nav > ul > li > ul a:hover,
+ body:is(.developer-hub, .statistics) .install-note,
+ body:is(.developer-hub, .statistics) .modal,
+ body:is(.developer-hub, .statistics) .popup {
+ background: var(--in-content-box-background-odd) !important;
+ }
+ body:is(.developer-hub, .statistics) .menu-nav > ul > li > ul::after,
+ body:is(.developer-hub, .statistics) .menu-nav > ul > li > ul {
+ box-shadow: 0 0 3px var(--in-content-border-color) !important;
+ }
+ body:is(.developer-hub, .statistics) #footer {
+ background: linear-gradient(
+ to bottom,
+ var(--in-content-page-background) 0,
+ var(--in-content-page-background) 123px,
+ #0c99d5 123px,
+ #0c99d5 200px,
+ var(--in-content-page-background) 200px,
+ rgba(12, 153, 213, 0) 400px
+ ) !important;
+ }
+ body:is(.developer-hub, .statistics) #homepage h2,
+ body:is(.developer-hub, .statistics) header h2,
+ body:is(.developer-hub, .statistics) .primary h2,
+ body:is(.developer-hub, .statistics) h1,
+ body:is(.developer-hub, .statistics) hgroup h2.addon,
+ body:is(.developer-hub, .statistics) hgroup h2.collection,
+ body:is(.developer-hub, .statistics) h3,
+ body:is(.developer-hub, .statistics) .results h4,
+ body:is(.developer-hub, .statistics) .dashboard .listing .item,
+ body:is(.developer-hub, .statistics) .dashboard .listing .item:hover h5,
+ body:is(.developer-hub, .statistics) .secondary .addon-status,
+ body:is(.developer-hub, .statistics) .secondary .addon-status .addon-details li.addon-listed-status,
+ body:is(.developer-hub, .statistics) #refine-results h5,
+ body:is(.developer-hub, .statistics) .island.criteria li,
+ body:is(.developer-hub, .statistics) .two-up div {
+ color: var(--in-content-page-color) !important;
+ }
+ body:is(.developer-hub, .statistics) .item-actions h5,
+ body:is(.developer-hub, .statistics) .item-actions > ul,
+ body:is(.developer-hub, .statistics) .item-actions > ul > li,
+ body:is(.developer-hub, .statistics) .dashboard .listing .item .item-actions a,
+ body:is(.developer-hub, .statistics) .edit-media-details,
+ body:is(.developer-hub, .statistics) .devhub-form table th,
+ body:is(.developer-hub, .statistics) #recent-activity .listing .item .timestamp,
+ body:is(.developer-hub, .statistics) #upload-file .upload-status #uploadstatus,
+ body:is(.developer-hub, .statistics) #addon-validator-suite,
+ body:is(.developer-hub, .statistics) #addon-validator-suite .msg > *,
+ body:is(.developer-hub, .statistics) .island.criteria li a.inactive {
+ color: var(--in-content-deemphasized-text) !important;
+ }
+ body:is(.developer-hub, .statistics) section[role="main"] a,
+ body:is(.developer-hub, .statistics) header a,
+ body:is(.developer-hub, .statistics) .more-info,
+ body:is(.developer-hub, .statistics) .primary a,
+ body:is(.developer-hub, .statistics) .secondary a,
+ body:is(.developer-hub, .statistics) .submission-type-tabs a,
+ body:is(.developer-hub, .statistics) .popup a,
+ body:is(.developer-hub, .statistics) .dashboard .listing .item:hover a,
+ body:is(.developer-hub, .statistics) .dashboard .listing .item:hover .item-actions a,
+ body:is(.developer-hub, .statistics) #upload-status-results.status-pass strong,
+ body:is(.developer-hub, .statistics) #addon-validator-suite a,
+ body:is(.developer-hub, .statistics) #create-addon a,
+ body:is(.developer-hub, .statistics) .html-support {
+ color: var(--in-content-link-color) !important;
+ }
+ body:is(.developer-hub, .statistics) .dashboard .listing .item:hover a {
+ color: var(--in-content-link-color-hover) !important;
+ }
+ body:is(.developer-hub, .statistics) .dashboard .listing .item .item-info .downloads,
+ body:is(.developer-hub, .statistics) .dashboard .listing .item .item-info .price,
+ body:is(.developer-hub, .statistics) .dashboard .listing .item .item-info .users {
+ color: var(--green-60) !important;
+ }
+ body:is(.developer-hub, .statistics) .status-admin-disabled b,
+ body:is(.developer-hub, .statistics) .status-disabled b,
+ body:is(.developer-hub, .statistics) .status-incomplete b,
+ body:is(.developer-hub, .statistics) .status-purgatory b {
+ color: var(--red-60) !important;
+ }
+ body:is(.developer-hub, .statistics) .submission-type-tabs a.active,
+ body:is(.developer-hub, .statistics) .island.criteria li.selected a {
+ color: var(--orange-50) !important;
+ }
+ body:is(.developer-hub, .statistics) .secondary .addon-status,
+ body:is(.developer-hub, .statistics) .devhub-form .item,
+ body:is(.developer-hub, .statistics) #icons_default,
+ body:is(.developer-hub, .statistics) .listing .item,
+ body:is(.developer-hub, .statistics) .object-lead,
+ body:is(.developer-hub, .statistics) #addon-validator-suite .results .tier-results,
+ body:is(.developer-hub, .statistics) #addon-validator-suite .suite,
+ body:is(.developer-hub, .statistics) #addon-validator-suite .suite-container {
+ border-color: var(--in-content-border-color) !important;
+ background: var(--in-content-box-background) !important;
+ }
+ body:is(.developer-hub, .statistics) .highlight,
+ body:is(.developer-hub, .statistics) .listing-footer,
+ body:is(.developer-hub, .statistics) .tab-wrapper .fm-control {
+ color: var(--in-content-page-color) !important;
+ background: var(--in-content-box-info-background) !important;
+ }
+ body:is(.developer-hub, .statistics) .submission-type-tabs a,
+ body:is(.developer-hub, .statistics) #head-chart {
+ background: var(--in-content-page-background) !important;
+ }
+ body:is(.developer-hub, .statistics) #head-chart rect {
+ fill: var(--in-content-page-background) !important;
+ }
+ body:is(.developer-hub, .statistics) #head-chart text {
+ fill: var(--in-content-deemphasized-text) !important;
+ }
+ body:is(.developer-hub, .statistics) #head-chart .highcharts-legend .highcharts-legend-item:hover text {
+ fill: var(--in-content-page-color) !important;
+ paint-order: stroke !important;
+ stroke: var(--in-content-page-color) !important;
+ stroke-width: 0.4px !important;
+ stroke-linecap: butt !important;
+ stroke-linejoin: miter !important;
+ }
+ body:is(.developer-hub, .statistics)
+ #head-chart
+ .highcharts-legend
+ .highcharts-legend-item
+ path[stroke="#CCC"]
+ ~ text {
+ fill: #ccc !important;
+ }
+ body:is(.developer-hub, .statistics) #icons_default li a:hover,
+ body:is(.developer-hub, .statistics) #side-nav .active a,
+ body:is(.developer-hub, .statistics) span.tip,
+ body:is(.developer-hub, .statistics) .addon-submission-process .tip,
+ body:is(.developer-hub, .statistics) .devhub-form .tip,
+ body:is(.developer-hub, .statistics) a.remove,
+ body:is(.developer-hub, .statistics) span.remove,
+ body:is(.developer-hub, .statistics) ul.errorlist li span.tip {
+ background-color: var(--in-content-box-info-background) !important;
+ }
+ body:is(.developer-hub, .statistics) a.remove:hover,
+ body:is(.developer-hub, .statistics) span.tip:hover {
+ background-color: var(--in-content-primary-button-background-hover) !important;
+ }
+ body:is(.developer-hub, .statistics) .submission-type-tabs a,
+ body:is(.developer-hub, .statistics) .devhub-sidebar,
+ body:is(.developer-hub, .statistics) .devhub-sidebar div.item,
+ body:is(.developer-hub, .statistics) .devhub-form .listing-footer {
+ border-color: var(--in-content-border-color) !important;
+ }
+ body:is(.developer-hub, .statistics) #background-wrapper,
+ body:is(.developer-hub, .statistics) #main-wrapper {
+ border-color: var(--in-content-page-background) !important;
+ }
+ body:is(.developer-hub, .statistics) .item-actions a.more-actions:hover:after,
+ body:is(.developer-hub, .statistics) .item-actions button.link.more-actions:hover:after,
+ body:is(.developer-hub, .statistics) #change-locale::after {
+ border-top-color: var(--in-content-link-color) !important;
+ }
+ body:is(.developer-hub, .statistics) install-note::after,
+ body:is(.developer-hub, .statistics) .popup::after {
+ border-bottom-color: var(--in-content-box-background) !important;
+ }
+ body:is(.developer-hub, .statistics) .install-note::before,
+ body:is(.developer-hub, .statistics) .popup::before {
+ border-bottom-color: grey !important;
+ }
+ body:is(.developer-hub, .statistics) #refine-results,
+ body:is(.developer-hub, .statistics) .other-categories,
+ body:is(.developer-hub, .statistics) .versions .primary > .warning {
+ border-color: transparent !important;
+ }
+ body:is(.developer-hub, .statistics) .results {
+ border-color: var(--in-content-box-background-odd) !important;
+ background: transparent !important;
+ }
+ body:is(.developer-hub, .statistics) .results-inner {
+ border-color: var(--in-content-border-color) !important;
+ background: var(--in-content-border-color) !important;
+ }
+ body:is(.developer-hub, .statistics) #promos .view-button a,
+ body:is(.developer-hub, .statistics) #upload-file-finish.button,
+ body:is(.developer-hub, .statistics) #upload-file-widget .button.prominent,
+ body:is(.developer-hub, .statistics) .button,
+ body:is(.developer-hub, .statistics) .cta a.button:link,
+ body:is(.developer-hub, .statistics) .cta a.button:visited,
+ body:is(.developer-hub, .statistics) .linux .button.linux,
+ body:is(.developer-hub, .statistics) .mac .button.mac,
+ body:is(.developer-hub, .statistics) .other .button.bsd,
+ body:is(.developer-hub, .statistics) .other .button.solaris,
+ body:is(.developer-hub, .statistics) .sidebar a.button,
+ body:is(.developer-hub, .statistics) .sidebar button,
+ body:is(.developer-hub, .statistics) .theme .choices button,
+ body:is(.developer-hub, .statistics) .theme-queue a.button,
+ body:is(.developer-hub, .statistics) .theme-queue button,
+ body:is(.developer-hub, .statistics) .windows .button.windows,
+ body:is(.developer-hub, .statistics) a.button:link,
+ body:is(.developer-hub, .statistics) a.button:visited,
+ body:is(.developer-hub, .statistics) a.delete-button.delete-addon,
+ body:is(.developer-hub, .statistics) button,
+ body:is(.developer-hub, .statistics) button.button,
+ body:is(.developer-hub, .statistics) input:not(.upvotes):not(.downvotes)[type="submit"] {
+ color: var(--in-content-primary-button-text-color) !important;
+ background: var(--in-content-primary-button-background) !important;
+ }
+ body:is(.developer-hub, .statistics) #promos .view-button a:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) #upload-file-finish.button:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) #upload-file-widget .button.prominent:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .button:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .cta a.button:link:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .cta a.button:visited:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .linux .button.linux:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .mac .button.mac:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .other .button.bsd:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .other .button.solaris:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .sidebar a.button:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .sidebar button:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .theme .choices button:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .theme-queue a.button:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .theme-queue button:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) .windows .button.windows:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) a.button:link:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) a.button:visited:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) a.delete-button.delete-addon:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) button:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics) button.button:is(.selected, :focus, :hover),
+ body:is(.developer-hub, .statistics)
+ input:not(.upvotes):not(.downvotes)[type="submit"]:is(.selected, :focus, :hover) {
+ background: var(--in-content-primary-button-background-hover) !important;
+ }
+ body:is(.developer-hub, .statistics) .edit_with_prefix span,
+ body:is(.developer-hub, .statistics) .edit_with_suffix span {
+ border-color: var(--in-content-box-border-color) !important;
+ background-color: var(--in-content-box-background-odd) !important;
+ color: var(--in-content-deemphasized-text) !important;
+ padding-block: 3px !important;
+ cursor: not-allowed;
+ }
+ body:is(.developer-hub, .statistics) .devhub-form .item_wrapper input[type="email"] {
+ appearance: none !important;
+ padding: 2px 5px;
+ border: 1px solid;
+ }
+ body:is(.developer-hub, .statistics) #addon-validator-suite .suite-summary {
+ color: var(--in-content-deemphasized-text) !important;
+ background: var(--in-content-button-background) !important;
+ border-top-color: var(--in-content-border-color) !important;
+ }
+ body:is(.developer-hub, .statistics) #addon-validator-suite .context {
+ border-color: var(--in-content-box-border-color) !important;
+ background-color: var(--in-content-button-background) !important;
+ background: var(--in-content-table-background) !important;
+ }
}
/*= Support.org ============================================================*/
@-moz-document url-prefix("https://support.mozilla.org")
@@ -1676,17 +1976,13 @@
@supports -moz-bool-pref("userContent.page.field_border") {
@media (prefers-reduced-motion: no-preference) {
@-moz-document url-prefix("about:") {
+ html|input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):not(#newtab-search-text):hover,
+ html|textarea:hover,
xul|search-textbox:hover {
border-color: var(--in-content-focus-outline-color) !important;
transition: border-color 0.5s var(--animation-easing-function);
}
}
- @-moz-document url-prefix("about:config") {
- #about-config-search:hover {
- border-color: var(--in-content-focus-outline-color) !important;
- transition: border-color 0.5s var(--animation-easing-function);
- }
- }
}
}
/*= View Source ==============================================================*/
@@ -2016,315 +2312,6 @@
transform: scaleX(-1) !important;
}
}
- /*= Context Menu ===========================================================*/
- @supports -moz-bool-pref("userChrome.icon.context_menu") {
- menupopup menuitem:not([type="checkbox"], [type="radio"]),
- menupopup menu:not([type="checkbox"], [type="radio"]),
- #main-menubar > menu {
- -moz-appearance: none !important;
- /* Linux: menulist */
- }
-
- #placesContext menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- #placesContext menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu {
- /* Color */
- -moz-context-properties: fill, fill-opacity !important;
- fill: currentColor !important;
- /* Layout */
- background-size: 16px !important;
- background-repeat: no-repeat !important;
- background-image: var(--menuitem-image);
- }
-
- /* For native context menus on macOS */
- @supports -moz-bool-pref("widget.macos.native-context-menus") {
- :not(menu, #ContentSelectDropdown)
- > menupopup
- > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
- :not(menu, #ContentSelectDropdown)
- > menupopup
- > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist) {
- list-style-image: var(--menuitem-image) !important;
- }
- }
- /* Padding */
- :root {
- --context-menu-background-padding-default: 5px;
- --context-menu-background-padding: var(--context-menu-background-padding-default);
- }
-
- #placesContext menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- #placesContext menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu {
- background-position: left var(--context-menu-background-padding) center !important;
- padding-inline-start: var(--context-menu-background-padding) !important;
- }
-
- /* Padding - Windows */
- @media (-moz-os-version: windows-win7),
- (-moz-platform: windows-win7),
- (-moz-os-version: windows-win8),
- (-moz-platform: windows-win8),
- (-moz-os-version: windows-win10),
- (-moz-platform: windows-win10) {
- /* Checkbox */
- :root {
- --context-menu-text-padding: calc(
- var(--menu-padding) + var(--context-menu-background-padding-default) + 16px
- );
- }
-
- :not(menu, #ContentSelectDropdown, #context-navigation)
- > menupopup
- > menuitem[type="checkbox"][checked="false"]
- > .menu-iconic-left {
- padding-inline-start: var(--context-menu-text-padding);
- }
- }
- @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) {
- :root {
- --context-menu-background-padding-default: 2px;
- }
- }
- @media (-moz-os-version: windows-win8), (-moz-platform: windows-win8) {
- :root {
- --context-menu-background-padding-default: 3px;
- }
- }
- @media (-moz-os-version: windows-win7),
- (-moz-platform: windows-win7),
- (-moz-os-version: windows-win8),
- (-moz-platform: windows-win8) {
- #placesContext menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- #placesContext menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu {
- background-position: left var(--context-menu-background-padding) center !important;
- padding-inline-start: 0 !important;
- }
- }
- @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) {
- :root {
- --context-menu-background-padding: 1em;
- --context-menu-text-padding: 24px;
- /* 16px + 8px */
- --menu-background-padding-default: calc(
- var(--context-menu-background-padding) + var(--context-menu-text-padding)
- );
- }
-
- #placesContext menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- #placesContext menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu {
- padding-inline-start: var(--menu-background-padding-default) !important;
- margin-left: 0 !important;
- }
- }
- /* Padding - Linux */
- @media (-moz-gtk-csd-available) {
- :root {
- --context-menu-background-padding-default: 6px;
- }
- }
- /* Padding - Mac */
- @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
- :root {
- --context-menu-background-padding-default: 10px;
- --context-menu-mac-padding: 21px;
- }
-
- /* context menu width */
- #placesContext menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- #placesContext menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]) {
- padding-inline-end: var(--context-menu-background-padding) !important;
- }
-
- /* text position */
- #placesContext menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]) > .menu-text,
- #placesContext menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]) > .menu-text {
- padding-inline-start: var(--context-menu-mac-padding) !important;
- }
-
- /* Checkbox menuitem, None iconic menu */
- #placesContext menuitem[type="checkbox"],
- #placesContext menu:not(.menu-iconic) {
- padding-inline-start: calc(
- var(--context-menu-background-padding) + var(--context-menu-mac-padding)
- ) !important;
- }
- }
- /* Icon lists */
- /*= placeContext =============================================================*/
- #placesContext_open {
- --menuitem-image: url("../icons/link-square.svg");
- }
-
- #placesContext_openBookmarkContainer\:tabs,
- #placesContext_openBookmarkLinks\:tabs {
- --menuitem-image: url("../icons/movetowindow-16.svg");
- }
-
- #placesContext_open\:newtab,
- #placesContext_openContainer\:tabs,
- #placesContext_openLinks\:tabs {
- --menuitem-image: url("chrome://browser/skin/new-tab.svg");
- }
-
- #placesContext_open\:newwindow {
- --menuitem-image: url("chrome://browser/skin/window.svg");
- }
-
- #placesContext_open\:newprivatewindow {
- --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg");
- }
-
- #placesContext_show_bookmark\:info,
- #placesContext_show\:info,
- #placesContext_show_folder\:info {
- --menuitem-image: url("chrome://global/skin/icons/edit.svg");
- }
-
- #placesContext_deleteBookmark,
- #placesContext_deleteFolder,
- #placesContext_delete,
- #placesContext_delete_history {
- --menuitem-image: url("chrome://global/skin/icons/delete.svg");
- }
-
- #placesContext_deleteHost {
- --menuitem-image: url("../icons/eye-hide.svg");
- }
-
- #placesContext_sortBy\:name {
- --menuitem-image: url("../icons/text-sort-ascending.svg");
- }
-
- #placesContext_cut {
- --menuitem-image: url("chrome://browser/skin/edit-cut.svg");
- }
-
- #placesContext_copy {
- --menuitem-image: url("../icons/edit-copy.svg");
- }
-
- #placesContext_paste_group {
- --menuitem-image: url("chrome://browser/skin/edit-paste.svg");
- }
-
- #placesContext_new\:bookmark {
- --menuitem-image: url("chrome://browser/skin/bookmark.svg");
- }
-
- #placesContext_new\:folder {
- --menuitem-image: url("chrome://global/skin/icons/folder.svg");
- }
- @supports -moz-bool-pref("userChrome.icon.library") {
- #placesContext_new\:folder {
- --menuitem-image: url("../icons/folder.svg");
- }
- }
-
- #placesContext_new\:separator {
- --menuitem-image: url("../icons/vertical-line.svg");
- }
-
- #placesContext_paste {
- --menuitem-image: url("chrome://browser/skin/edit-paste.svg");
- }
-
- #placesContext_createBookmark {
- --menuitem-image: url("chrome://browser/skin/bookmark.svg");
- }
-
- #show-other-bookmarks_PersonalToolbar {
- /* checkbox */
- /* --menuitem-image: url("../icons/star-line-horizontal.svg"); */
- }
-
- #placesContext_showAllBookmarks {
- --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg");
- }
-
- .openintabs-menuitem {
- --menuitem-image: url("../icons/movetowindow-16.svg");
- }
-
- /*= organizeButtonPopup ======================================================*/
- #newbookmark {
- --menuitem-image: url("chrome://browser/skin/bookmark.svg");
- }
-
- #newfolder {
- --menuitem-image: url("chrome://global/skin/icons/folder.svg");
- }
- @supports -moz-bool-pref("userChrome.icon.library") {
- #newfolder {
- --menuitem-image: url("../icons/folder.svg");
- }
- }
-
- #newseparator {
- --menuitem-image: url("../icons/vertical-line.svg");
- }
-
- #orgUndo {
- --menuitem-image: url("../icons/undo.svg");
- }
-
- #orgCut {
- --menuitem-image: url("chrome://browser/skin/edit-cut.svg");
- }
-
- #orgCopy {
- --menuitem-image: url("../icons/edit-copy.svg");
- }
-
- #orgPaste {
- --menuitem-image: url("chrome://browser/skin/edit-paste.svg");
- }
-
- #orgDelete {
- --menuitem-image: url("chrome://global/skin/icons/delete.svg");
- }
-
- #orgSelectAll {
- --menuitem-image: url("../icons/select-all-on.svg");
- }
-
- #orgClose {
- --menuitem-image: url("chrome://global/skin/icons/close.svg");
- }
-
- /*= viewMenuPopup ============================================================*/
- #viewColumns {
- --menuitem-image: url("chrome://global/skin/icons/columnpicker.svg");
- }
-
- #viewSort {
- --menuitem-image: url("../icons/text-sort-ascending.svg");
- }
-
- /*= maintenanceButtonPopup ===================================================*/
- #backupBookmarks {
- --menuitem-image: url("chrome://devtools/skin/images/datastore.svg");
- }
-
- #fileImport {
- --menuitem-image: url("chrome://browser/skin/save.svg");
- }
-
- #fileExport {
- --menuitem-image: url("chrome://browser/skin/open.svg");
- }
-
- #browserImport {
- --menuitem-image: url("chrome://browser/skin/import.svg");
- }
- }
@media (-moz-gtk-csd-available) {
/*= Layout Fixes =========================================================*/
menupopup menu {
@@ -2360,7 +2347,6 @@
--organizer-toolbar-field-focus-box-shadow: unset;
--organizer-pane-field-border-color: ThreeDShadow;
}
-
@media not all and (prefers-contrast) {
:root {
--organizer-color: var(--in-content-page-color);
@@ -2389,7 +2375,6 @@
--organizer-toolbar-field-focus-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.23);
--organizer-pane-field-border-color: color-mix(in srgb, currentColor 41%, transparent);
}
-
@media (-moz-toolbar-prefers-color-scheme: dark), (prefers-color-scheme: dark) {
:root {
--organizer-color: rgb(251, 251, 254);
@@ -2405,6 +2390,7 @@
}
}
}
+
/*- Toolbar & Menus ------------------------------------------------------*/
#placesToolbar {
appearance: none !important;
@@ -2414,22 +2400,18 @@
padding: 4px !important;
padding-inline-end: 6px !important;
}
-
#placesToolbar > toolbarbutton {
appearance: none !important;
padding: 5px !important;
border-radius: 4px !important;
}
-
#placesToolbar > toolbarbutton[disabled] {
opacity: 0.6 !important;
}
-
#placesToolbar > toolbarbutton:not([disabled]):hover {
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-hover-color) !important;
}
-
#placesToolbar > toolbarbutton:not([disabled]):hover:active {
background-color: var(--organizer-selected-background) !important;
}
@@ -2444,7 +2426,6 @@
#placesMenu {
margin-inline-start: 6px !important;
}
-
#placesMenu > menu {
appearance: none !important;
color: var(--organizer-color) !important;
@@ -2453,19 +2434,16 @@
padding-inline-start: 5px !important;
margin-inline-end: 2px !important;
}
-
#placesMenu > menu[_moz-menuactive="true"],
#placesMenu > menu:hover {
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-hover-color) !important;
}
-
#placesMenu > menu:hover:active,
#placesMenu > menu[open] {
background-color: var(--organizer-selected-background) !important;
color: var(--organizer-selected-color) !important;
}
-
#placesMenu > menu > .menubar-text {
margin-block: 0 !important;
/* override menu.css */
@@ -2556,7 +2534,6 @@
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-color) !important;
}
-
treecol:not([hideheader="true"], [sortable="false"]):hover:active,
treecolpicker:hover:active {
background-color: var(--organizer-selected-background) !important;
@@ -2587,38 +2564,31 @@
treechildren::-moz-tree-row {
background-color: transparent !important;
}
-
treechildren::-moz-tree-row(hover) {
background-color: var(--organizer-hover-background) !important;
}
-
treechildren::-moz-tree-row(selected) {
background-color: var(--organizer-selected-background) !important;
color: var(--organizer-selected-color) !important;
border: 1px solid transparent !important;
}
-
treechildren::-moz-tree-image(hover),
treechildren::-moz-tree-twisty(hover),
treechildren::-moz-tree-cell-text(hover) {
color: var(--organizer-hover-color) !important;
}
-
treechildren::-moz-tree-image(selected),
treechildren::-moz-tree-twisty(selected),
treechildren::-moz-tree-cell-text(selected) {
color: var(--organizer-selected-color) !important;
}
-
treechildren::-moz-tree-separator {
height: 1px !important;
border-color: var(--organizer-separator-color) !important;
}
-
treechildren::-moz-tree-separator(hover) {
border-color: var(--organizer-hover-color) !important;
}
-
treechildren::-moz-tree-separator(selected) {
border-color: var(--organizer-selected-color) !important;
}
@@ -2642,36 +2612,34 @@
border-radius: 4px !important;
color: var(--organizer-color) !important;
background-color: var(--organizer-content-background) !important;
- list-style-image: url("chrome://global/skin/icons/arrow-down-12.svg");
-moz-context-properties: fill !important;
fill: currentColor !important;
}
-
#editBookmarkPanelRows .expander-up:hover,
#editBookmarkPanelRows .expander-down:hover {
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-hover-color) !important;
}
-
#editBookmarkPanelRows .expander-up:hover:active,
#editBookmarkPanelRows .expander-down:hover:active {
background-color: var(--organizer-selected-background) !important;
color: var(--organizer-selected-color) !important;
}
-
#editBookmarkPanelRows .expander-up:focus-visible,
#editBookmarkPanelRows .expander-down:focus-visible {
outline: 2px solid var(--organizer-outline-color) !important;
outline-offset: -1px !important;
}
+ #editBookmarkPanelRows .expander-up > .button-box,
+ #editBookmarkPanelRows .expander-down > .button-box {
+ padding: 0 !important;
+ }
#editBookmarkPanelRows .expander-up {
list-style-image: url("chrome://global/skin/icons/arrow-up-12.svg");
}
-
- #editBookmarkPanelRows .expander-up > .button-box,
- #editBookmarkPanelRows .expander-down > .button-box {
- padding: 0 !important;
+ #editBookmarkPanelRows .expander-down {
+ list-style-image: url("chrome://global/skin/icons/arrow-down-12.svg");
}
#places input {
@@ -2682,12 +2650,10 @@
min-height: 20px !important;
padding-inline: 4px !important;
}
-
#places input:focus {
outline: 2px solid var(--organizer-outline-color) !important;
outline-offset: -1px !important;
}
-
#places input:not(:read-write):focus {
outline: none !important;
}
@@ -2704,16 +2670,13 @@
border: 1px solid var(--organizer-border-color) !important;
border-radius: 4px !important;
}
-
#editBMPanel_tagsSelectorRow > richlistbox > richlistitem {
border: 1px solid transparent !important;
}
-
#editBMPanel_tagsSelectorRow > richlistbox > richlistitem:hover {
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-hover-color) !important;
}
-
#editBMPanel_tagsSelectorRow > richlistbox > richlistitem[selected] {
background-color: var(--organizer-selected-background) !important;
color: var(--organizer-selected-color) !important;
@@ -2724,32 +2687,21 @@
/* margin-inline-start: 0 !important; */
appearance: none !important;
}
-
menuitem[type="radio"] > .menu-iconic-left > .menu-iconic-icon {
appearance: none !important;
width: 16px !important;
height: 16px !important;
- padding: 0 !important;
border: 1px solid var(--in-content-box-border-color) !important;
border-radius: 100% !important;
+ padding: 0 !important;
+ margin-inline: 0 6px !important;
margin-block: 2px !important;
/* extend the vertical clicktarget */
- margin-inline: 0 6px !important;
background-color: var(--in-content-button-background) !important;
background-position: center !important;
flex-shrink: 0 !important;
/* avoid shrinking inside flex container */
}
-
- menuitem[type="radio"]:not([disabled="true"]):hover > .menu-iconic-left > .menu-iconic-icon {
- background-color: var(--in-content-button-background-hover) !important;
- color: var(--in-content-button-text-color-hover) !important;
- }
-
- menuitem[type="radio"]:not([disabled="true"]):hover:active > .menu-iconic-left > .menu-iconic-icon {
- background-color: var(--in-content-button-background-active) !important;
- }
-
menuitem[type="radio"] > .menu-iconic-left[checked="true"] > .menu-iconic-icon {
-moz-context-properties: fill !important;
fill: currentColor !important;
@@ -2760,18 +2712,22 @@
/* Style the button also when printing with "Print Backgrounds" unchecked */
color-adjust: exact !important;
}
-
+ menuitem[type="radio"]:not([disabled="true"]):hover > .menu-iconic-left > .menu-iconic-icon {
+ background-color: var(--in-content-button-background-hover) !important;
+ color: var(--in-content-button-text-color-hover) !important;
+ }
+ menuitem[type="radio"]:not([disabled="true"]):hover:active > .menu-iconic-left > .menu-iconic-icon {
+ background-color: var(--in-content-button-background-active) !important;
+ }
menuitem[type="radio"]:not([disabled="true"])[checked="true"]:hover > .menu-iconic-left > .menu-iconic-icon {
background-color: var(--in-content-primary-button-background-hover) !important;
color: var(--in-content-primary-button-text-color-hover) !important;
}
-
menuitem[type="radio"]:not([disabled="true"])[checked="true"]:hover:active
> .menu-iconic-left
> .menu-iconic-icon {
background-color: var(--in-content-primary-button-background-active) !important;
}
-
menuitem[type="radio"] > .menu-iconic-text {
margin-inline: 0 8px !important;
padding-inline-start: 0 !important;
@@ -2781,10 +2737,6 @@
menuitem[type="radio"][disabled="true"],
menuitem[type="checkbox"][disabled="true"] {
color: inherit !important;
- }
-
- menuitem[type="radio"][disabled="true"],
- menuitem[type="checkbox"][disabled="true"] {
opacity: 0.5 !important;
}
@@ -2795,67 +2747,49 @@
-moz-box-align: center !important;
margin: 0px 2px !important;
}
-
- menuitem[type="checkbox"] > .menu-iconic-left > .menu-iconic-icon {
- margin-inline-end: 2px !important;
- }
-
- menuitem[type="checkbox"] > .menu-iconic-text {
- margin: 1px 0 !important;
- }
-
- menuitem[type="checkbox"][disabled="true"] {
- opacity: 0.4 !important;
- }
-
menuitem[type="checkbox"] > .menu-iconic-left > .menu-iconic-icon {
appearance: none !important;
- color: var(--checkbox-border-color, ThreeDDarkShadow) !important;
- background-color: var(--checkbox-unchecked-bgcolor, Field) !important;
+ width: 16px !important;
+ height: 16px !important;
border: 1px solid currentColor !important;
border-radius: 2px !important;
+ color: var(--checkbox-border-color, ThreeDDarkShadow) !important;
+ background-color: var(--checkbox-unchecked-bgcolor, Field) !important;
margin-inline-end: 6px !important;
+ /* or 2px */
+ margin-block: 2px !important;
+ /* From common.css */
}
-
- menuitem[type="checkbox"] > .menu-iconic-left > .menu-iconic-icon {
- height: 16px !important;
- width: 16px !important;
+ menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] > .menu-iconic-icon {
+ -moz-context-properties: fill !important;
+ fill: currentColor !important;
+ color: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
+ border-color: var(--checkbox-checked-border-color, transparent) !important;
+ background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important;
+ background-image: url("chrome://global/skin/icons/check.svg") !important;
+ background-position: center !important;
+ background-repeat: no-repeat !important;
+ /* Style the button also when printing with "Print Backgrounds" unchecked */
+ color-adjust: exact !important;
}
-
menuitem[type="checkbox"]:not([disabled="true"]):hover > .menu-iconic-left > .menu-iconic-icon {
background-color: var(
--checkbox-unchecked-hover-bgcolor,
color-mix(in srgb, -moz-accent-color 4%, Field)
) !important;
}
-
menuitem[type="checkbox"]:not([disabled="true"]):hover:active > .menu-iconic-left > .menu-iconic-icon {
background-color: var(
--checkbox-unchecked-active-bgcolor,
color-mix(in srgb, -moz-accent-color 8%, Field)
) !important;
}
-
- menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] > .menu-iconic-icon {
- border-color: var(--checkbox-checked-border-color, transparent) !important;
- background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important;
- background-image: url("chrome://global/skin/icons/check.svg") !important;
- background-position: center !important;
- background-repeat: no-repeat !important;
- -moz-context-properties: fill !important;
- fill: currentColor !important;
- color: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
- /* Style the button also when printing with "Print Backgrounds" unchecked */
- color-adjust: exact !important;
- }
-
menuitem[type="checkbox"]:not([disabled="true"]):hover > .menu-iconic-left[checked="true"] > .menu-iconic-icon {
background-color: var(
--checkbox-checked-hover-bgcolor,
color-mix(in srgb, currentColor 12.5%, -moz-accent-color)
) !important;
}
-
menuitem[type="checkbox"]:not([disabled="true"]):hover:active
> .menu-iconic-left[checked="true"]
> .menu-iconic-icon {
@@ -2864,23 +2798,19 @@
color-mix(in srgb, currentColor 25%, -moz-accent-color)
) !important;
}
-
menuitem[type="checkbox"]:focus > .menu-iconic-left > .menu-iconic-icon {
outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important;
outline-offset: var(--focus-outline-offset, 2px) !important;
}
-
@media (prefers-contrast) {
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: var(--checkbox-checked-border-color, color-mix(in srgb, -moz-accent-color 4%, Field)) !important;
}
-
menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] {
color: var(--checkbox-checked-border-color, currentColor) !important;
fill: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
}
-
menuitem[type="checkbox"]:not([disabled="true"]):hover:active
> .menu-iconic-left[checked="true"]
> .menu-iconic-icon,
@@ -2891,9 +2821,11 @@
fill: var(--checkbox-checked-border-color-hover, -moz-accent-color-foreground) !important;
}
}
- /* From common.css */
- menuitem[type="checkbox"] > .menu-iconic-left > .menu-iconic-icon {
- margin-block: 2px !important;
+ menuitem[type="checkbox"] > .menu-iconic-text {
+ margin: 1px 0 !important;
+ }
+ menuitem[type="checkbox"][disabled="true"] {
+ opacity: 0.4 !important;
}
/*- Menu Separtor --------------------------------------------------------*/
@@ -2903,10 +2835,424 @@
min-height: 0;
border-top: 1px solid var(--in-content-box-border-color, ThreeDDarkShadow);
border-bottom: none;
- margin: var(--panel-separator-margin, 6px);
padding: 0;
+ margin: var(--panel-separator-margin, 6px);
}
}
}
}
}
+/** Menu - Icons Layout *******************************************************/
+@supports -moz-bool-pref("userChrome.icon.menu") {
+ @-moz-document url("chrome://browser/content/places/places.xhtml"),
+ url("about:downloads") {
+ menupopup menuitem:not([type="checkbox"][checked="true"], [type="radio"]),
+ menupopup menu:not([type="checkbox"][checked="true"], [type="radio"]) {
+ -moz-appearance: none !important;
+ /* Linux: menulist */
+ }
+
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup)
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) {
+ /* Color */
+ -moz-context-properties: fill, fill-opacity !important;
+ fill: currentColor !important;
+ /* Layout */
+ background-size: 16px !important;
+ background-repeat: no-repeat !important;
+ background-image: var(--menuitem-image);
+ }
+
+ /* For native context menus */
+ @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") {
+ :not(menu, #ContentSelectDropdown)
+ > menupopup
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ :not(menu, #ContentSelectDropdown) > menupopup > menu:not(.menu-iconic, .in-menulist, [checked="true"]) {
+ list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important;
+ }
+ }
+
+ /* Padding */
+ :root {
+ --context-menu-background-padding-default: 5px;
+ --context-menu-background-padding: var(--context-menu-background-padding-default);
+ }
+
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup)
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) {
+ background-position: left var(--context-menu-background-padding) center !important;
+ padding-inline-start: var(--context-menu-background-padding) !important;
+ }
+
+ /* Padding - Windows */
+ @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) {
+ :root {
+ --context-menu-background-padding-default: 2px;
+ }
+ }
+ @media (-moz-os-version: windows-win8), (-moz-platform: windows-win8) {
+ :root {
+ --context-menu-background-padding-default: 3px;
+ }
+ }
+ @media (-moz-os-version: windows-win7),
+ (-moz-platform: windows-win7),
+ (-moz-os-version: windows-win8),
+ (-moz-platform: windows-win8) {
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup)
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) {
+ background-position: left var(--context-menu-background-padding) center !important;
+ padding-inline-start: 0 !important;
+ }
+ }
+ @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) {
+ :root {
+ --context-menu-background-padding: 1em;
+ --context-menu-text-padding: 24px;
+ /* 16px + 8px */
+ --menu-background-padding-default: calc(
+ var(--context-menu-background-padding) + var(--context-menu-text-padding)
+ );
+ }
+
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menu:not(.menu-iconic, .in-menulist, [checked="true"]),
+ menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup)
+ > menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu:not(.menu-iconic, .in-menulist, [checked="true"]) {
+ padding-inline-start: var(--menu-background-padding-default) !important;
+ margin-left: 0 !important;
+ }
+ }
+ /* Padding - Linux */
+ @media (-moz-gtk-csd-available) {
+ :root {
+ --context-menu-background-padding-default: 6px;
+ }
+
+ /* Contextmenu Checkbox Unset */
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menuitem[type="checkbox"] {
+ margin-inline: 0 !important;
+ }
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menuitem[type="checkbox"]
+ > .menu-iconic-left
+ > .menu-iconic-icon {
+ margin-inline-end: 0 !important;
+ }
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menuitem[type="checkbox"]:not([checked="true"])
+ > .menu-iconic-left
+ > .menu-iconic-icon {
+ border: none !important;
+ background-color: unset !important;
+ }
+ }
+ /* Padding - Mac */
+ @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+ :root {
+ --context-menu-background-padding-default: 10px;
+ --context-menu-mac-padding: 21px;
+ }
+
+ /* context menu width */
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"]),
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menu:not(.menu-iconic, .in-menulist, [checked="true"]) {
+ padding-inline-end: var(--context-menu-background-padding) !important;
+ }
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menuitem:not(.menuitem-iconic, .bookmark-item, .in-menulist, [checked="true"])
+ > .menu-text,
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)
+ menu:not(.menu-iconic, .in-menulist, [checked="true"])
+ > .menu-text {
+ /* text position */
+ padding-inline-start: var(--context-menu-mac-padding) !important;
+ }
+
+ /* Checkbox menuitem, None iconic menu */
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menuitem[checked="true"],
+ menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu) menu:not(.menu-iconic) {
+ padding-inline-start: calc(var(--context-menu-background-padding) + var(--context-menu-mac-padding)) !important;
+ }
+ }
+ /*= Context Menu ===========================================================*/
+ @supports -moz-bool-pref("userChrome.icon.context_menu") {
+ /* Icon lists */
+ /*= downloadsContextMenu =====================================================*/
+ .downloadPauseMenuItem {
+ --menuitem-image: url("chrome://global/skin/media/pause-fill.svg");
+ }
+
+ .downloadResumeMenuItem {
+ --menuitem-image: url("chrome://global/skin/media/play-fill.svg");
+ }
+
+ .downloadUnblockMenuItem {
+ --menuitem-image: url("../icons/checkmark-circle.svg");
+ }
+
+ .downloadUseSystemDefaultMenuItem {
+ --menuitem-image: url("chrome://browser/skin/open.svg");
+ }
+
+ .downloadAlwaysUseSystemDefaultMenuItem {
+ /* checkbox */
+ --menuitem-image: url("../icons/folder-globe.svg");
+ }
+
+ .downloadAlwaysOpenSimilarFilesMenuItem {
+ /* checkbox */
+ --menuitem-image: url("../icons/fluid.svg");
+ }
+
+ .downloadShowMenuItem {
+ --menuitem-image: url("chrome://global/skin/icons/folder.svg");
+ }
+ @supports -moz-bool-pref("userChrome.icon.library") {
+ .downloadShowMenuItem {
+ --menuitem-image: url("../icons/folder.svg");
+ }
+ }
+
+ #downloadsContextMenu > menuitem.downloadOpenReferrerMenuItem,
+ #downloadsContextMenu > menuitem[command="downloadsCmd_openReferrer"] {
+ --menuitem-image: url("../icons/link-square.svg");
+ }
+ #downloadsContextMenu > menuitem.downloadCopyLocationMenuItem,
+ #downloadsContextMenu > menuitem[command="downloadsCmd_copyLocation"] {
+ --menuitem-image: url("../icons/link.svg");
+ }
+
+ .downloadDeleteFileMenuItem {
+ --menuitem-image: url("chrome://global/skin/icons/delete.svg");
+ }
+
+ .downloadRemoveFromHistoryMenuItem {
+ --menuitem-image: url("../icons/eraser.svg");
+ }
+
+ #downloadsContextMenu > menuitem[command="downloadsCmd_clearList"],
+ #downloadsContextMenu > menuitem[command="downloadsCmd_clearDownloads"] {
+ --menuitem-image: url("../icons/broom.svg");
+ }
+
+ /*= placeContext =============================================================*/
+ #placesContext_open {
+ --menuitem-image: url("../icons/link-square.svg");
+ }
+
+ #placesContext_openBookmarkContainer\:tabs,
+ #placesContext_openBookmarkLinks\:tabs {
+ --menuitem-image: url("../icons/movetowindow-16.svg");
+ }
+
+ #placesContext_open\:newtab,
+ #placesContext_openContainer\:tabs,
+ #placesContext_openLinks\:tabs {
+ --menuitem-image: url("chrome://browser/skin/new-tab.svg");
+ }
+
+ #placesContext_open\:newcontainertab {
+ --menuitem-image: url("../icons/container-openin-16.svg");
+ }
+
+ #placesContext_open\:newwindow {
+ --menuitem-image: url("chrome://browser/skin/window.svg");
+ }
+
+ #placesContext_open\:newprivatewindow {
+ --menuitem-image: url("chrome://browser/skin/privateBrowsing.svg");
+ }
+
+ #placesContext_show_bookmark\:info,
+ #placesContext_show\:info,
+ #placesContext_show_folder\:info {
+ --menuitem-image: url("chrome://global/skin/icons/edit.svg");
+ }
+
+ #placesContext_deleteBookmark,
+ #placesContext_deleteFolder,
+ #placesContext_delete,
+ #placesContext_delete_history {
+ --menuitem-image: url("chrome://global/skin/icons/delete.svg");
+ }
+
+ #placesContext_deleteHost {
+ --menuitem-image: url("../icons/eye-hide.svg");
+ }
+
+ #placesContext_sortBy\:name {
+ --menuitem-image: url("../icons/text-sort-ascending.svg");
+ }
+
+ #placesContext_cut {
+ --menuitem-image: url("chrome://browser/skin/edit-cut.svg");
+ }
+
+ #placesContext_copy {
+ --menuitem-image: url("../icons/edit-copy.svg");
+ }
+
+ #placesContext_paste_group {
+ --menuitem-image: url("chrome://browser/skin/edit-paste.svg");
+ }
+
+ #placesContext_new\:bookmark {
+ --menuitem-image: url("chrome://browser/skin/bookmark.svg");
+ }
+
+ #placesContext_showInFolder,
+ #placesContext_new\:folder {
+ --menuitem-image: url("chrome://global/skin/icons/folder.svg");
+ }
+ @supports -moz-bool-pref("userChrome.icon.library") {
+ #placesContext_showInFolder,
+ #placesContext_new\:folder {
+ --menuitem-image: url("../icons/folder.svg");
+ }
+ }
+
+ #placesContext_new\:separator {
+ --menuitem-image: url("../icons/vertical-line.svg");
+ }
+
+ #placesContext_paste {
+ --menuitem-image: url("chrome://browser/skin/edit-paste.svg");
+ }
+
+ #placesContext_createBookmark {
+ --menuitem-image: url("chrome://browser/skin/bookmark.svg");
+ }
+
+ #show-other-bookmarks_PersonalToolbar {
+ /* checkbox */
+ --menuitem-image: url("../icons/star-line-horizontal.svg");
+ }
+
+ #placesContext_showAllBookmarks {
+ --menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg");
+ }
+
+ .openintabs-menuitem {
+ --menuitem-image: url("../icons/movetowindow-16.svg");
+ }
+ }
+ @supports -moz-bool-pref("userChrome.icon.global_menu") {
+ /*= organizeButtonPopup ======================================================*/
+ #newbookmark {
+ --menuitem-image: url("chrome://browser/skin/bookmark.svg");
+ }
+
+ #newfolder {
+ --menuitem-image: url("chrome://global/skin/icons/folder.svg");
+ }
+ @supports -moz-bool-pref("userChrome.icon.library") {
+ #newfolder {
+ --menuitem-image: url("../icons/folder.svg");
+ }
+ }
+
+ #newseparator {
+ --menuitem-image: url("../icons/vertical-line.svg");
+ }
+
+ #orgUndo {
+ --menuitem-image: url("../icons/undo.svg");
+ }
+
+ #orgCut {
+ --menuitem-image: url("chrome://browser/skin/edit-cut.svg");
+ }
+
+ #orgCopy {
+ --menuitem-image: url("../icons/edit-copy.svg");
+ }
+
+ #orgPaste {
+ --menuitem-image: url("chrome://browser/skin/edit-paste.svg");
+ }
+
+ #orgDelete {
+ --menuitem-image: url("chrome://global/skin/icons/delete.svg");
+ }
+
+ #orgSelectAll {
+ --menuitem-image: url("../icons/select-all-on.svg");
+ }
+
+ #orgClose {
+ --menuitem-image: url("chrome://global/skin/icons/close.svg");
+ }
+
+ /*= viewMenuPopup ============================================================*/
+ #viewColumns {
+ --menuitem-image: url("chrome://global/skin/icons/columnpicker.svg");
+ }
+
+ #viewSort {
+ --menuitem-image: url("../icons/text-sort-ascending.svg");
+ }
+
+ /*= maintenanceButtonPopup ===================================================*/
+ #backupBookmarks {
+ --menuitem-image: url("chrome://devtools/skin/images/datastore.svg");
+ }
+
+ #fileImport {
+ --menuitem-image: url("chrome://browser/skin/save.svg");
+ }
+
+ #fileExport {
+ --menuitem-image: url("chrome://browser/skin/open.svg");
+ }
+
+ #browserImport {
+ --menuitem-image: url("chrome://browser/skin/import.svg");
+ }
+ }
+ }
+}
+/** Download Panel ************************************************************/
+@-moz-document url-prefix("about:downloads") {
+ @media (prefers-reduced-motion: no-preference) {
+ @supports -moz-bool-pref("userChrome.decoration.download_panel") {
+ /* Accent Color for downloaded item */
+ #downloadsListBox .download-state[exists] .downloadDetails {
+ color: var(--button-primary-bgcolor);
+ }
+ #downloadsListBox .download-state[exists] .downloadDetails.downloadDetailsHover {
+ color: var(--button-primary-hover-bgcolor);
+ }
+
+ /* File moved or missing */
+ #downloadsListBox .download-state:not([exists], [state="0"]) .downloadTarget {
+ text-decoration: line-through;
+ text-decoration-color: color-mix(in srgb, currentColor 65%, transparent);
+ }
+ #downloadsListBox .download-state:not([exists], [state="0"]) .downloadTypeIcon {
+ filter: grayscale(100%) !important;
+ }
+ }
+ }
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/icons/addons-logo.svg b/arch-config/.mozilla/firefox/default-release/chrome/icons/addons-logo.svg
new file mode 100644
index 00000000..4c643af6
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/icons/addons-logo.svg
@@ -0,0 +1 @@
+
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/icons/drawer-arrow-download.svg b/arch-config/.mozilla/firefox/default-release/chrome/icons/drawer-arrow-download.svg
new file mode 100644
index 00000000..50060f13
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/icons/drawer-arrow-download.svg
@@ -0,0 +1,3 @@
+
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/icons/eye-tracking-off.svg b/arch-config/.mozilla/firefox/default-release/chrome/icons/eye-tracking-off.svg
new file mode 100644
index 00000000..9ce8bbf9
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/icons/eye-tracking-off.svg
@@ -0,0 +1,3 @@
+
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/icons/fluid.svg b/arch-config/.mozilla/firefox/default-release/chrome/icons/fluid.svg
new file mode 100644
index 00000000..2cffb706
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/icons/fluid.svg
@@ -0,0 +1,3 @@
+
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/icons/folder-globe.svg b/arch-config/.mozilla/firefox/default-release/chrome/icons/folder-globe.svg
new file mode 100644
index 00000000..65eb7e09
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/icons/folder-globe.svg
@@ -0,0 +1,3 @@
+
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/icons/plug-disconnected.svg b/arch-config/.mozilla/firefox/default-release/chrome/icons/plug-disconnected.svg
new file mode 100644
index 00000000..4d978ab7
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/icons/plug-disconnected.svg
@@ -0,0 +1,3 @@
+
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/icons/redo.svg b/arch-config/.mozilla/firefox/default-release/chrome/icons/redo.svg
new file mode 100644
index 00000000..63a43453
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/icons/redo.svg
@@ -0,0 +1,4 @@
+
+
\ No newline at end of file
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/compatibility/_os.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/compatibility/_os.scss
index cfe2c385..26d8e87a 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/compatibility/_os.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/compatibility/_os.scss
@@ -24,10 +24,14 @@
}
}
+//-- Mixin ---------------------------------------------------------------------
@mixin _os_winTabBarTextColor {
/* background textcolor */
color: var(--lwt-text-color) !important;
}
+
+//------------------------------------------------------------------------------
+
@include OS($win7) {
#TabsToolbar {
&:-moz-lwtheme {
@@ -81,18 +85,22 @@
}
}
+//-- Mixin ---------------------------------------------------------------------
@mixin _os_menuEmulate($bgRate, $bdRate) {
menu[_moz-menuactive="true"],
menuitem[_moz-menuactive="true"] {
background-color: color-mix(in srgb, -moz-menuhover $bgRate, transparent) !important;
border-color: color-mix(in srgb, -moz-menuhover $bdRate, transparent) !important;
- }
- menu[_moz-menuactive="true"][disabled="disabled"],
- menuitem[_moz-menuactive="true"][disabled="true"] {
- background-color: color-mix(in srgb, currentColor $bgRate, transparent) !important;
- border-color: color-mix(in srgb, currentColor $bdRate, transparent) !important;
+
+ &[disabled="true"] {
+ background-color: color-mix(in srgb, currentColor $bgRate, transparent) !important;
+ border-color: color-mix(in srgb, currentColor $bdRate, transparent) !important;
+ }
}
}
+
+//------------------------------------------------------------------------------
+
@include OS($win7) {
@include _os_menuEmulate(5%, 60%);
@@ -140,6 +148,7 @@
}
/*= Linux - Light System Default Theme's Selected Tab ========================*/
+//-- Mixin ---------------------------------------------------------------------
$_os_linuxDefaultShadow: 0 0 4px rgba(128, 128, 142, 0.5);
@mixin _os_linuxDefaultThemeSelectedTab {
#tabbrowser-tabs:not([noshadowfortests])
@@ -149,6 +158,9 @@ $_os_linuxDefaultShadow: 0 0 4px rgba(128, 128, 142, 0.5);
@content;
}
}
+
+//------------------------------------------------------------------------------
+
@include OS($linux) {
@include Light {
/* Because of
@@ -167,3 +179,16 @@ $_os_linuxDefaultShadow: 0 0 4px rgba(128, 128, 142, 0.5);
}
}
}
+
+/*= Titlebar Container Size at maximized #384 ================================*/
+@include Option("userChrome.compatibility.os.windows_maximized") {
+ @include OS($win) {
+ :root[tabsintitlebar][sizemode="maximized"] #titlebar {
+ /* -moz-default-appearance: -moz-window-titlebar */
+ appearance: none !important;
+
+ // Prevent sideeffect #370
+ padding-top: 8px; // Don't use margin-top for reserved fullscreen animation
+ }
+ }
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_activity_stream.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_activity_stream.scss
index 6593ce1d..3a0acf32 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_activity_stream.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_activity_stream.scss
@@ -31,11 +31,11 @@
@include Option("userContent.newTab.full_icon") {
.top-site-outer .tile {
overflow: hidden;
- }
- .top-site-outer .tile .icon-wrapper {
- width: 100% !important; /* Original: 48px */
- height: 100% !important; /* Original: 48px */
+ .icon-wrapper {
+ width: 100% !important; /* Original: 48px */
+ height: 100% !important; /* Original: 48px */
+ }
}
}
@@ -52,12 +52,9 @@
button.icon,
button.close-button {
transition: background 1.5s var(--animation-easing-function);
- }
- .top-site-outer:hover,
- #searchSubmit:hover,
- button.icon:hover,
- button.close-button:hover {
- transition: background 0.5s var(--animation-easing-function);
+ &:hover {
+ transition: background 0.5s var(--animation-easing-function);
+ }
}
/* Search Bar */
@@ -83,10 +80,10 @@
.body-wrapper.on {
display: flex;
flex-wrap: wrap;
- }
- .body-wrapper.on > .discovery-stream.ds-layout {
- flex-basis: 100%;
+ > .discovery-stream.ds-layout {
+ flex-basis: 100%;
+ }
}
.body-wrapper.on > .collapsible-section[data-section-id="topstories"],
@@ -107,14 +104,13 @@
--newtab-search-dropdown-header-color: var(--newtab-search-background-color) !important;
--newtab-search-dropdown-color: var(--newtab-search-background-color) !important;
--newtab-element-hover-color: color-mix(in srgb, currentColor 9%, transparent) !important;
- }
- @include Dark {
- #root {
+ @include Dark {
/* Default Dark Mode */
--newtab-search-background-color: rgba(66, 65, 77, 1); /* Same as dark theme's --panel-background */
}
}
+
.activity-stream[lwt-sidebar]:not([style*="--newtab-background-color: rgba(43, 42, 51, 1);"]) #root {
/* Light weight theme */
--newtab-search-background-color: var(--lwt-sidebar-background-color);
@@ -169,24 +165,26 @@
background: var(--newtab-search-background-color) !important;
}
- .contentSearchSuggestionTable .contentSearchSuggestionRow.selected,
- .contentSearchSuggestionTable .contentSearchSettingsButton:hover {
- color: var(--newtab-text-primary-color) !important;
- }
+ .contentSearchSuggestionTable {
+ .contentSearchSuggestionRow.selected,
+ .contentSearchSettingsButton:hover {
+ color: var(--newtab-text-primary-color) !important;
+ }
- .contentSearchSuggestionTable .contentSearchSuggestionRow.selected,
- .contentSearchSuggestionTable .contentSearchSettingsButton:hover,
- .contentSearchSuggestionTable .contentSearchOneOffItem.selected {
- background: var(--newtab-element-hover-color) !important;
- }
+ .contentSearchSuggestionRow.selected,
+ .contentSearchSettingsButton:hover,
+ .contentSearchOneOffItem.selected {
+ background: var(--newtab-element-hover-color) !important;
+ }
- .contentSearchSuggestionTable .contentSearchSuggestionRow.selected:active,
- .contentSearchSuggestionTable .contentSearchOneOffItem:active {
- background: var(--newtab-element-active-color) !important;
- }
+ .contentSearchSuggestionRow.selected:active,
+ .contentSearchOneOffItem:active {
+ background: var(--newtab-element-active-color) !important;
+ }
- .contentSearchSuggestionTable .contentSearchSuggestionRow.selected .historyIcon {
- fill: var(--newtab-icon-secondary-color) !important;
+ .contentSearchSuggestionRow.selected .historyIcon {
+ fill: var(--newtab-icon-secondary-color) !important;
+ }
}
}
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_context_menu.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_context_menu.scss
new file mode 100644
index 00000000..63b5e164
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_context_menu.scss
@@ -0,0 +1,14 @@
+@-moz-document url("chrome://browser/content/places/places.xhtml"),
+ url("about:downloads") {
+ @import "../icons/layout_menu_contents";
+
+ /*= Context Menu ===========================================================*/
+ @include Option("userChrome.icon.context_menu") {
+ /* Icon lists */
+ @import "../icons/context_menu/downloads";
+ @import "../icons/context_menu/place";
+ }
+ @include Option("userChrome.icon.global_menu") {
+ @import "../icons/library";
+ }
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_downloads.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_downloads.scss
new file mode 100644
index 00000000..8f12cce4
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_downloads.scss
@@ -0,0 +1,7 @@
+@-moz-document url-prefix("about:downloads") {
+ @include Animate {
+ @include Option("userChrome.decoration.download_panel") {
+ @import "../decoration/download_panel";
+ }
+ }
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_error_page.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_error_page.scss
index b17bc957..aac860c4 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_error_page.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_error_page.scss
@@ -32,6 +32,41 @@
}
}
+
+//-- Mixin ---------------------------------------------------------------------
+@mixin _backgroundImage($imgURL, $important: false) {
+ background-image: url($imgURL) if($important, !important, null);
+ @content;
+}
+
+@mixin _errorContainerImage($imgURL) {
+ #errorPageContainer {
+ @include _backgroundImage($imgURL) {
+ @content;
+ }
+ }
+}
+
+@mixin _errorDescriptionImage($imgURL) {
+ .description-wrapper {
+ @include _backgroundImage($imgURL) {
+ @content;
+ }
+ }
+}
+
+@mixin _errorTitleImage($imgURL) {
+ @media (min-width: 970px) {
+ .title {
+ @include _backgroundImage($imgURL, true) {
+ @content;
+ }
+ }
+ }
+}
+
+//------------------------------------------------------------------------------
+
@-moz-document url-prefix("about:neterror?e=connectionFailure"),
url-prefix("about:neterror?e=netInterrupt"),
url-prefix("about:neterror?e=netTimeout"),
@@ -39,66 +74,41 @@
url-prefix("about:neterror?e=netOffline"),
url("about:restartrequired"), url("chrome://browser/content/aboutRestartRequired.xhtml")
{
- #errorPageContainer {
- background-image: url("../icons/error-connection-failure.svg");
- }
+ @include _errorContainerImage("../icons/error-connection-failure.svg");
}
@-moz-document url-prefix("about:neterror?e=dnsNotFound") {
- #errorPageContainer {
- background-image: url("../icons/error-server-not-found.svg");
- }
+ @include _errorContainerImage("../icons/error-server-not-found.svg");
}
@-moz-document url-prefix("about:neterror?e=malformedURI") {
- #errorPageContainer {
- background-image: url("chrome://browser/skin/illustrations/error-malformed-url.svg");
- }
+ @include _errorContainerImage("chrome://browser/skin/illustrations/error-malformed-url.svg");
}
@-moz-document url-prefix("about:neterror?e=clockSkewError"),
url-prefix("about:neterror?e=nssFailure") {
- #errorPageContainer {
- background-image: url("../icons/blue-berror.svg");
+ @include _errorContainerImage("../icons/blue-berror.svg") {
background-size: 18.5em;
}
}
@-moz-document url("about:sessionrestore"), url("chrome://browser/content/aboutSessionRestore.xhtml")
{
- .description-wrapper {
- background-image: url("../icons/error-session-restore.svg");
- }
+ @include _errorDescriptionImage("../icons/error-session-restore.svg");
}
@-moz-document url-prefix("about:neterror?e=fileNotFound") {
- @media (min-width: 970px) {
- .title {
- background-image: url("chrome://global/skin/icons/info.svg") !important;
- }
- }
+ @include _errorTitleImage("chrome://global/skin/icons/info.svg");
#text-container {
padding-inline-start: 0;
}
}
@-moz-document url-prefix("about:tabcrashed") {
- @media (min-width: 970px) {
- .title {
- background-image: url("chrome://browser/skin/tab-crashed.svg") !important;
- }
- }
+ @include _errorTitleImage("chrome://browser/skin/tab-crashed.svg");
}
@-moz-document url("about:robots"), url("chrome://browser/content/aboutRobots.xhtml")
{
- @media (min-width: 970px) {
- .title {
- background-image: url("chrome://browser/content/aboutRobots-icon.png") !important;
- }
- }
+ @include _errorTitleImage("chrome://browser/content/aboutRobots-icon.png");
}
@-moz-document url("about:welcomeBack"), url("chrome://browser/content/aboutWelcomeBack.xhtml")
{
- @media (min-width: 970px) {
- .title {
- background-image: url("../icons/welcome-back.svg") !important;
- }
- }
+ @include _errorTitleImage("../icons/welcome-back.svg");
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_proton_color.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_proton_color.scss
index c7dfaa89..8db37ae3 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_proton_color.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_proton_color.scss
@@ -1,4 +1,5 @@
@-moz-document url-prefix("about:"),
+ url-prefix("chrome://browser/content/places/places.xhtml"),
url-prefix("https://addons.mozilla.org"),
url-prefix("https://support.mozilla.org"),
url-prefix("https://accounts.firefox.com"),
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_video_player.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_video_player.scss
index c6c60cd4..01cbd68d 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_video_player.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/_video_player.scss
@@ -1,28 +1,30 @@
/* Control Bar Size */
@include Option("userContent.player.size") {
#controlsContainer {
- --button-size: 32px !important; /* Original: 30px */
+ // --button-size: 32px !important; /* Original: 30px */ Disabled for issue #404
--controlBar-height: 40px; /* Original: 40px, Replace to this value */
+ .touch {
+ --button-size: 48px !important; /* Original: 40px */
+ --controlBar-height: 52px; /* Original: 52px */
+ }
+ .controlBar {
+ height: var(--controlBar-height) !important; /* Original: 40px */
+ }
}
- #controlsContainer .touch {
- --button-size: 48px !important; /* Original: 40px */
- --controlBar-height: 52px; /* Original: 52px */
- }
- .videocontrols[inDOMFullscreen] #controlsContainer {
- --button-size: 64px !important; /* Original: 30px */
- --track-size: 6px !important; /* Original: 5px, Touch: 7px */
- --thumb-size: 15px !important; /* Original: 13px, Touch: 16px */
- --controlBar-height: 64px; /* Original: 40px */
- }
- .videocontrols[inDOMFullscreen] #controlsContainer .touch {
- --button-size: 72px !important; /* Original: 40px */
- --controlBar-height: 64px; /* Original: 52px */
- }
- #controlsContainer .controlBar {
- height: var(--controlBar-height) !important; /* Original: 40px */
- }
- .videocontrols[inDOMFullscreen] #controlsContainer .controlBar {
- padding-bottom: 8px !important;
+ .videocontrols[inDOMFullscreen] {
+ #controlsContainer {
+ --button-size: 64px !important; /* Original: 30px */
+ --track-size: 6px !important; /* Original: 5px, Touch: 7px */
+ --thumb-size: 15px !important; /* Original: 13px, Touch: 16px */
+ --controlBar-height: 64px; /* Original: 40px */
+ .touch {
+ --button-size: 72px !important; /* Original: 40px */
+ --controlBar-height: 64px; /* Original: 52px */
+ }
+ .controlBar {
+ padding-bottom: 8px !important;
+ }
+ }
}
}
@@ -39,30 +41,30 @@
box-shadow: 0 5px 10px -3px var(--box-shadow1), 0 3px 16px 2px var(--box-shadow2),
0 8px 12px 1px var(--box-shadow3);
/* Or: 0 2px 15px rgba(0,0,0,.1); */
- }
- video {
- --duration-color: #eee;
- --media-background: linear-gradient(transparent, rgba(26,26,26,.85));
- }
- @include Dark {
- audio {
+ @include Dark {
--box-shadow1: rgba(249, 249, 250, 0.12);
--box-shadow2: rgba(91, 91, 102, 0.12);
--box-shadow3: rgba(82, 82, 94, 0.04);
}
}
- @include Contrast {
- video {
+ video {
+ --duration-color: #eee;
+ --media-background: linear-gradient(transparent, rgba(26,26,26,.85));
+
+ @include Contrast {
--duration-color: #929292; /* Like Original */
--media-background: rgba(26,26,26,.8); /* Like Original */
}
}
- #controlsContainer .controlBar {
- background: var(--media-background) !important;
- }
- #controlsContainer .duration {
- color: var(--duration-color) !important; /* Original: #929292 */
+
+ #controlsContainer {
+ .controlBar {
+ background: var(--media-background) !important;
+ }
+ .duration {
+ color: var(--duration-color) !important; /* Original: #929292 */
+ }
}
@include Option("userContent.player.ui.twoline") {
@@ -138,28 +140,30 @@
transform:scale(1);
}
- #controlsContainer .controlBar {
- flex-wrap: var(--controlBar-flex-wrap);
- justify-content: var(--controlBar-justify-content);
- align-content: var(--controlBar-align-content);
- height: calc(var(--controlBar-height) + var(--controlBar-twoline-more-height, var(--thumb-size))) !important;
- padding-inline: var(--controlBar-padding-inline) !important; /* Original: 9px */
- }
- #controlsContainer .scrubberStack {
- /* Vertical */
- order: var(--scrubberStack-order);
- height: var(--scrubberStack-height, var(--thumb-size)) !important;
- transform: var(--scrubberStack-transform, translateY(calc(var(--thumb-size) / 2)));
+ #controlsContainer {
+ .controlBar {
+ flex-wrap: var(--controlBar-flex-wrap);
+ justify-content: var(--controlBar-justify-content);
+ align-content: var(--controlBar-align-content);
+ height: calc(var(--controlBar-height) + var(--controlBar-twoline-more-height, var(--thumb-size))) !important;
+ padding-inline: var(--controlBar-padding-inline) !important; /* Original: 9px */
+ }
+ .scrubberStack {
+ /* Vertical */
+ order: var(--scrubberStack-order);
+ height: var(--scrubberStack-height, var(--thumb-size)) !important;
+ transform: var(--scrubberStack-transform, translateY(calc(var(--thumb-size) / 2)));
- /* Horizontal */
- flex-basis: var(--scrubberStack-flex-basis, calc(var(--scrubberStack-width) - 18px)) !important;
- width: var(--scrubberStack-twoline-width, var(--scrubberStack-width));
- margin-inline: var(--scrubberStack-margin-inline) !important;
- }
- #controlsContainer .positionDurationBox {
- flex-grow: var(--positionDurationBox-flex-grow);
- margin-left: var(--positionDurationBox-margin-left);
- text-align: var(--positionDurationBox-text-align) !important;
+ /* Horizontal */
+ flex-basis: var(--scrubberStack-flex-basis, calc(var(--scrubberStack-width) - 18px)) !important;
+ width: var(--scrubberStack-twoline-width, var(--scrubberStack-width));
+ margin-inline: var(--scrubberStack-margin-inline) !important;
+ }
+ .positionDurationBox {
+ flex-grow: var(--positionDurationBox-flex-grow);
+ margin-left: var(--positionDurationBox-margin-left);
+ text-align: var(--positionDurationBox-text-align) !important;
+ }
}
#playButton {
@@ -174,9 +178,9 @@
@include Option("userContent.player.icon") {
#controlsContainer .fullscreenButton {
background-image: url("../icons/enter-fullscreen.svg") !important;
- }
- #controlsContainer .fullscreenButton[fullscreened] {
- background-image: url("../icons/exit-fullscreen.svg") !important;
+ &[fullscreened] {
+ background-image: url("../icons/exit-fullscreen.svg") !important;
+ }
}
}
@@ -189,16 +193,18 @@
/* Click to play UI */
@include Option("userContent.player.click_to_play") {
- #controlsContainer .clickToPlay {
- cursor: pointer;
- opacity: 0.65 !important;
- }
- #controlsContainer .controlsSpacerStack:hover > .clickToPlay {
- opacity: 0.85 !important;
- }
- #controlsContainer .controlsSpacerStack:hover > .clickToPlay:hover {
- opacity: 1 !important;
- fill: #48a0f7 !important; /* color as .scrubber */
+ #controlsContainer {
+ .clickToPlay {
+ cursor: pointer;
+ opacity: 0.65 !important;
+ }
+ .controlsSpacerStack:hover > .clickToPlay {
+ opacity: 0.85 !important;
+ &:hover {
+ opacity: 1 !important;
+ fill: #48a0f7 !important; /* color as .scrubber */
+ }
+ }
}
}
@@ -209,17 +215,18 @@
#controlsContainer .controlBar {
transition: transform 350ms ease;
opacity: 1 !important;
- }
- #controlsContainer .controlBar[hidden] {
- transform: translateY(100%);
- transition: transform 350ms ease-in-out, opacity 1s ease 100ms !important;
- opacity: 0 !important;
- }
- #controlsContainer .controlBar[hidden] .progressBar,
- #controlsContainer .controlBar[hidden] .bufferBar {
- display: unset !important;
- opacity: 0.55;
- transition: opacity 150ms ease 50ms;
+ &[hidden] {
+ transform: translateY(100%);
+ transition: transform 350ms ease-in-out, opacity 1s ease 100ms !important;
+ opacity: 0 !important;
+
+ .progressBar,
+ .bufferBar {
+ display: unset !important;
+ opacity: 0.55;
+ transition: opacity 150ms ease 50ms;
+ }
+ }
}
/* Two line Control Bar */
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/dark_mode/_addons_org.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/dark_mode/_addons_org.scss
index 6f48de55..39e8ec5b 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/dark_mode/_addons_org.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/dark_mode/_addons_org.scss
@@ -4,13 +4,16 @@
/* Basic */
.Page-content,
.SecondaryHero,
- body:not(.developer-hub):not(.statistics),
+ body,
main[aria-label="Content"] {
color: var(--in-content-page-color) !important;
background: var(--in-content-page-background) !important;
}
/* Text */
+ input,
+ textarea,
+ select,
.AutoSearchInput-query,
.AutoSearchInput-suggestions-list,
.Page-content h1,
@@ -19,6 +22,7 @@
.Home-SubjectShelf-link:link,
.Home-SubjectShelf-link:visited,
.DropdownMenuItem-link a,
+ .DropdownMenuItem-link button,
.Select,
.Badge,
.Notice-generic,
@@ -43,6 +47,7 @@
.SearchResult:hover .SearchResult-link,
.Home-SubjectShelf-link:is(:active, :focus, :hover),
.DropdownMenuItem-link a:is(:active, :focus, :hover),
+ .DropdownMenuItem-link button:is(:active, :focus, :hover),
.AddonMeta .MetadataCard-title a:is(:active, :hover),
.AddonMeta .MetadataCard-title a.AddonMeta-reviews-content-link:is(:active, :hover),
.AddonMeta .MetadataCard-content a:is(:active, :hover),
@@ -59,6 +64,7 @@
.AddonTitle a,
.TooltipMenu-opener,
.LanguageTools .Card-contents a,
+ .Button--primary,
.blog-entry-read-more-link,
.blogpost-nav-next.blogpost-nav-no-prev:hover p,
.blogpost-content-wrapper p a,
@@ -98,29 +104,38 @@
}
/* Background */
- .Button--action {
+ .Button--action,
+ .DevHub-Navigation ul li.DevHub-Navigation-Register .Button,
+ .DevHub-MyAddons-item-buttons-submit .Button {
color: var(--in-content-primary-button-text-color) !important;
background: var(--in-content-primary-button-background) !important;
}
+ select,
.Select,
+ .Button--primary,
.Button--neutral,
.Button--neutral:link,
.Notice-button,
.AMInstallButton .AMInstallButton-loading-button {
background-color: var(--in-content-button-background) !important;
}
+ .Button--primary:hover,
.Button--neutral.Button--micro:not(.Button--disabled):hover,
.Button--neutral:not(.Button--disabled):hover,
.Notice-button:hover {
background: var(--in-content-button-background-hover) !important;
}
.Button--action.Button--micro:not(.Button--disabled):hover,
- .Button--action:not(.Button--disabled):hover {
+ .Button--action:not(.Button--disabled):hover,
+ .DevHub-Navigation ul li.DevHub-Navigation-Register .Button:hover,
+ .DevHub-MyAddons-item-buttons-submit .Button:hover {
background: var(--in-content-primary-button-background-hover) !important;
}
.ShowMoreCard-contents::after {
background: linear-gradient(hsla(0, 0%, 100%, 0), var(--in-content-table-background)) !important;
}
+ input,
+ textarea,
.AutoSearchInput-query,
.AutoSearchInput-suggestions-list,
.SecondaryHero-module,
@@ -185,13 +200,27 @@
box-shadow: 0 0 2px var(--in-content-border-color) !important;
}
+ input,
+ textarea,
+ select {
+ border-color: var(--in-content-box-border-color) !important;
+ }
+ .UserProfileEdit input:disabled,
+ .UserProfileEdit textarea:disabled {
+ background-color: var(--in-content-box-background-odd) !important;
+ }
+
.AutoSearchInput-query {
border: 1px solid var(--in-content-table-background) !important;
}
- .AutoSearchInput-query:is(:hover, :focus) {
+ .AutoSearchInput-query:is(:hover, :focus),
+ .UserProfileEditNotifications .UserProfileEditNotification-input:checked ~ .UserProfileEditNotification-checkbox {
border-color: var(--in-content-primary-button-background) !important;
}
- .AutoSearchInput-query:focus {
+ .UserProfileEdit input:focus,
+ .UserProfileEdit textarea:focus,
+ .AutoSearchInput-query:focus,
+ .UserProfileEditNotifications .UserProfileEditNotification-input:focus ~ .UserProfileEditNotification-checkbox {
box-shadow: inset 0 0 0 1px var(--in-content-primary-button-background),
0 0 0 1px var(--in-content-primary-button-background), 0 0 0 4px rgba(0, 211, 255, 0.3) !important;
}
@@ -213,6 +242,12 @@
}
/* /developers/ */
+ .DevHub-Navigation-Logo > .Logo::before {
+ -moz-context-properties: fill !important;
+ fill: var(--in-content-primary-button-background) !important;
+ background-image: url("../icons/addons-logo.svg") !important;
+ }
+
.DevHub-Navigation,
.DevHub-submit-addon,
.DevHub-get-involved,
@@ -220,11 +255,14 @@
background: var(--in-content-page-background) !important;
color: var(--in-content-page-color) !important;
}
- .DevHub-Footer,
- .DevHub-callout-box {
+ .DevHub-Footer {
background: var(--in-content-box-background) !important;
color: var(--in-content-page-color) !important;
}
+ .DevHub-callout-box {
+ background: var(--in-content-box-background-odd) !important;
+ color: var(--in-content-page-color) !important;
+ }
.DevHub-Navigation.scheme-light ul li a,
.DevHub-Footer-sections-header,
@@ -233,10 +271,275 @@
.DevHub-content-copy h2 {
color: var(--in-content-page-color) !important;
}
+ .DevHub-content-copy p,
+ .DevHub-callout-box p {
+ color: var(--in-content-deemphasized-text) !important;
+ }
.DevHub-Banner a,
.DevHub-Footer a,
.DevHub-MyAddons-list a,
- .DevHub-MyAddons-item-buttons-all {
+ .DevHub-MyAddons-item-buttons-all,
+ .DevHub-content-copy a,
+ .DevHub-callout-box a {
color: var(--in-content-link-color) !important;
}
+
+ body:is(.developer-hub, .statistics) {
+ #main-wrapper,
+ .menu-nav > ul > li > ul::after,
+ .menu-nav > ul > li:hover::after,
+ .menu-nav > ul > li > ul,
+ .menu-nav > ul > li > ul a,
+ .menu-nav em,
+ .primary, .secondary,
+ .dashboard .listing .item {
+ background: var(--in-content-page-background) !important;
+ color: var(--in-content-page-color) !important;
+ }
+
+ /* Elements */
+ .menu-nav > ul > li > ul a:hover,
+ .install-note,
+ .modal,
+ .popup {
+ background: var(--in-content-box-background-odd) !important;
+ }
+
+ .menu-nav > ul > li > ul::after,
+ .menu-nav > ul > li > ul {
+ box-shadow: 0 0 3px var(--in-content-border-color) !important;
+ }
+
+ /* .developer-hub */
+ #footer {
+ background: linear-gradient(
+ to bottom,var(--in-content-page-background) 0,
+ var(--in-content-page-background) 123px,
+ #0c99d5 123px,
+ #0c99d5 200px,
+ var(--in-content-page-background) 200px,
+ rgba(12,153,213,0) 400px
+ ) !important;
+ }
+
+ /* Text */
+ /* .developer-hub */ #homepage h2,
+ /* .developer-hub */ header h2,
+ .primary h2,
+ h1,
+ hgroup h2.addon,
+ hgroup h2.collection,
+ h3,
+ .results h4,
+ .dashboard .listing .item,
+ .dashboard .listing .item:hover h5,
+ .secondary .addon-status,
+ .secondary .addon-status .addon-details li.addon-listed-status,
+ #refine-results h5,
+ .island.criteria li,
+ .two-up div {
+ color: var(--in-content-page-color) !important;
+ }
+ .item-actions h5, .item-actions > ul, .item-actions > ul > li,
+ .dashboard .listing .item .item-actions a,
+ .edit-media-details,
+ .devhub-form table th,
+ #recent-activity .listing .item .timestamp,
+ #upload-file .upload-status #uploadstatus,
+ #addon-validator-suite,
+ #addon-validator-suite .msg > *,
+ .island.criteria li a.inactive {
+ color: var(--in-content-deemphasized-text) !important;
+ }
+
+ section[role="main"] a,
+ header a,
+ .more-info,
+ .primary a,
+ .secondary a,
+ .submission-type-tabs a,
+ .popup a,
+ .dashboard .listing .item:hover a,
+ .dashboard .listing .item:hover .item-actions a,
+ #upload-status-results.status-pass strong,
+ #addon-validator-suite a,
+ #create-addon a,
+ .html-support {
+ color: var(--in-content-link-color) !important;
+ }
+ .dashboard .listing .item:hover a {
+ color: var(--in-content-link-color-hover) !important;
+ }
+
+ .dashboard .listing .item .item-info .downloads,
+ .dashboard .listing .item .item-info .price,
+ .dashboard .listing .item .item-info .users {
+ color: var(--green-60) !important;
+ }
+
+ .status-admin-disabled b,
+ .status-disabled b,
+ .status-incomplete b,
+ .status-purgatory b {
+ color: var(--red-60) !important;
+ }
+
+ .submission-type-tabs a.active,
+ .island.criteria li.selected a {
+ color: var(--orange-50) !important;
+ }
+
+ /* Background */
+ .secondary .addon-status,
+ .devhub-form .item,
+ #icons_default,
+ .listing .item,
+ .object-lead,
+ #addon-validator-suite .results .tier-results,
+ #addon-validator-suite .suite,
+ #addon-validator-suite .suite-container {
+ border-color: var(--in-content-border-color) !important;
+ background: var(--in-content-box-background) !important;
+ }
+
+ .highlight,
+ .listing-footer, .tab-wrapper .fm-control {
+ color: var(--in-content-page-color) !important;
+ background: var(--in-content-box-info-background) !important;
+ }
+
+ .submission-type-tabs a,
+ #head-chart {
+ background: var(--in-content-page-background) !important;
+ }
+ #head-chart {
+ rect {
+ fill: var(--in-content-page-background) !important;
+ }
+ text{
+ fill: var(--in-content-deemphasized-text) !important;
+ }
+ .highcharts-legend .highcharts-legend-item:hover text {
+ fill: var(--in-content-page-color) !important;
+ paint-order: stroke !important;
+ stroke: var(--in-content-page-color) !important;
+ stroke-width: 0.4px !important;
+ stroke-linecap: butt !important;
+ stroke-linejoin: miter !important;
+ }
+ .highcharts-legend .highcharts-legend-item path[stroke="#CCC"] ~ text {
+ fill: #CCC !important;
+ }
+ }
+
+ #icons_default li a:hover,
+ #side-nav .active a,
+ span.tip,
+ .addon-submission-process .tip,
+ .devhub-form .tip,
+ a.remove,
+ span.remove,
+ ul.errorlist li span.tip {
+ background-color: var(--in-content-box-info-background) !important;
+ }
+ a.remove:hover, span.tip:hover {
+ background-color: var(--in-content-primary-button-background-hover) !important;
+ }
+
+ /* Border */
+ .submission-type-tabs a,
+ .devhub-sidebar,
+ .devhub-sidebar div.item,
+ .devhub-form .listing-footer {
+ border-color: var(--in-content-border-color) !important;
+ }
+
+ #background-wrapper,
+ #main-wrapper {
+ border-color: var(--in-content-page-background) !important;
+ }
+
+ .item-actions a.more-actions:hover:after,
+ .item-actions button.link.more-actions:hover:after,
+ #change-locale::after {
+ border-top-color: var(--in-content-link-color) !important;
+ }
+
+ install-note::after, .popup::after {
+ border-bottom-color: var(--in-content-box-background) !important;
+ }
+ .install-note::before, .popup::before {
+ border-bottom-color: grey !important;
+ }
+
+ #refine-results, .other-categories,
+ .versions .primary > .warning {
+ border-color: transparent !important;
+ }
+
+ .results {
+ border-color: var(--in-content-box-background-odd) !important;
+ background: transparent !important;
+ }
+ .results-inner {
+ border-color: var(--in-content-border-color) !important;
+ background: var(--in-content-border-color) !important;
+ }
+
+ /* Othres */
+ #promos .view-button a,
+ #upload-file-finish.button,
+ #upload-file-widget .button.prominent,
+ .button,
+ .cta a.button:link,
+ .cta a.button:visited,
+ .linux .button.linux,
+ .mac .button.mac,
+ .other .button.bsd,
+ .other .button.solaris,
+ .sidebar a.button,
+ .sidebar button,
+ .theme .choices button,
+ .theme-queue a.button,
+ .theme-queue button,
+ .windows .button.windows,
+ a.button:link,
+ a.button:visited,
+ a.delete-button.delete-addon,
+ button,
+ button.button,
+ input:not(.upvotes):not(.downvotes)[type="submit"] {
+ color: var(--in-content-primary-button-text-color) !important;
+ background: var(--in-content-primary-button-background) !important;
+ &:is(.selected, :focus, :hover) {
+ background: var(--in-content-primary-button-background-hover) !important;
+ }
+ }
+
+ .edit_with_prefix span,
+ .edit_with_suffix span {
+ border-color: var(--in-content-box-border-color) !important;
+ background-color: var(--in-content-box-background-odd) !important;
+ color: var(--in-content-deemphasized-text) !important;
+ padding-block: 3px !important;
+ cursor: not-allowed;
+ }
+
+ .devhub-form .item_wrapper input[type="email"] {
+ appearance: none !important;
+ padding: 2px 5px;
+ border: 1px solid;
+ }
+
+ #addon-validator-suite .suite-summary {
+ color: var(--in-content-deemphasized-text) !important;
+ background: var(--in-content-button-background) !important;
+ border-top-color: var(--in-content-border-color) !important;;
+ }
+ #addon-validator-suite .context {
+ border-color: var(--in-content-box-border-color) !important;
+ background-color: var(--in-content-button-background) !important;
+ background: var(--in-content-table-background) !important;
+ }
+ }
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/proton_contents/_field_border.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/proton_contents/_field_border.scss
index 65877e0b..3b60cc42 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/contents/proton_contents/_field_border.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/contents/proton_contents/_field_border.scss
@@ -1,12 +1,8 @@
@-moz-document url-prefix("about:") {
+ html|input:is([type="email"], [type="tel"], [type="text"], [type="password"], [type="url"], [type="number"]):not(#newtab-search-text):hover,
+ html|textarea:hover,
xul|search-textbox:hover {
border-color: var(--in-content-focus-outline-color) !important;
transition: border-color 0.5s var(--animation-easing-function);
}
}
-@-moz-document url-prefix("about:config") {
- #about-config-search:hover {
- border-color: var(--in-content-focus-outline-color) !important;
- transition: border-color 0.5s var(--animation-easing-function);
- }
-}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/decoration/_animate.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/decoration/_animate.scss
index 8c7035a9..25997a70 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/decoration/_animate.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/decoration/_animate.scss
@@ -1,4 +1,5 @@
/*- Background Color -------------------------------------------------------*/
+//-- Mixin ---------------------------------------------------------------------
@mixin _animate_bgColor($duration, $presudo: "") {
button#{$presudo},
toolbarbutton#{$presudo},
@@ -9,6 +10,9 @@
transition: background-color $duration var(--animation-easing-function) !important;
}
}
+
+//------------------------------------------------------------------------------
+
@include _animate_bgColor(1s);
@include _animate_bgColor(0.25s, ":hover");
@include OS($linux) {
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/fullscreen/_overlap.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/fullscreen/_overlap.scss
new file mode 100644
index 00000000..387c057c
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/fullscreen/_overlap.scss
@@ -0,0 +1,15 @@
+:root[sizemode="fullscreen"] #navigator-toolbox {
+ position: fixed !important; /* Needed for content to take up entire height */
+ z-index: 1000 !important; /* Puts the UI above the content */
+}
+
+:root[sizemode="fullscreen"] :-moz-any(#navigator-toolbox, #titlebar, #nav-bar, #PersonalToolbar) {
+ width: 100%; /* Makes the UI take up the entire width */
+}
+
+@include OS($linux) {
+ /* Fix transparent backgorund */
+ :root[tabsintitlebar][sizemode="fullscreen"] #TabsToolbar:not(:-moz-lwtheme) {
+ appearance: auto !important;
+ }
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/fullscreen/_show_bookmarkbar.css b/arch-config/.mozilla/firefox/default-release/chrome/src/fullscreen/_show_bookmarkbar.css
new file mode 100644
index 00000000..a91348ee
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/fullscreen/_show_bookmarkbar.css
@@ -0,0 +1,4 @@
+:root:not([sizemode="fullscreen"]) #PersonalToolbar[initialized="true"]:not([collapsed="true"]),
+:root[sizemode="fullscreen"] #PersonalToolbar[initialized="true"] {
+ visibility: unset !important; /* Makes the bookmarks toolbar visible if enabled */
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_context_menu.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_context_menu.scss
index 4fb60ca2..df54e0ff 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_context_menu.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_context_menu.scss
@@ -1,5 +1,6 @@
/** Context Menu - Icons ******************************************************/
@import "context_menu/tab_toolbar.scss";
@import "context_menu/content_area.scss";
+@import "context_menu/downloads";
@import "context_menu/place";
@import "context_menu/others";
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_global_menu.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_global_menu.scss
index 99b12c1e..00aa9f5e 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_global_menu.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_global_menu.scss
@@ -4,6 +4,7 @@
--menuitem-image: url("chrome://browser/skin/new-tab.svg");
}
#menu_newUserContext {
+ --menuitem-image: url("../icons/container-openin-16.svg");
}
#menu_newNavigator {
--menuitem-image: url("chrome://browser/skin/window.svg");
@@ -43,6 +44,8 @@
}
#goOfflineMenuitem {
+ /* checkbox */
+ --menuitem-image: url("../icons/plug-disconnected.svg");
}
#menu_FileQuitItem {
--menuitem-image: url("../icons/quit.svg");
@@ -58,6 +61,9 @@
--menuitem-image: url("../icons/undo.svg");
}
#menu_redo {
+ @include Option("userChrome.icon.menu.full") {
+ --menuitem-image: url("../icons/redo.svg");
+ }
}
#menu_cut {
@@ -109,12 +115,14 @@
}
#fullScreenItem {
+ /* checkbox */
--menuitem-image: url("chrome://browser/skin/fullscreen.svg");
}
#menu_readerModeItem {
--menuitem-image: url("chrome://browser/skin/reader-mode.svg");
}
#menu_showAllTabs {
+ --menuitem-image: url("../icons/tab.svg");
}
#documentDirection-swap {
@@ -152,6 +160,7 @@
--menuitem-image: url("../icons/restore-session.svg");
}
#hiddenTabsMenu {
+ --menuitem-image: url("../icons/eye-hide.svg")
}
#historyUndoMenu {
--menuitem-image: url("chrome://browser/skin/tab.svg");
@@ -209,7 +218,7 @@
}
#webDeveloperMenu, /* Legacy */
- #browserToolsMenu {
+#browserToolsMenu {
--menuitem-image: url("../icons/developer.svg");
}
#menu_pageInfo {
@@ -220,6 +229,8 @@
#enableDeveloperTools {
}
#menu_devToolbox {
+ /* checkbox */
+ --menuitem-image: url("../icons/developer.svg");
}
#menu_taskManager {
--menuitem-image: url("../icons/performance.svg");
@@ -237,8 +248,12 @@
--menuitem-image: url("chrome://devtools/skin/images/command-console.svg");
}
#menu_responsiveUI {
+ /* checkbox */
+ --menuitem-image: url("../icons/command-responsivemode.svg");
}
#menu_eyedropper {
+ /* checkbox */
+ --menuitem-image: url("chrome://devtools/skin/images/command-eyedropper.svg");
}
#menu_pageSource {
--menuitem-image: url("../icons/document-search.svg");
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_bookmark_menu.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_bookmark_menu.scss
index 4faa1999..5b555286 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_bookmark_menu.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_bookmark_menu.scss
@@ -15,6 +15,43 @@ menupopup menupopup[emptyplacesresult] .menu-text,
--context-menu-background-padding: var(--arrowpanel-menuitem-padding-inline);
}
+//-- Mixin ---------------------------------------------------------------------
+// Items
+$_bookmarkMenuitem: "menuitem:not(.menuitem-iconic, [disabled=\"true\"])";
+$_bookmarkMenu: "menu:not(.menu-iconic)";
+
+// Components
+$_bookmarkPopup: "menupopup:is(#BMB_bookmarksPopup)";
+$_bookmarkToolbar: "#PersonalToolbar menupopup[placespopup=\"true\"]";
+
+$_bookmarkPopupMenus: selector.nest(
+ $_bookmarkPopup,
+ "#{$_bookmarkMenuitem}, #{$_bookmarkMenu}"
+);
+$_bookmarkToolbarMenus: selector.nest(
+ $_bookmarkToolbar,
+ "#{$_bookmarkMenuitem}, #{$_bookmarkMenu}"
+);
+
+@mixin _layoutBookmarkMenu() {
+ #{$_bookmarkPopupMenus},
+ #{$_bookmarkToolbarMenus} {
+ @content;
+ }
+}
+@mixin _layoutBookmarkPopup() {
+ #{$_bookmarkPopupMenus} {
+ @content;
+ }
+}
+@mixin _layoutBookmarkToolbar() {
+ #{$_bookmarkToolbarMenus} {
+ @content;
+ }
+}
+
+//------------------------------------------------------------------------------
+
/* Windows 7, 8 */
@include OS($win7, $win8) {
/* Global Menu */
@@ -27,19 +64,14 @@ menupopup menupopup[emptyplacesresult] .menu-text,
#PersonalToolbar {
--arrowpanel-menuicon-padding: 9px;
}
- menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]),
- menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic),
- #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]),
- #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) {
+ @include _layoutBookmarkMenu() {
margin-inline: var(--arrowpanel-menuitem-padding-inline) !important;
background-position: left calc(var(--arrowpanel-menuicon-padding)) center !important;
}
- menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]),
- menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) {
+ @include _layoutBookmarkPopup() {
padding-inline-start: calc(var(--arrowpanel-menuicon-padding) + var(--context-menu-text-padding) + 2px) !important;
}
- #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]),
- #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) {
+ @include _layoutBookmarkToolbar() {
padding-inline-start: var(--arrowpanel-menuicon-padding) !important;
}
}
@@ -47,10 +79,7 @@ menupopup menupopup[emptyplacesresult] .menu-text,
/* Windows */
@include OS($win10) {
/* Bookmark Popup - None icon menu */
- menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]),
- menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic),
- #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]),
- #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) {
+ @include _layoutBookmarkMenu() {
margin-inline: var(--arrowpanel-menuitem-padding-inline) !important;
padding-inline-start: calc(var(--arrowpanel-menuicon-padding) + var(--context-menu-text-padding)) !important;
background-position: left calc(var(--arrowpanel-menuicon-padding)) center !important;
@@ -70,10 +99,7 @@ menupopup menupopup[emptyplacesresult] .menu-text,
padding-inline-start: 1px !important;
}
/* Bookmark Popup - None icon menu */
- menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]),
- menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic),
- #PersonalToolbar menupopup[placespopup="true"] menuitem:not(.menuitem-iconic, [disabled="true"]),
- #PersonalToolbar menupopup[placespopup="true"] menu:not(.menu-iconic) {
+ @include _layoutBookmarkMenu() {
padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 1px) !important;
}
}
@@ -86,8 +112,7 @@ menupopup menupopup[emptyplacesresult] .menu-text,
}
/* Bookmark Popup - None icon menu */
- menupopup:is(#BMB_bookmarksPopup) menuitem:not(.menuitem-iconic, [disabled="true"]),
- menupopup:is(#BMB_bookmarksPopup) menu:not(.menu-iconic) {
+ @include _layoutBookmarkPopup() {
padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + 3px) !important;
}
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu.scss
index 026e88f3..fb0be852 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu.scss
@@ -1,208 +1,125 @@
-menupopup menuitem:not([type="checkbox"], [type="radio"]),
-menupopup menu:not([type="checkbox"], [type="radio"]),
-#main-menubar > menu {
- -moz-appearance: none !important; /* Linux: menulist */
+@import "./layout_menu_common";
+
+//-- Mixin ---------------------------------------------------------------------
+// Components
+$_layoutCommonMenus: (
+ $_iconMenuPopupMenus,
+ $_libraryMenuitem,
+ $_libraryMenu,
+ $_sendTabMenuitem,
+ $_otherIconMenu
+);
+@mixin _layoutInitIconMenus() {
+ #{$_globalMenus},
+ #{$_nestedPopupIconMenus},
+ #{$_layoutCommonMenus} {
+ @content;
+ }
}
-
-/* Icon */
-:not(menu, #ContentSelectDropdown)
- > menupopup
- > menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
-:not(menu, #ContentSelectDropdown)
- > menupopup
- > menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
-#main-menubar > menu,
-menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
-menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
-menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
-menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu,
-menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup) > menuitem,
-.openintabs-menuitem,
-#blockedPopupDontShowMessage {
- /* Color */
- -moz-context-properties: fill, fill-opacity !important;
- fill: currentColor !important;
-
- /* Layout */
- background-size: 16px !important;
- background-repeat: no-repeat !important;
- background-image: var(--menuitem-image);
+@mixin _layoutInitPaddingMenus() {
+ #{selector.nest($_nestedPopupPadding, "menuitem:not(.menuitem-iconic), menu:not(.menu-iconic)")},
+ #{$_nestedPopupPaddingMenus},
+ #{$_layoutCommonMenus} {
+ @content;
+ }
}
-
-/* For native context menus on macOS */
-@supports -moz-bool-pref("widget.macos.native-context-menus") {
- :not(menu, #ContentSelectDropdown)
- > menupopup
- > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
- :not(menu, #ContentSelectDropdown)
- > menupopup
- > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist) {
- list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important;
+@mixin _layoutIconMenus() {
+ #{$_nestedPopupPaddingMenus},
+ #{$_layoutCommonMenus} {
+ @content;
}
}
-/* Padding */
-:root {
- --context-menu-background-padding-default: 5px;
- --context-menu-background-padding: var(--context-menu-background-padding-default);
+//------------------------------------------------------------------------------
+
+#{$_initialMenus},
+#{$_globalMenus} {
+ @include _initial_menus;
}
-:not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem:not(.menuitem-iconic),
-:not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu:not(.menu-iconic),
-menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"], .bookmark-item),
-menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
-menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
-menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu,
-menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup) > menuitem,
-.openintabs-menuitem,
-#blockedPopupDontShowMessage {
- background-position: left var(--context-menu-background-padding) center !important;
- padding-inline-start: var(--context-menu-background-padding) !important;
+
+/* Icon */
+@include _layoutInitIconMenus {
+ @include _layout_icon_menus;
+}
+
+/* For native context menus */
+#{$_nestedPopupIconMenus} {
+ @include _layout_icon_native_menus;
+}
+
+/* Padding */
+@include _layout_root_padding;
+@include _layoutInitPaddingMenus {
+ @include _layout_init_padding;
}
/* Menubar */
@include Option("userChrome.icon.global_menubar") {
- #main-menubar > menu {
+ #{$_globalMenus} {
background-position: left var(--context-menu-background-padding-default) center !important;
padding-inline-start: calc(16px + var(--context-menu-background-padding-default)) !important;
padding-inline-end: 3px;
- }
- #main-menubar > menu:first-child {
- background-position: left calc(3px + var(--context-menu-background-padding-default)) center !important;
- padding-inline-start: calc(19px + var(--context-menu-background-padding-default)) !important;
- }
- #main-menubar > menu > menupopup {
- --menuitem-image: none; /* Prevent Image Inheritance */
- }
- @include NotOption("userChrome.padding.global_menubar") {
- #main-menubar > menu {
- padding-block: 2px !important;;
+ &:first-child {
+ background-position: left calc(3px + var(--context-menu-background-padding-default)) center !important;
+ padding-inline-start: calc(19px + var(--context-menu-background-padding-default)) !important;
+ }
+ > menupopup {
+ --menuitem-image: none; /* Prevent Image Inheritance */
+ }
+ @include NotOption("userChrome.padding.global_menubar") {
+ padding-block: 2px !important;
}
}
}
/* Padding - Windows */
-@include OS($win) {
- /* Checkbox */
- :root {
- --context-menu-text-padding: calc(var(--menu-padding) + var(--context-menu-background-padding-default) + 16px);
- }
- :not(menu, #ContentSelectDropdown, #context-navigation)
- > menupopup
- > menuitem[type="checkbox"]:not([checked="true"])
- > .menu-iconic-left {
- padding-inline-start: var(--context-menu-text-padding);
- }
-}
-
-@include OS($win7) {
- :root {
- --context-menu-background-padding-default: 2px;
- }
-}
-@include OS($win8) {
- :root {
- --context-menu-background-padding-default: 3px;
- }
-}
+@include _layout_root_win7_8;
@include OS($win7, $win8) {
- :not(menu, #ContentSelectDropdown, #context-navigation)
- > menupopup
- > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
- :not(menu, #ContentSelectDropdown, #context-navigation)
- > menupopup
- > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist),
- menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"], .bookmark-item),
- menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu,
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup) > menuitem,
- .openintabs-menuitem,
- #blockedPopupDontShowMessage {
- background-position: left var(--context-menu-background-padding) center !important;
- padding-inline-start: 0 !important;
+ @include _layoutIconMenus {
+ @include _layout_init_win7_8();
}
}
@include OS($win10) {
- :root {
- --context-menu-background-padding: 1em;
- --context-menu-text-padding: 24px; /* 16px + 8px */
- --menu-background-padding-default: calc(var(--context-menu-background-padding) + var(--context-menu-text-padding));
- }
+ @include _layout_root_win10;
- :not(menu, #ContentSelectDropdown, #context-navigation)
- > menupopup
- > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
- :not(menu, #ContentSelectDropdown, #context-navigation)
- > menupopup
- > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist),
- menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"], .bookmark-item),
- menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]),
- menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > menuitem,
- menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > menu,
- menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup) > menuitem,
- .openintabs-menuitem,
- #blockedPopupDontShowMessage {
- padding-inline-start: var(--menu-background-padding-default) !important;
- margin-left: 0 !important;
+ @include _layoutIconMenus {
+ @include _layout_init_win10;
}
}
/* Padding - Linux */
@include OS($linux) {
- :root {
- --context-menu-background-padding-default: 6px;
- }
+ @include _layout_root_linux;
- #main-menubar > menu > .menubar-text {
- padding-inline-start: 3px;
+ #{$_globalMenus} > .menubar-text {
+ @include _layout_init_linux;
}
}
/* Padding - Mac */
@include OS($mac) {
- :root {
- --context-menu-background-padding-default: 10px;
- --context-menu-mac-padding: 21px;
- }
+ @include _layout_root_mac;
/* context menu width */
- :not(menu, #ContentSelectDropdown, #context-navigation)
- > menupopup
- > menuitem:not(.menuitem-iconic, [type="checkbox"], [checked="true"], .in-menulist),
- :not(menu, #ContentSelectDropdown, #context-navigation)
- > menupopup
- > menu:not(.menu-iconic, [type="checkbox"], [checked="true"], .in-menulist),
+ #{$_nestedPopupPaddingMenus},
#blockedPopupDontShowMessage {
- padding-inline-end: var(--context-menu-background-padding) !important;
+ @include _layout_init_mac_width;
}
/* text position */
- :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem > .menu-text,
- :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu > menu-text {
- padding-inline-start: var(--context-menu-mac-padding) !important;
+ #{selector.nest($_nestedPopupPadding, "menuitem > .menu-text, menu > .menu-text")} {
+ @include _layout_init_mac_text;
}
/* Checkbox menuitem, None iconic menu */
- :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menuitem[type="checkbox"],
- :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup > menu:not(.menu-iconic) {
- padding-inline-start: calc(var(--context-menu-background-padding) + var(--context-menu-mac-padding)) !important;
+ #{selector.nest($_nestedPopupPadding, "menuitem[checked=\"true\"], menu:not(.menu-iconic)")} {
+ @include _layout_init_mac_others;
}
/* Global Menu */
/* Disabled. some icons not appear
- menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menuitem:not(.menuitem-iconic, .in-menulist, [type="checkbox"], [checked="true"], .bookmark-item),
- menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)
- menu:not(.menu-iconic, .in-menulist, [type="checkbox"], [checked="true"]) {
+ #{$_iconMenuPopupMenus} {
list-style-image: var(--menuitem-image, url("../icons/blank.svg"));
}
*/
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu_common.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu_common.scss
new file mode 100644
index 00000000..3d3a92c5
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu_common.scss
@@ -0,0 +1,140 @@
+//-- Variables -----------------------------------------------------------------
+// Items
+// .menu-iconic, .menuitem-iconic: Alreay exist, not target.
+// .in-menulist: Not a range because it is a select menu of web content.
+// [checked="true"]: There should be a check mark instead of an icon.
+$_iconNoneCommon: ".in-menulist, [checked=\"true\"]";
+$_iconMenuitem: "menuitem:not(.menuitem-iconic, .bookmark-item, #{$_iconNoneCommon})";
+$_iconMenu: "menu:not(.menu-iconic, #{$_iconNoneCommon})";
+
+// Components
+$_nestedPopupIcon: ":not(menu, #ContentSelectDropdown) > menupopup >";
+$_nestedPopupPadding: ":not(menu, #ContentSelectDropdown, #context-navigation) > menupopup >";
+$_iconMenuPopup: "menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ToolsPopup, #menu_HelpPopup)";
+
+$_nestedPopupIconMenus: selector.nest(
+ $_nestedPopupIcon,
+ "#{$_iconMenuitem}, #{$_iconMenu}"
+);
+$_nestedPopupPaddingMenus: selector.nest(
+ $_nestedPopupPadding,
+ "#{$_iconMenuitem}, #{$_iconMenu}"
+);
+$_iconMenuPopupMenus: selector.nest(
+ $_iconMenuPopup,
+ "#{$_iconMenuitem}, #{$_iconMenu}"
+);
+
+$_globalMenus: "#main-menubar > menu";
+$_libraryMenuitem: "menupopup:is(#organizeButtonPopup, #maintenanceButtonPopup) > #{$_iconMenuitem}";
+$_libraryMenu: "menupopup:is(#viewMenuPopup, #maintenanceButtonPopup) > #{$_iconMenu}";
+$_sendTabMenuitem: "menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup) > menuitem";
+$_otherIconMenu: ".openintabs-menuitem, #blockedPopupDontShowMessage, #BMB_viewBookmarksToolbar";
+
+//-- Mixin ---------------------------------------------------------------------
+// Init Menu
+$_initialMenus: selector.append(
+ "menupopup menuitem, menupopup menu",
+ ":not([type=\"checkbox\"][checked=\"true\"], [type=\"radio\"])"
+);
+@mixin _initial_menus() {
+ -moz-appearance: none !important; /* Linux: menulist */
+}
+
+// Icon
+@mixin _layout_icon_menus() {
+ /* Color */
+ -moz-context-properties: fill, fill-opacity !important;
+ fill: currentColor !important;
+
+ /* Layout */
+ background-size: 16px !important;
+ background-repeat: no-repeat !important;
+ background-image: var(--menuitem-image);
+}
+
+@mixin _layout_icon_native_menus() {
+ @include NativeMenu {
+ list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important;
+ }
+}
+
+// Padding
+@mixin _layout_root_padding() {
+ :root {
+ --context-menu-background-padding-default: 5px;
+ --context-menu-background-padding: var(--context-menu-background-padding-default);
+ }
+}
+@mixin _layout_init_padding() {
+ background-position: left var(--context-menu-background-padding) center !important;
+ padding-inline-start: var(--context-menu-background-padding) !important;
+}
+
+@mixin _layout_root_win7_8() {
+ @include OS($win7) {
+ :root {
+ --context-menu-background-padding-default: 2px;
+ }
+ }
+ @include OS($win8) {
+ :root {
+ --context-menu-background-padding-default: 3px;
+ }
+ }
+}
+@mixin _layout_init_win7_8() {
+ background-position: left var(--context-menu-background-padding) center !important;
+ padding-inline-start: 0 !important;
+}
+
+@mixin _layout_root_win10() {
+ :root {
+ --context-menu-background-padding: 1em;
+ --context-menu-text-padding: 24px; /* 16px + 8px */
+ --menu-background-padding-default: calc(var(--context-menu-background-padding) + var(--context-menu-text-padding));
+ }
+}
+@mixin _layout_init_win10() {
+ padding-inline-start: var(--menu-background-padding-default) !important;
+ margin-left: 0 !important;
+}
+
+@mixin _layout_root_linux() {
+ :root {
+ --context-menu-background-padding-default: 6px;
+ }
+}
+@mixin _layout_init_linux() {
+ padding-inline-start: 3px;
+}
+
+@mixin _layout_root_mac() {
+ :root {
+ --context-menu-background-padding-default: 10px;
+ --context-menu-mac-padding: 21px;
+ }
+}
+@mixin _layout_init_mac_width() {
+ padding-inline-end: var(--context-menu-background-padding) !important;
+}
+@mixin _layout_init_mac_text() {
+ padding-inline-start: var(--context-menu-mac-padding) !important;
+}
+@mixin _layout_init_mac_others() {
+ padding-inline-start: calc(var(--context-menu-background-padding) + var(--context-menu-mac-padding)) !important;
+}
+
+// Checkbox
+// @include OS($win) {
+// /* Checkbox */
+// :root {
+// --context-menu-text-padding: calc(var(--menu-padding) + var(--context-menu-background-padding-default) + 16px);
+// }
+// :not(menu, #ContentSelectDropdown, #context-navigation)
+// > menupopup
+// > menuitem[type="checkbox"]:not([checked="true"])
+// > .menu-iconic-left {
+// padding-inline-start: var(--context-menu-text-padding);
+// }
+// }
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu_contents.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu_contents.scss
new file mode 100644
index 00000000..4c383a07
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_layout_menu_contents.scss
@@ -0,0 +1,90 @@
+@import "../icons/layout_menu_common";
+
+//-- Mixin ---------------------------------------------------------------------
+$_placesPopupSet: "menupopup:is(#placesContext, #placesColumnsContext, #downloadsContextMenu)";
+$_placesPopupSetMenus: selector.nest(
+ $_placesPopupSet,
+ "#{$_iconMenuitem}, #{$_iconMenu}"
+);
+
+@mixin _library_contextMenu {
+ #{$_placesPopupSetMenus},
+ #{$_libraryMenuitem},
+ #{$_libraryMenu} {
+ @content;
+ }
+}
+
+//------------------------------------------------------------------------------
+
+#{$_initialMenus} {
+ @include _initial_menus;
+}
+
+@include _library_contextMenu {
+ @include _layout_icon_menus;
+}
+
+/* For native context menus */
+#{$_nestedPopupIconMenus} {
+ @include _layout_icon_native_menus;
+}
+
+/* Padding */
+@include _layout_root_padding;
+@include _library_contextMenu {
+ @include _layout_init_padding;
+}
+
+/* Padding - Windows */
+@include _layout_root_win7_8;
+@include OS($win7, $win8) {
+ @include _library_contextMenu {
+ @include _layout_init_win7_8();
+ }
+}
+@include OS($win10) {
+ @include _layout_root_win10;
+
+ @include _library_contextMenu {
+ @include _layout_init_win10;
+ }
+}
+
+/* Padding - Linux */
+@include OS($linux) {
+ @include _layout_root_linux;
+
+ /* Contextmenu Checkbox Unset */
+ #{$_placesPopupSet} menuitem[type="checkbox"] {
+ margin-inline: 0 !important;
+ > .menu-iconic-left > .menu-iconic-icon {
+ margin-inline-end: 0 !important;
+ }
+ &:not([checked="true"]) > .menu-iconic-left > .menu-iconic-icon {
+ border: none !important;
+ background-color: unset !important;
+ }
+ }
+}
+
+/* Padding - Mac */
+@include OS($mac) {
+ @include _layout_root_mac;
+
+ /* context menu width */
+ #{$_placesPopupSetMenus} {
+ @include _layout_init_mac_width;
+
+ > .menu-text {
+ /* text position */
+ @include _layout_init_mac_text;
+ }
+ }
+
+ /* Checkbox menuitem, None iconic menu */
+ #{$_placesPopupSet} menuitem[checked="true"],
+ #{$_placesPopupSet} menu:not(.menu-iconic) {
+ @include _layout_init_mac_others;
+ }
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_panel.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_panel.scss
index a299aa49..2fcb4e68 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_panel.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/_panel.scss
@@ -278,7 +278,7 @@ panelMenuBookmarkThisPage[starred] {
#PanelUI-developer-tools-view .subviewbutton:nth-child(4) {
list-style-image: url("../icons/window-dev-tools.svg");
}
-/* Browser Content Toolbaox - */
+/* Browser Content Toolbox */
#appmenu-developer-tools-view .subviewbutton:nth-child(5),
#PanelUI-developer-tools-view .subviewbutton:nth-child(5) {
list-style-image: url("../icons/command-frames.svg");
@@ -371,7 +371,7 @@ panelMenuBookmarkThisPage[starred] {
}
#allTabsMenu-hiddenTabsButton {
- list-style-image: url("../icons/password-hide.svg");
+ list-style-image: url("../icons/eye-hide.svg")
}
#allTabsMenu-containerTabsView .subviewbutton:last-child {
@@ -398,6 +398,17 @@ panelMenuBookmarkThisPage[starred] {
}
}
+
+/* BMB_bookmarksToolbarPopup */
+#BMB_viewBookmarksToolbar {
+ &[data-l10n-args='{"isVisible":true}'] {
+ --menuitem-image: url("../icons/eye-hide.svg")
+ }
+ &[data-l10n-args='{"isVisible":false}'] {
+ --menuitem-image: url("../icons/eye-show.svg")
+ }
+}
+
/*= protections-popup ========================================================*/
#protections-popup-settings-button > .protections-popup-settings-icon,
#protections-popup-show-report-button > .protections-popup-show-report-icon {
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_content_area.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_content_area.scss
index 903bc436..416a09e3 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_content_area.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_content_area.scss
@@ -4,12 +4,12 @@
}
#context-viewsource-wrapLongLines {
/* checkbox */
- /* --menuitem-image: url("../icons/arrow-sort-down-lines.svg"); */
+ --menuitem-image: url("../icons/arrow-sort-down-lines.svg");
}
#context-viewsource-highlightSyntax {
/* checkbox */
- /* --menuitem-image: url("../icons/code.svg"); */
+ --menuitem-image: url("../icons/code.svg");
}
#spell-no-suggestions {
@@ -77,7 +77,7 @@
}
#context-media-loop {
/* checkbox */
- /* --menuitem-image: url("../icons/arrow-repeat-all.svg"); */
+ --menuitem-image: url("../icons/arrow-repeat-all.svg");
}
#context-leave-dom-fullscreen {
--menuitem-image: url("chrome://global/skin/media/fullscreenExitButton.svg");
@@ -97,7 +97,7 @@
}
#context-video-pictureinpicture {
/* checkbox */
- /* --menuitem-image: url("chrome://global/skin/media/picture-in-picture-open.svg"); */
+ --menuitem-image: url("chrome://global/skin/media/picture-in-picture-open.svg");
}
#context-reloadimage {
@@ -170,6 +170,9 @@
--menuitem-image: url("../icons/undo.svg");
}
#context-redo {
+ @include Option("userChrome.icon.menu.full") {
+ --menuitem-image: url("../icons/redo.svg");
+ }
}
#context-cut {
@@ -209,6 +212,7 @@
#spell-check-enabled {
/* checkbox */
+ --menuitem-image: url("../icons/text-proofing-tools.svg");
}
#spell-add-dictionaries-main {
--menuitem-image: url("../icons/book-add.svg");
@@ -239,7 +243,7 @@
/* iconic */
}
-@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
+@include NativeMenu {
#context-back {
--menuitem-image: url("chrome://browser/skin/back.svg");
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_downloads.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_downloads.scss
new file mode 100644
index 00000000..957853db
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_downloads.scss
@@ -0,0 +1,51 @@
+/*= downloadsContextMenu =====================================================*/
+.downloadPauseMenuItem {
+ --menuitem-image: url("chrome://global/skin/media/pause-fill.svg");
+}
+.downloadResumeMenuItem {
+ --menuitem-image: url("chrome://global/skin/media/play-fill.svg");
+}
+.downloadUnblockMenuItem {
+ --menuitem-image: url("../icons/checkmark-circle.svg");
+}
+.downloadUseSystemDefaultMenuItem {
+ --menuitem-image: url("chrome://browser/skin/open.svg");
+}
+.downloadAlwaysUseSystemDefaultMenuItem {
+ /* checkbox */
+ --menuitem-image: url("../icons/folder-globe.svg");
+}
+.downloadAlwaysOpenSimilarFilesMenuItem {
+ /* checkbox */
+ --menuitem-image: url("../icons/fluid.svg");
+}
+.downloadShowMenuItem {
+ --menuitem-image: url("chrome://global/skin/icons/folder.svg");
+ @include Option("userChrome.icon.library") {
+ --menuitem-image: url("../icons/folder.svg");
+ }
+}
+
+#downloadsContextMenu > menuitem {
+ &.downloadOpenReferrerMenuItem,
+ &[command="downloadsCmd_openReferrer"] {
+ --menuitem-image: url("../icons/link-square.svg");
+ }
+ &.downloadCopyLocationMenuItem,
+ &[command="downloadsCmd_copyLocation"] {
+ --menuitem-image: url("../icons/link.svg");
+ }
+}
+
+.downloadDeleteFileMenuItem {
+ --menuitem-image: url("chrome://global/skin/icons/delete.svg");
+}
+.downloadRemoveFromHistoryMenuItem {
+ --menuitem-image: url("../icons/eraser.svg");
+}
+#downloadsContextMenu > menuitem {
+ &[command="downloadsCmd_clearList"],
+ &[command="downloadsCmd_clearDownloads"] {
+ --menuitem-image: url("../icons/broom.svg");
+ }
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_others.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_others.scss
index 36973e72..2f55da56 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_others.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_others.scss
@@ -13,6 +13,7 @@
/*= autohide-context =========================================================*/
#autohide-context > menuitem[data-l10n-id="full-screen-autohide"] {
/* checkbox */
+ --menuitem-image: url("../icons/eye-tracking-off.svg");
}
#autohide-context > menuitem[data-l10n-id="full-screen-exit"] {
@@ -25,11 +26,13 @@
}
/*= pageActionContextMenu ====================================================*/
-.pageActionContextMenuItem.extensionPinned.extensionUnpinned.manageExtensionItem {
- --menuitem-image: url("chrome://global/skin/icons/settings.svg");
-}
-.pageActionContextMenuItem.extensionPinned.extensionUnpinned.removeExtensionItem {
- --menuitem-image: url("chrome://global/skin/icons/delete.svg");
+.pageActionContextMenuItem.extensionPinned.extensionUnpinned {
+ &.manageExtensionItem {
+ --menuitem-image: url("chrome://global/skin/icons/settings.svg");
+ }
+ .removeExtensionItem {
+ --menuitem-image: url("chrome://global/skin/icons/delete.svg");
+ }
}
/*= customizationPanelItemContextMenu ========================================*/
@@ -56,47 +59,7 @@
/*= downloads-button-autohide-panel ==========================================*/
#downloads-button-autohide-checkbox {
/* checkbox */
-}
-
-/*= downloadsContextMenu =====================================================*/
-.downloadPauseMenuItem {
- --menuitem-image: url("chrome://global/skin/media/pause-fill.svg");
-}
-.downloadResumeMenuItem {
- --menuitem-image: url("chrome://global/skin/media/play-fill.svg");
-}
-.downloadUnblockMenuItem {
- --menuitem-image: url("../icons/checkmark-circle.svg");
-}
-.downloadUseSystemDefaultMenuItem {
- --menuitem-image: url("chrome://browser/skin/open.svg");
-}
-.downloadAlwaysUseSystemDefaultMenuItem {
- /* checkbox */
-}
-.downloadShowMenuItem {
- --menuitem-image: url("chrome://global/skin/icons/folder.svg");
- @include Option("userChrome.icon.library") {
- --menuitem-image: url("../icons/folder.svg");
- }
-}
-
-#downloadsContextMenu > menuitem[command="downloadsCmd_openReferrer"] {
- --menuitem-image: url("../icons/link-square.svg");
-}
-#downloadsContextMenu > menuitem[command="downloadsCmd_copyLocation"] {
- --menuitem-image: url("../icons/link.svg");
-}
-
-.downloadDeleteFileMenuItem {
- --menuitem-image: url("chrome://global/skin/icons/delete.svg");
-}
-.downloadRemoveFromHistoryMenuItem {
- --menuitem-image: url("../icons/eraser.svg");
-}
-#downloadsContextMenu > menuitem[command="downloadsCmd_clearList"],
-#downloadsContextMenu > menuitem[command="downloadsCmd_clearDownloads"] {
- --menuitem-image: url("../icons/broom.svg");
+ --menuitem-image: url("../icons/eye-tracking-off.svg");
}
/*= SyncedTabsSidebarContext =================================================*/
@@ -160,6 +123,9 @@
--menuitem-image: url("../icons/undo.svg");
}
#urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_redo"] {
+ @include Option("userChrome.icon.menu.full") {
+ --menuitem-image: url("../icons/redo.svg");
+ }
}
#urlbar-input-container .textbox-contextmenu menuitem[cmd="cmd_cut"] {
@@ -186,6 +152,9 @@
--menuitem-image: url("../icons/undo.svg");
}
.textbox-contextmenu > menuitem[data-l10n-id="text-action-redo"] {
+ @include Option("userChrome.icon.menu.full") {
+ --menuitem-image: url("../icons/redo.svg");
+ }
}
.textbox-contextmenu > menuitem[data-l10n-id="text-action-cut"] {
@@ -212,37 +181,26 @@ menuitem.searchbar-clear-history {
}
/*= context_sendTabToDevicePopupMenu =========================================*/
-menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="phone"] {
- --menuitem-image: url("chrome://browser/skin/device-phone.svg");
-}
-
-menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="tablet"] {
- --menuitem-image: url("chrome://browser/skin/device-tablet.svg");
-}
-
-menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="desktop"] {
- --menuitem-image: url("chrome://browser/skin/device-desktop.svg");
-}
-
-menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="tv"] {
- --menuitem-image: url("chrome://browser/skin/device-tv.svg");
-}
-
-menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType="vr"] {
- --menuitem-image: url("chrome://browser/skin/device-vr.svg");
-}
-
-menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target[clientType=""] {
- --menuitem-image: url("../icons/send-to-device.svg");
-}
-
-menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup)
- > .sync-menuitem.sendtab-target:not([clientType]) {
- --menuitem-image: url("chrome://global/skin/icons/settings.svg");
+.sync-menuitem.sendtab-target {
+ &[clientType="phone"] {
+ --menuitem-image: url("chrome://browser/skin/device-phone.svg");
+ }
+ &[clientType="tablet"] {
+ --menuitem-image: url("chrome://browser/skin/device-tablet.svg");
+ }
+ &[clientType="desktop"] {
+ --menuitem-image: url("chrome://browser/skin/device-desktop.svg");
+ }
+ &[clientType="tv"] {
+ --menuitem-image: url("chrome://browser/skin/device-tv.svg");
+ }
+ &[clientType="vr"] {
+ --menuitem-image: url("chrome://browser/skin/device-vr.svg");
+ }
+ &[clientType=""] {
+ --menuitem-image: url("../icons/send-to-device.svg");
+ }
+ &:not([clientType]) {
+ --menuitem-image: url("chrome://global/skin/icons/settings.svg");
+ }
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_place.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_place.scss
index 6310fa21..b6e6d56f 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_place.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_place.scss
@@ -11,6 +11,9 @@
#placesContext_openLinks\:tabs {
--menuitem-image: url("chrome://browser/skin/new-tab.svg");
}
+#placesContext_open\:newcontainertab {
+ --menuitem-image: url("../icons/container-openin-16.svg");
+}
#placesContext_open\:newwindow {
--menuitem-image: url("chrome://browser/skin/window.svg");
}
@@ -49,6 +52,7 @@
#placesContext_new\:bookmark {
--menuitem-image: url("chrome://browser/skin/bookmark.svg");
}
+#placesContext_showInFolder,
#placesContext_new\:folder {
--menuitem-image: url("chrome://global/skin/icons/folder.svg");
@include Option("userChrome.icon.library") {
@@ -68,7 +72,7 @@
}
#show-other-bookmarks_PersonalToolbar {
/* checkbox */
- /* --menuitem-image: url("../icons/star-line-horizontal.svg"); */
+ --menuitem-image: url("../icons/star-line-horizontal.svg");
}
#placesContext_showAllBookmarks {
--menuitem-image: url("chrome://browser/skin/bookmark-star-on-tray.svg");
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_tab_toolbar.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_tab_toolbar.scss
index 112584f0..b82fe302 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_tab_toolbar.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/icons/context_menu/_tab_toolbar.scss
@@ -40,10 +40,16 @@
}
#context_sendTabToDevice:is([disabled="true"]) + #context_shareTabURL, /* Legacy */
- #context_sendTabToDevice:is([disabled="true"]) + menuitem.share-tab-url-item {
+#context_sendTabToDevice:is([disabled="true"]) + menuitem.share-tab-url-item {
/* At windows */
--menuitem-image: url("../icons/share.svg");
}
+@include Option("userChrome.icon.menu.full") {
+ #context_shareTabURL, /* Legacy */
+ menuitem.share-tab-url-item {
+ --menuitem-image: url("../icons/share.svg");
+ }
+}
#context_reopenInContainer {
--menuitem-image: url("../icons/container-openin-16.svg");
}
@@ -85,12 +91,18 @@
.customize-context-moveToPanel {
--menuitem-image: url("chrome://browser/skin/pin-12.svg");
}
-.toolbar-context-autohide-downloads-button {
- --menuitem-image: url("../icons/password-hide.svg");
+#toolbar-context-autohide-downloads-button {
+ /* checkbox */
+ --menuitem-image: url("../icons/eye-tracking-off.svg");
}
.customize-context-removeFromToolbar {
--menuitem-image: url("chrome://global/skin/icons/delete.svg");
}
+
+#toolbar-context-always-open-downloads-panel {
+ /* checkbox */
+ --menuitem-image: url("../icons/drawer-arrow-download.svg");
+}
#toolbar-context-openANewTab {
--menuitem-image: url("chrome://browser/skin/new-tab.svg");
}
@@ -112,7 +124,7 @@
#toggle_toolbar-menubar {
/* checkbox */
- /* --menuitem-image: url("../icons/calendar-agenda.svg"); */
+ --menuitem-image: url("../icons/calendar-agenda.svg");
}
#toggle_PersonalToolbar {
/* Also placeContext */
@@ -122,3 +134,11 @@
menuitem.viewCustomizeToolbar {
--menuitem-image: url("chrome://browser/skin/customize.svg");
}
+
+.fullscreen-context-autohide {
+ /* checkbox */
+ --menuitem-image: url("../icons/eye-tracking-off.svg");
+}
+#toolbar-context-menu > menuitem[data-l10n-id="full-screen-exit"] {
+ --menuitem-image: url("chrome://browser/skin/fullscreen-exit.svg");
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/leptonChrome.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/leptonChrome.scss
index 97014227..353bd454 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/leptonChrome.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/leptonChrome.scss
@@ -2,6 +2,8 @@
@use "utils/option" as *;
@use "utils/color_scheme" as *;
@use "utils/theme" as *;
+@use "utils/native_menu" as *;
+@use "utils/proton_elements" as Proton;
@use "sass:selector";
@namespace xul "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/leptonContent.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/leptonContent.scss
index 7be87424..cc96c6da 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/leptonContent.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/leptonContent.scss
@@ -1,6 +1,9 @@
@use "utils/os" as *;
@use "utils/option" as *;
@use "utils/color_scheme" as *;
+@use "utils/native_menu" as *;
+@use "utils/proton_elements" as Proton;
+@use "sass:selector";
@namespace xul url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");
@@ -29,3 +32,11 @@
@include Option("userContent.page.proton") {
@import "contents/proton_contents";
}
+
+/** Menu - Icons Layout *******************************************************/
+@include Option("userChrome.icon.menu") {
+ @import "contents/context_menu";
+}
+
+/** Download Panel ************************************************************/
+@import "contents/downloads";
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/library/_chrome.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_chrome.scss
index ef6931b0..9679e20d 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/library/_chrome.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_chrome.scss
@@ -1,7 +1,4 @@
-@import "standard_folder";
-@import "inbox";
-@import "default_override";
-@import "default_open";
+@import "folder_icons";
@-moz-document url("chrome://browser/content/places/places.xhtml")
{
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/library/_contents.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_contents.scss
index 0e1dda31..5987c71f 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/library/_contents.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_contents.scss
@@ -2,18 +2,10 @@
{
/** Library - Icons Replace *************************************************/
@include Option("userChrome.icon.library") {
- @import "standard_folder";
- @import "inbox";
- @import "default_override";
- @import "default_open";
+ @import "folder_icons";
@import "menubar";
}
- /*= Context Menu ===========================================================*/
- @include Option("userChrome.icon.context_menu") {
- @import "contents_menu";
- }
-
@include OS($linux) {
/*= Layout Fixes =========================================================*/
menupopup menu {
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/library/_folder_icons.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_folder_icons.scss
new file mode 100644
index 00000000..9b33496d
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_folder_icons.scss
@@ -0,0 +1,131 @@
+/*= Standard Folder - More Visible ===========================================*/
+/* on Toolbar and Menus */
+:-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu) .bookmark-item[container="true"]:not([query="true"], [tagContainer], [dayContainer]),
+/* in Sidebar, Library, Add/Edit Bookmark dialog */
+/* https://github.com/rillian/firefox/blob/1f88437d263f56bdede4f20f69ba9c7b62f57001/layout/style/nsCSSAnonBoxList.h#L85-L98 */
+/* Need to overide!!, can not use :not() */
+:-moz-any(#bookmarks-view, #historyTree, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, container),
+#editBMPanel_folderMenuList:not([selectedGuid="toolbar_____"], [selectedGuid="menu________"]),
+#editBMPanel_folderMenuList .folder-icon:not([id]),
+/* Download Popup */
+.downloadIconShow > .button-box > .button-icon {
+ list-style-image: url("../icons/folder.svg") !important;
+}
+
+/* Standard Folder - Open */
+:-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu)
+ .bookmark-item[container="true"]:not([query="true"], [tagContainer], [dayContainer])[open="true"],
+:-moz-any(#bookmarks-view, #historyTree, #editBMPanel_folderTree, #placesList, #placeContent)
+ treechildren::-moz-tree-image(title, container, open) {
+ list-style-image: url("../icons/folder-open.svg") !important;
+}
+
+/*= Other Folder - Inbox Icon ================================================*/
+/* on Menus */
+#PlacesToolbar #OtherBookmarks,
+ #BMB_bookmarksPopup #BMB_unsortedBookmarks,
+ #bookmarksMenuPopup #menu_unsortedBookmarks,
+ /* Other Bookmarks -- in Sidebar, Library, Add/Edit Bookmark dialog */
+ :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, OrganizerQuery_UnfiledBookmarks),
+ :-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, queryFolder_unfiled_____),
+ #editBMPanel_unfiledRootItem,
+ #editBMPanel_folderMenuList[selectedGuid="unfiled_____"] {
+ list-style-image: url("../icons/mail-inbox-all.svg") !important;
+}
+
+/* Other Folder - Open */
+#PlacesToolbar #OtherBookmarks[open="true"],
+#BMB_bookmarksPopup #BMB_unsortedBookmarks[open="true"],
+#bookmarksMenuPopup #menu_unsortedBookmarks[open="true"],
+:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent)
+ treechildren::-moz-tree-image(container, open, OrganizerQuery_UnfiledBookmarks),
+:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent)
+ treechildren::-moz-tree-image(container, open, queryFolder_unfiled_____) {
+ list-style-image: url("../icons/mail-inbox.svg") !important;
+}
+
+/*= Default Icon - Override ===================================================*/
+/* https://github.com/mozilla/gecko-dev/blob/master/browser/themes/shared/places/tree-icons.css */
+
+/* Query */
+:-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query) {
+ list-style-image: url("chrome://browser/skin/places/folder-smart.svg") !important;
+}
+
+/* History */
+:-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query, dayContainer),
+:-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_history____v) {
+ list-style-image: url("chrome://browser/skin/history.svg") !important;
+}
+
+/* Downloads */
+:-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_downloads__v) {
+ list-style-image: url("chrome://browser/skin/downloads/downloads.svg") !important;
+}
+
+/* Tag */
+:-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(title, query, tagContainer),
+:-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_tags_______v) {
+ list-style-image: url("chrome://browser/skin/places/tag.svg") !important;
+}
+
+/* Boomark */
+:-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, OrganizerQuery_allbms_____v) {
+ list-style-image: url("chrome://browser/skin/bookmark.svg") !important;
+}
+
+/* Bookmark Toolbar */
+#BMB_bookmarksPopup #BMB_bookmarksToolbar, /* Original: Default folder icon */
+#bookmarksMenuPopup #bookmarksToolbarFolderMenu, /* Original: Default folder icon */
+:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent) treechildren::-moz-tree-image(container, queryFolder_toolbar_____) {
+ list-style-image: url("chrome://browser/skin/places/bookmarksToolbar.svg") !important;
+}
+
+/* Bookmark Menu */
+:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent)
+ treechildren::-moz-tree-image(container, queryFolder_menu________) {
+ list-style-image: url("chrome://browser/skin/places/bookmarksMenu.svg") !important;
+}
+
+/*= Default Icon - Open ======================================================*/
+/* Query */
+:-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu)
+ .bookmark-item[container="true"][query="true"]:not([tagContainer])[open="true"]
+ > .menu-iconic-left
+ > .menu-iconic-icon {
+ transform: rotate(15deg) !important;
+}
+
+/* History */
+:-moz-any(#historyTree, #placesList, #placeContent) treechildren::-moz-tree-image(title, query, open, dayContainer),
+:-moz-any(#historyTree, #placesList, #placeContent)
+ treechildren::-moz-tree-image(query, open, OrganizerQuery_history____v) {
+ list-style-image: url("../icons/history-reverse.svg") !important;
+}
+
+/* Tag */
+:-moz-any(#PlacesToolbar, #BMB_bookmarksPopup, #bookmarksMenu)
+ .bookmark-item[container="true"][tagContainer="true"][open="true"],
+:-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(title, query, open, tagContainer),
+:-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, open, OrganizerQuery_tags_______v) {
+ list-style-image: url("../icons/tag-open.svg") !important;
+}
+
+/* Boomark */
+:-moz-any(#placesList, #placeContent) treechildren::-moz-tree-image(query, open, OrganizerQuery_allbms_____v) {
+ list-style-image: url("chrome://browser/skin/bookmark-hollow.svg") !important;
+}
+
+/* Bookmark Toolbar */
+#BMB_bookmarksPopup #BMB_bookmarksToolbar[open="true"],
+#bookmarksMenuPopup #bookmarksToolbarFolderMenu[open="true"],
+:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent)
+ treechildren::-moz-tree-image(container, open, queryFolder_toolbar_____) {
+ list-style-image: url("../icons/bookmarksToolbar-open.svg") !important;
+}
+
+/* Bookmark Menu */
+:-moz-any(#bookmarks-view, #editBMPanel_folderTree, #placesList, #placeContent)
+ treechildren::-moz-tree-image(container, open, queryFolder_menu________) {
+ list-style-image: url("../icons/bookmarksMenu-open.svg") !important; /* or bookmarksMenu-open2.svg" */
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/library/_proton.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_proton.scss
index 4d4b05cc..86ba4366 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/library/_proton.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_proton.scss
@@ -21,10 +21,8 @@
--organizer-toolbar-field-focus-border-color: var(--organizer-outline-color);
--organizer-toolbar-field-focus-box-shadow: unset;
--organizer-pane-field-border-color: ThreeDShadow;
-}
-@include NotContrast {
- :root {
+ @include NotContrast {
--organizer-color: var(--in-content-page-color);
--organizer-deemphasized-color: var(--in-content-deemphasized-text);
@@ -51,10 +49,8 @@
);
--organizer-toolbar-field-focus-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.23);
--organizer-pane-field-border-color: color-mix(in srgb, currentColor 41%, transparent);
- }
- @include Dark {
- :root {
+ @include Dark {
--organizer-color: rgb(251, 251, 254);
--organizer-deemphasized-color: rgb(191, 191, 201);
@@ -80,25 +76,23 @@
border-bottom: 1px solid var(--organizer-border-color) !important;
padding: 4px !important;
padding-inline-end: 6px !important;
-}
-#placesToolbar > toolbarbutton {
- appearance: none !important;
- padding: 5px !important;
- border-radius: 4px !important;
-}
+ > toolbarbutton {
+ appearance: none !important;
+ padding: 5px !important;
+ border-radius: 4px !important;
-#placesToolbar > toolbarbutton[disabled] {
- opacity: 0.6 !important;
-}
-
-#placesToolbar > toolbarbutton:not([disabled]):hover {
- background-color: var(--organizer-hover-background) !important;
- color: var(--organizer-hover-color) !important;
-}
-
-#placesToolbar > toolbarbutton:not([disabled]):hover:active {
- background-color: var(--organizer-selected-background) !important;
+ &[disabled] {
+ opacity: 0.6 !important;
+ }
+ &:not([disabled]):hover {
+ background-color: var(--organizer-hover-background) !important;
+ color: var(--organizer-hover-color) !important;
+ &:active {
+ background-color: var(--organizer-selected-background) !important;
+ }
+ }
+ }
}
#placesToolbar > toolbarbutton > .toolbarbutton-icon,
@@ -110,32 +104,30 @@
#placesMenu {
margin-inline-start: 6px !important;
-}
-#placesMenu > menu {
- appearance: none !important;
- color: var(--organizer-color) !important;
- border-radius: 4px !important;
- padding-block: 5px !important;
- padding-inline-start: 5px !important;
- margin-inline-end: 2px !important;
-}
+ > menu {
+ appearance: none !important;
+ color: var(--organizer-color) !important;
+ border-radius: 4px !important;
+ padding-block: 5px !important;
+ padding-inline-start: 5px !important;
+ margin-inline-end: 2px !important;
-#placesMenu > menu[_moz-menuactive="true"],
-#placesMenu > menu:hover {
- background-color: var(--organizer-hover-background) !important;
- color: var(--organizer-hover-color) !important;
-}
-
-#placesMenu > menu:hover:active,
-#placesMenu > menu[open] {
- background-color: var(--organizer-selected-background) !important;
- color: var(--organizer-selected-color) !important;
-}
-
-#placesMenu > menu > .menubar-text {
- margin-block: 0 !important; /* override menu.css */
- padding-inline-end: 4px !important;
+ &[_moz-menuactive="true"],
+ &:hover {
+ background-color: var(--organizer-hover-background) !important;
+ color: var(--organizer-hover-color) !important;
+ }
+ &:hover:active,
+ &[open] {
+ background-color: var(--organizer-selected-background) !important;
+ color: var(--organizer-selected-color) !important;
+ }
+ > .menubar-text {
+ margin-block: 0 !important; /* override menu.css */
+ padding-inline-end: 4px !important;
+ }
+ }
}
/*- Search Bar & Input ---------------------------------------------------*/
@@ -221,11 +213,10 @@ treecol:not([hideheader="true"], [sortable="false"]):hover,
treecolpicker:hover {
background-color: var(--organizer-hover-background) !important;
color: var(--organizer-color) !important;
-}
-treecol:not([hideheader="true"], [sortable="false"]):hover:active,
-treecolpicker:hover:active {
- background-color: var(--organizer-selected-background) !important;
+ &:active {
+ background-color: var(--organizer-selected-background) !important;
+ }
}
treecol:not([hideheader="true"], :first-child),
@@ -250,43 +241,40 @@ treecol[sortDirection]:not([hideheader="true"]) > xul|*.treecol-sortdirection {
height: 18px !important;
}
-treechildren::-moz-tree-row {
- background-color: transparent !important;
-}
+treechildren {
+ &::-moz-tree-row {
+ background-color: transparent !important;
+ }
+ &::-moz-tree-row(hover) {
+ background-color: var(--organizer-hover-background) !important;
+ }
+ &::-moz-tree-row(selected) {
+ background-color: var(--organizer-selected-background) !important;
+ color: var(--organizer-selected-color) !important;
+ border: 1px solid transparent !important;
+ }
-treechildren::-moz-tree-row(hover) {
- background-color: var(--organizer-hover-background) !important;
-}
+ &::-moz-tree-image(hover),
+ &::-moz-tree-twisty(hover),
+ &::-moz-tree-cell-text(hover) {
+ color: var(--organizer-hover-color) !important;
+ }
+ &::-moz-tree-image(selected),
+ &::-moz-tree-twisty(selected),
+ &::-moz-tree-cell-text(selected) {
+ color: var(--organizer-selected-color) !important;
+ }
-treechildren::-moz-tree-row(selected) {
- background-color: var(--organizer-selected-background) !important;
- color: var(--organizer-selected-color) !important;
- border: 1px solid transparent !important;
-}
-
-treechildren::-moz-tree-image(hover),
-treechildren::-moz-tree-twisty(hover),
-treechildren::-moz-tree-cell-text(hover) {
- color: var(--organizer-hover-color) !important;
-}
-
-treechildren::-moz-tree-image(selected),
-treechildren::-moz-tree-twisty(selected),
-treechildren::-moz-tree-cell-text(selected) {
- color: var(--organizer-selected-color) !important;
-}
-
-treechildren::-moz-tree-separator {
- height: 1px !important;
- border-color: var(--organizer-separator-color) !important;
-}
-
-treechildren::-moz-tree-separator(hover) {
- border-color: var(--organizer-hover-color) !important;
-}
-
-treechildren::-moz-tree-separator(selected) {
- border-color: var(--organizer-selected-color) !important;
+ &::-moz-tree-separator {
+ height: 1px !important;
+ border-color: var(--organizer-separator-color) !important;
+ }
+ &::-moz-tree-separator(hover) {
+ border-color: var(--organizer-hover-color) !important;
+ }
+ &::-moz-tree-separator(selected) {
+ border-color: var(--organizer-selected-color) !important;
+ }
}
/*- Info Box -------------------------------------------------------------*/
@@ -308,36 +296,35 @@ treechildren::-moz-tree-separator(selected) {
border-radius: 4px !important;
color: var(--organizer-color) !important;
background-color: var(--organizer-content-background) !important;
- list-style-image: url("chrome://global/skin/icons/arrow-down-12.svg");
-moz-context-properties: fill !important;
fill: currentColor !important;
+
+ &:hover {
+ background-color: var(--organizer-hover-background) !important;
+ color: var(--organizer-hover-color) !important;
+
+ &:active {
+ background-color: var(--organizer-selected-background) !important;
+ color: var(--organizer-selected-color) !important;
+ }
+ }
+ &:focus-visible {
+ outline: 2px solid var(--organizer-outline-color) !important;
+ outline-offset: -1px !important;
+ }
+
+ > .button-box {
+ padding: 0 !important;
+ }
}
-#editBookmarkPanelRows .expander-up:hover,
-#editBookmarkPanelRows .expander-down:hover {
- background-color: var(--organizer-hover-background) !important;
- color: var(--organizer-hover-color) !important;
-}
-
-#editBookmarkPanelRows .expander-up:hover:active,
-#editBookmarkPanelRows .expander-down:hover:active {
- background-color: var(--organizer-selected-background) !important;
- color: var(--organizer-selected-color) !important;
-}
-
-#editBookmarkPanelRows .expander-up:focus-visible,
-#editBookmarkPanelRows .expander-down:focus-visible {
- outline: 2px solid var(--organizer-outline-color) !important;
- outline-offset: -1px !important;
-}
-
-#editBookmarkPanelRows .expander-up {
- list-style-image: url("chrome://global/skin/icons/arrow-up-12.svg");
-}
-
-#editBookmarkPanelRows .expander-up > .button-box,
-#editBookmarkPanelRows .expander-down > .button-box {
- padding: 0 !important;
+#editBookmarkPanelRows {
+ .expander-up {
+ list-style-image: url("chrome://global/skin/icons/arrow-up-12.svg");
+ }
+ .expander-down {
+ list-style-image: url("chrome://global/skin/icons/arrow-down-12.svg");
+ }
}
#places input {
@@ -347,15 +334,14 @@ treechildren::-moz-tree-separator(selected) {
color: var(--organizer-color) !important;
min-height: 20px !important;
padding-inline: 4px !important;
-}
-#places input:focus {
- outline: 2px solid var(--organizer-outline-color) !important;
- outline-offset: -1px !important;
-}
-
-#places input:not(:read-write):focus {
- outline: none !important;
+ &:focus {
+ outline: 2px solid var(--organizer-outline-color) !important;
+ outline-offset: -1px !important;
+ }
+ &:not(:read-write):focus {
+ outline: none !important;
+ }
}
.caption-label {
@@ -369,18 +355,17 @@ treechildren::-moz-tree-separator(selected) {
background-color: var(--organizer-content-background) !important;
border: 1px solid var(--organizer-border-color) !important;
border-radius: 4px !important;
-}
-#editBMPanel_tagsSelectorRow > richlistbox > richlistitem {
- border: 1px solid transparent !important;
-}
+ > richlistitem {
+ border: 1px solid transparent !important;
-#editBMPanel_tagsSelectorRow > richlistbox > richlistitem:hover {
- background-color: var(--organizer-hover-background) !important;
- color: var(--organizer-hover-color) !important;
-}
-
-#editBMPanel_tagsSelectorRow > richlistbox > richlistitem[selected] {
- background-color: var(--organizer-selected-background) !important;
- color: var(--organizer-selected-color) !important;
+ &:hover {
+ background-color: var(--organizer-hover-background) !important;
+ color: var(--organizer-hover-color) !important;
+ }
+ &[selected] {
+ background-color: var(--organizer-selected-background) !important;
+ color: var(--organizer-selected-color) !important;
+ }
+ }
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/library/_proton_contents.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_proton_contents.scss
index dc62bbb9..9753ce89 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/library/_proton_contents.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/library/_proton_contents.scss
@@ -1,173 +1,102 @@
+$iconSelector: "> .menu-iconic-left > .menu-iconic-icon";
+$checkedIconSelector: "> .menu-iconic-left[checked=\"true\"] > .menu-iconic-icon";
+
/*- Radio Button ---------------------------------------------------------*/
menuitem[type="radio"] {
- /* margin-inline-start: 0 !important; */
- appearance: none !important;
-}
+ @include Proton.RadioGlobal;
-menuitem[type="radio"] > .menu-iconic-left > .menu-iconic-icon {
- appearance: none !important;
- width: 16px !important;
- height: 16px !important;
- padding: 0 !important;
- border: 1px solid var(--in-content-box-border-color) !important;
- border-radius: 100% !important;
- margin-block: 2px !important; /* extend the vertical clicktarget */
- margin-inline: 0 6px !important;
- background-color: var(--in-content-button-background) !important;
- background-position: center !important;
- flex-shrink: 0 !important; /* avoid shrinking inside flex container */
-}
+ #{$iconSelector} {
+ @include Proton.RadioIcon;
+ }
+ #{$checkedIconSelector} {
+ @include Proton.RadioCheckedIcon;
+ }
-menuitem[type="radio"]:not([disabled="true"]):hover > .menu-iconic-left > .menu-iconic-icon {
- background-color: var(--in-content-button-background-hover) !important;
- color: var(--in-content-button-text-color-hover) !important;
-}
+ &:not([disabled="true"]):hover {
+ #{$iconSelector} {
+ @include Proton.RadioIconHover;
+ }
+ &:active #{$iconSelector} {
+ @include Proton.RadioIconActive;
+ }
+ }
-menuitem[type="radio"]:not([disabled="true"]):hover:active > .menu-iconic-left > .menu-iconic-icon {
- background-color: var(--in-content-button-background-active) !important;
-}
+ &:not([disabled="true"])[checked="true"]:hover {
+ #{$iconSelector} {
+ @include Proton.RadioCheckedIconHover;
+ }
+ &:active #{$iconSelector} {
+ @include Proton.RadioCheckedIconActive;
+ }
+ }
-menuitem[type="radio"] > .menu-iconic-left[checked="true"] > .menu-iconic-icon {
- -moz-context-properties: fill !important;
- fill: currentColor !important;
- color: var(--in-content-primary-button-text-color) !important;
- background-color: var(--in-content-primary-button-background) !important;
- background-image: url("chrome://global/skin/icons/radio.svg") !important;
- border-color: transparent !important;
-
- /* Style the button also when printing with "Print Backgrounds" unchecked */
- color-adjust: exact !important;
-}
-
-menuitem[type="radio"]:not([disabled="true"])[checked="true"]:hover > .menu-iconic-left > .menu-iconic-icon {
- background-color: var(--in-content-primary-button-background-hover) !important;
- color: var(--in-content-primary-button-text-color-hover) !important;
-}
-
-menuitem[type="radio"]:not([disabled="true"])[checked="true"]:hover:active > .menu-iconic-left > .menu-iconic-icon {
- background-color: var(--in-content-primary-button-background-active) !important;
-}
-
-menuitem[type="radio"] > .menu-iconic-text {
- margin-inline: 0 8px !important;
- padding-inline-start: 0 !important;
+ > .menu-iconic-text {
+ @include Proton.RadioLabel;
+ }
}
/* Disabled checkboxes, radios and labels */
menuitem[type="radio"][disabled="true"],
menuitem[type="checkbox"][disabled="true"] {
- color: inherit !important;
-}
-
-menuitem[type="radio"][disabled="true"],
-menuitem[type="checkbox"][disabled="true"] {
- opacity: 0.5 !important;
+ @include Proton.DisabledMenuItem;
}
/*- Check Box ------------------------------------------------------------*/
/* From checkbox.css */
menuitem[type="checkbox"] {
- appearance: none !important;
- -moz-box-align: center !important;
- margin: 0px 2px !important;
-}
+ @include Proton.CheckboxGlobal(true);
-menuitem[type="checkbox"] > .menu-iconic-left > .menu-iconic-icon {
- margin-inline-end: 2px !important;
-}
-menuitem[type="checkbox"] > .menu-iconic-text {
- margin: 1px 0 !important;
-}
-
-menuitem[type="checkbox"][disabled="true"] {
- opacity: 0.4 !important;
-}
-
-menuitem[type="checkbox"] > .menu-iconic-left > .menu-iconic-icon {
- appearance: none !important;
- color: var(--checkbox-border-color, ThreeDDarkShadow) !important;
- background-color: var(--checkbox-unchecked-bgcolor, Field) !important;
- border: 1px solid currentColor !important;
- border-radius: 2px !important;
- margin-inline-end: 6px !important;
-}
-
-menuitem[type="checkbox"] > .menu-iconic-left > .menu-iconic-icon {
- height: 16px !important;
- width: 16px !important;
-}
-
-menuitem[type="checkbox"]:not([disabled="true"]):hover > .menu-iconic-left > .menu-iconic-icon {
- background-color: var(
- --checkbox-unchecked-hover-bgcolor,
- color-mix(in srgb, -moz-accent-color 4%, Field)
- ) !important;
-}
-
-menuitem[type="checkbox"]:not([disabled="true"]):hover:active > .menu-iconic-left > .menu-iconic-icon {
- background-color: var(
- --checkbox-unchecked-active-bgcolor,
- color-mix(in srgb, -moz-accent-color 8%, Field)
- ) !important;
-}
-
-menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] > .menu-iconic-icon {
- border-color: var(--checkbox-checked-border-color, transparent) !important;
- background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important;
- background-image: url("chrome://global/skin/icons/check.svg") !important;
- background-position: center !important;
- background-repeat: no-repeat !important;
- -moz-context-properties: fill !important;
- fill: currentColor !important;
- color: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
- /* Style the button also when printing with "Print Backgrounds" unchecked */
- color-adjust: exact !important;
-}
-
-menuitem[type="checkbox"]:not([disabled="true"]):hover > .menu-iconic-left[checked="true"] > .menu-iconic-icon {
- background-color: var(
- --checkbox-checked-hover-bgcolor,
- color-mix(in srgb, currentColor 12.5%, -moz-accent-color)
- ) !important;
-}
-
-menuitem[type="checkbox"]:not([disabled="true"]):hover:active
- > .menu-iconic-left[checked="true"]
- > .menu-iconic-icon {
- background-color: var(
- --checkbox-checked-active-bgcolor,
- color-mix(in srgb, currentColor 25%, -moz-accent-color)
- ) !important;
-}
-
-menuitem[type="checkbox"]:focus > .menu-iconic-left > .menu-iconic-icon {
- outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important;
- outline-offset: var(--focus-outline-offset, 2px) !important;
-}
-
-@include Contrast {
- 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: var(--checkbox-checked-border-color, color-mix(in srgb, -moz-accent-color 4%, Field)) !important;
+ #{$iconSelector} {
+ @include Proton.CheckboxIcon;
+ }
+ #{$checkedIconSelector} {
+ @include Proton.CheckboxCheckedIcon;
}
- menuitem[type="checkbox"] > .menu-iconic-left[checked="true"] {
- color: var(--checkbox-checked-border-color, currentColor) !important;
- fill: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
+ &:not([disabled="true"]):hover {
+ #{$iconSelector} {
+ @include Proton.CheckboxIconHover;
+ }
+ &:active #{$iconSelector} {
+ @include Proton.CheckboxIconActive;
+ }
+
+ #{$checkedIconSelector} {
+ @include Proton.CheckboxCheckedIconHover;
+ }
+ &:active #{$checkedIconSelector} {
+ @include Proton.CheckboxCheckedIconActive;
+ }
}
- menuitem[type="checkbox"]:not([disabled="true"]):hover:active
- > .menu-iconic-left[checked="true"]
- > .menu-iconic-icon,
- menuitem[type="checkbox"]:not([disabled="true"]):hover > .menu-iconic-left[checked="true"] > .menu-iconic-icon {
- color: var(--checkbox-checked-border-color-hover, -moz-accent-color-foreground) !important;
- fill: var(--checkbox-checked-border-color-hover, -moz-accent-color-foreground) !important;
+ &:focus #{$iconSelector} {
+ @include Proton.CheckboxFocusRing;
}
-}
-/* From common.css */
-menuitem[type="checkbox"] > .menu-iconic-left > .menu-iconic-icon {
- margin-block: 2px !important;
+ @include Contrast {
+ &:not([disabled="true"]) #{$iconSelector} {
+ @include Proton.CheckboxIconHoverContrast;
+ }
+
+ > .menu-iconic-left[checked="true"] {
+ @include Proton.CheckboxCheckedIconContrast;
+ }
+
+ &:not([disabled="true"]):hover:active,
+ &:not([disabled="true"]):hover {
+ #{$checkedIconSelector} {
+ @include Proton.CheckboxCheckedIconHoverContrast;
+ }
+ }
+ }
+
+ > .menu-iconic-text {
+ @include Proton.ChexboxLabel;
+ }
+
+ &[disabled="true"] {
+ @include Proton.DisabledChexbox;
+ }
}
/*- Menu Separtor --------------------------------------------------------*/
@@ -175,8 +104,10 @@ menuseparator {
appearance: none !important;
min-width: 2px;
min-height: 0;
+
border-top: 1px solid var(--in-content-box-border-color, ThreeDDarkShadow);
border-bottom: none;
- margin: var(--panel-separator-margin, 6px);
+
padding: 0;
+ margin: var(--panel-separator-margin, 6px);
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/padding/_drag_space.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/padding/_drag_space.scss
index 76026226..2cfa38eb 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/padding/_drag_space.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/padding/_drag_space.scss
@@ -4,7 +4,8 @@
--space-above-tabbar: 8px; /* If the option is not specified, it is equivalent to 0px. */
}
-@mixin dragSpaceHeight {
+//-- Mixin ---------------------------------------------------------------------
+@mixin _dragSpaceHeight {
:root[tabsintitlebar][sizemode="normal"] #toolbar-menubar[autohide="true"] {
@content;
}
@@ -14,7 +15,7 @@
}
}
}
-@mixin dragSpacePadding {
+@mixin _dragSpacePadding {
/* Add extra space to titlebar for dragging */
:root[sizemode="normal"][chromehidden~="menubar"] #TabsToolbar > .toolbar-items,
:root[sizemode="normal"] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar > .toolbar-items {
@@ -28,13 +29,15 @@
}
}
+//------------------------------------------------------------------------------
+
@include OS($win10) {
- @include dragSpaceHeight {
+ @include _dragSpaceHeight {
height: calc(var(--tab-min-height) + var(--space-above-tabbar) - var(--tabs-navbar-shadow-size));
}
}
@include OS($win7, $win8, $linux) {
- @include dragSpaceHeight {
+ @include _dragSpaceHeight {
height: calc(var(--tab-min-height) + var(--space-above-tabbar));
}
}
@@ -46,12 +49,12 @@
}
@include OS($win7) {
/* Add 4px extra margin on top of the tabs toolbar on Windows 7. */
- @include dragSpacePadding {
+ @include _dragSpacePadding {
padding-top: calc(var(--space-above-tabbar) + 4px) !important;
}
}
@include OS($win8, $win10, $linux) {
- @include dragSpacePadding {
+ @include _dragSpacePadding {
padding-top: var(--space-above-tabbar) !important;
}
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/tabbar/clipped_tab/_pinned_close_button.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/tabbar/clipped_tab/_pinned_close_button.scss
index e5f2b1d4..7f498522 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/tabbar/clipped_tab/_pinned_close_button.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/tabbar/clipped_tab/_pinned_close_button.scss
@@ -8,6 +8,7 @@
--uc-close-button-padding: 4px;
}
+//-- Mixin ---------------------------------------------------------------------
@mixin pinnedCloseButtonShow($prefix: "") {
#{$prefix}:not([busy]) .tab-close-button {
display: -moz-box !important;
@@ -33,6 +34,8 @@
}
}
+//------------------------------------------------------------------------------
+
.tabbrowser-tab[pinned] {
@include pinnedCloseButtonShow("&[visuallyselected]:not([style*='transform: translateX']):hover");
@include pinnedIconStackLayout("&[visuallyselected]:not([style*='transform: translateX']):hover");
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/tabbar/unselected_tab/_dynamic_separator.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/tabbar/unselected_tab/_dynamic_separator.scss
index e80c7ef6..9633b1b2 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/tabbar/unselected_tab/_dynamic_separator.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/tabbar/unselected_tab/_dynamic_separator.scss
@@ -1,4 +1,5 @@
-@mixin separatorShape() {
+//-- Mixin ---------------------------------------------------------------------
+@mixin _dynamicSeparatorShape() {
/* Box Model */
content: "";
display: block;
@@ -20,6 +21,8 @@
}
}
+//------------------------------------------------------------------------------
+
@include Option("userChrome.tab.newtab_button_like_tab") {
#tabbrowser-arrowscrollbox {
position: absolute;
@@ -27,7 +30,7 @@
.tab-background::before,
#tabs-newtab-button::before {
- @include separatorShape;
+ @include _dynamicSeparatorShape;
/* More position */
transform: translateX(-2.5px) translateY(calc(-50% + 1px));
@@ -39,7 +42,7 @@
#tabbrowser-arrowscrollbox:not([overflowing])
.tabbrowser-tab:not([visuallyselected], [multiselected], :hover)[last-visible-tab]
.tab-background::after {
- @include separatorShape;
+ @include _dynamicSeparatorShape;
}
.tab-background::before {
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_fully_color.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_fully_color.scss
index 3a9f23f5..94e98bcd 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_fully_color.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_fully_color.scss
@@ -40,10 +40,11 @@ html#main-window menupopup:not(.in-menulist) {
*/
}
- /* Fallback background */
+ /* Fallback background - Set to Legacy. It will be removed Next update
menupopup:not(.cui-widget-panel.cui-widget-panelview, [placespopup="true"]) {
background-color: var(--lwt-accent-color, var(--in-content-page-background)) !important;
}
+ */
}
/* Default theme color preservation */
@@ -66,6 +67,28 @@ html#main-window menupopup:not(.in-menulist) {
}
}
+/*== Info Bar Color ==========================================================*/
+.container.infobar {
+ background-color: var(--urlbar-box-bgcolor);
+}
+.notification-button {
+ background-color: var(--button-bgcolor);
+
+ &:hover {
+ background-color: var(--button-hover-bgcolor);
+ }
+ &:hover:active {
+ background-color: var(--button-active-bgcolor);
+ }
+}
+
+html|button.ghost-button:not(.semi-transparent):enabled:hover {
+ background-color: var(--button-hover-bgcolor) !important;
+}
+html|button.ghost-button:not(.semi-transparent):enabled:hover:active {
+ background-color: var(--in-content-button-background-active) !important;
+}
+
/*== Bookmark Popup Color ====================================================*/
#editBMPanel_folderTree:-moz-lwtheme,
#editBMPanel_tagsSelector:-moz-lwtheme {
@@ -151,34 +174,36 @@ body:not([lwt-sidebar]) xul|search-textbox.tabsFilter[focused="true"] {
background: transparent !important;
border: none !important;
clip-path: inset(0 round var(--panel-border-radius));
-}
-#PopupAutoComplete > richlistbox {
- border-radius: var(--panel-border-radius) !important;
- background-color: var(--panel-bgcolor) !important; /* Original: Field */
- color: var(--arrowpanel-color, var(--in-content-page-color)) !important; /* Original: FiledText */
+ > richlistbox {
+ border-radius: var(--panel-border-radius) !important;
+ background-color: var(--panel-bgcolor) !important; /* Original: Field */
+ color: var(--arrowpanel-color, var(--in-content-page-color)) !important; /* Original: FiledText */
+ }
}
.autocomplete-richlistitem:hover {
background-color: var(--arrowpanel-dimmed) !important;
}
-#PopupAutoComplete > richlistbox > richlistitem[originaltype="generatedPassword"] > .two-line-wrapper > .ac-site-icon,
-#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginWithOrigin"] > .two-line-wrapper > .ac-site-icon,
-#PopupAutoComplete > richlistbox > richlistitem[originaltype="login"] > .ac-site-icon {
- fill: GrayText !important;
-}
+#PopupAutoComplete > richlistbox > richlistitem {
+ &[originaltype="generatedPassword"] > .two-line-wrapper > .ac-site-icon,
+ &[originaltype="loginWithOrigin"] > .two-line-wrapper > .ac-site-icon,
+ &[originaltype="login"] > .ac-site-icon {
+ fill: GrayText !important;
+ }
-#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"] {
- --panel-border-color: var(--panel-bgcolor);
- color: var(--arrowpanel-color, var(--in-content-page-color)) !important; /* Original: FieldText */
- background-color: var(--arrowpanel-dimmed, hsla(0, 0%, 80%, 0.35)) !important; /* Original: hsla(0,0%,80%,.35) */
- border-color: var(--panel-border-color) !important; /* Original: rgba(38,38,38,.15) */
-}
+ &[originaltype="loginsFooter"] {
+ --panel-border-color: var(--panel-bgcolor);
+ color: var(--arrowpanel-color, var(--in-content-page-color)) !important; /* Original: FieldText */
+ background-color: var(--arrowpanel-dimmed, hsla(0, 0%, 80%, 0.35)) !important; /* Original: hsla(0,0%,80%,.35) */
+ border-color: var(--panel-border-color) !important; /* Original: rgba(38,38,38,.15) */
+ }
-#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"]:hover,
-#PopupAutoComplete > richlistbox > richlistitem[originaltype="loginsFooter"][selected] {
- background-color: var(
- --arrowpanel-dimmed-further,
- hsla(0, 0%, 80%, 0.5)
- ) !important; /* Original: hsla(0,0%,80%,.5), match arrowpanel-dimmed-further */
+ &[originaltype="loginsFooter"]:hover,
+ &[originaltype="loginsFooter"][selected] {
+ background-color: var(
+ --arrowpanel-dimmed-further,
+ hsla(0, 0%, 80%, 0.5)
+ ) !important; /* Original: hsla(0,0%,80%,.5), match arrowpanel-dimmed-further */
+ }
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_fully_dark.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_fully_dark.scss
index f13463d0..f5054517 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_fully_dark.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_fully_dark.scss
@@ -65,8 +65,9 @@ browser[type="content"] > html {
}
#alertSettings > .button-box > .box-inherit {
margin: -4px 4px 3px 0 !important;
- }
- #alertSettings > .button-box > .box-inherit > .button-icon {
- padding: 1px;
+
+ > .button-icon {
+ padding: 1px;
+ }
}
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_waterfox.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_waterfox.scss
index 699d13a6..2fa4ac19 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_waterfox.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/_waterfox.scss
@@ -15,12 +15,11 @@
/* This button needs to align with the tree above it. */
margin-inline-start: 4px;
-}
-#editBMPanel_newFolderButton:hover {
- background-color: var(--button-hover-bgcolor);
-}
-
-#editBMPanel_newFolderButton:hover:active {
- background-color: var(--button-active-bgcolor);
+ &:hover {
+ background-color: var(--button-hover-bgcolor);
+ &:active {
+ background-color: var(--button-active-bgcolor);
+ }
+ }
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_cert.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_cert.scss
index a0e6ffdd..152e45f2 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_cert.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_cert.scss
@@ -21,32 +21,35 @@
font-size: inherit !important;
padding: 8px !important;
margin: 2px 4px !important;
- }
- #locationTextBox:focus {
- border-color: transparent !important;
- outline: 2px solid var(--in-content-focus-outline-color) !important;
- outline-offset: -1px !important; /* Prevents antialising around the corners */
- }
- #locationTextBox:-moz-ui-invalid {
- border-color: transparent !important;
- outline: 2px solid var(--in-content-border-invalid) !important;
- outline-offset: -1px !important; /* Prevents antialising around the corners */
- }
- #locationTextBox:disabled {
- opacity: 0.4 !important;
+
+ &:focus {
+ border-color: transparent !important;
+ outline: 2px solid var(--in-content-focus-outline-color) !important;
+ outline-offset: -1px !important; /* Prevents antialising around the corners */
+ }
+ &:-moz-ui-invalid {
+ border-color: transparent !important;
+ outline: 2px solid var(--in-content-border-invalid) !important;
+ outline-offset: -1px !important; /* Prevents antialising around the corners */
+ }
+ &:disabled {
+ opacity: 0.4 !important;
+ }
}
- #exceptiondialog:first-child > hbox > vbox:not([flex="1"]) {
- width: 48px !important;
- height: 48px !important;
- background-image: url("chrome://global/skin/icons/warning.svg") !important;
- background-size: 48px !important;
- background-repeat: no-repeat !important;
-
- -moz-context-properties: fill !important;
- fill: currentColor !important;
- }
- #exceptiondialog:first-child > hbox > vbox > image {
- display: none !important;
+ #exceptiondialog:first-child > hbox > vbox {
+ &:not([flex="1"]) {
+ width: 48px !important;
+ height: 48px !important;
+ background-image: url("chrome://global/skin/icons/warning.svg") !important;
+ background-size: 48px !important;
+ background-repeat: no-repeat !important;
+
+ -moz-context-properties: fill !important;
+ fill: currentColor !important;
+ }
+ > image {
+ display: none !important;
+ }
}
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_page_info.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_page_info.scss
index e9e80bc0..fe107418 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_page_info.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_page_info.scss
@@ -9,19 +9,7 @@
border-radius: 8px !important;
padding: var(--in-content-button-vertical-padding) var(--in-content-button-horizontal-padding) !important;
margin: 4px !important;
- }
- #viewGroup > radio:hover {
- background-color: var(--in-content-button-background-hover) !important; /* #E0E8F6; */
- }
- #viewGroup > radio[selected="true"] {
- color: var(--in-content-button-text-color) !important; /* SelectedItemText */
- background-color: var(--in-content-button-background-active) !important; /* #C1D2EE; */
- }
- #viewGroup > radio {
- color: var(--in-content-deemphasized-text) !important; /* FieldText */
- }
- #viewGroup > radio {
list-style-image: none !important;
background-image: var(--viewgroup-image) !important;
background-repeat: no-repeat;
@@ -30,6 +18,14 @@
-moz-context-properties: fill !important;
fill: currentColor !important;
+ color: var(--in-content-deemphasized-text) !important; /* FieldText */
+ &:hover {
+ background-color: var(--in-content-button-background-hover) !important; /* #E0E8F6; */
+ }
+ &[selected="true"] {
+ color: var(--in-content-button-text-color) !important; /* SelectedItemText */
+ background-color: var(--in-content-button-background-active) !important; /* #C1D2EE; */
+ }
}
#generalTab {
--viewgroup-image: url(chrome://global/skin/icons/page-portrait.svg);
@@ -48,9 +44,8 @@
/* Overwrite */
margin: 0 !important;
padding: 0 6px !important;
- }
- @include OS($mac) {
- #viewGroup > radio > .radio-label-box {
+
+ @include OS($mac) {
padding-top: 32px !important; /* as -moz-image-region: rect(0px, 32px, 32px, 0px); */
}
}
@@ -76,17 +71,18 @@
-moz-appearance: none !important;
background: var(--in-content-table-header-background) !important;
color: var(--in-content-table-header-color) !important;
- }
- treecols > treecol,
- treecols > treecolpicker.treecol-image {
- -moz-appearance: none !important;
- color: var(--in-content-table-header-color) !important;
- background: var(--in-content-table-header-background) !important;
- border: 1px solid var(--in-content-table-border-color) !important;
- padding: 4px !important;
- border-spacing: 0;
- text-align: center !important;
+ > treecol,
+ > treecolpicker.treecol-image {
+ -moz-appearance: none !important;
+ color: var(--in-content-table-header-color) !important;
+ background: var(--in-content-table-header-background) !important;
+ border: 1px solid var(--in-content-table-border-color) !important;
+ padding: 4px !important;
+ border-spacing: 0;
+
+ text-align: center !important;
+ }
}
tree,
@@ -96,31 +92,31 @@
background-color: var(--in-content-table-background) !important;
border: 1px solid var(--in-content-table-border-color) !important;
}
+ treechildren {
+ &::-moz-tree-row(odd) {
+ background-color: var(--in-content-box-background-odd) !important;
+ }
+ &::-moz-tree-row(hover) {
+ color: var(--in-content-item-hover-text) !important;
+ background-color: var(--in-content-item-hover) !important;
+ }
+ &::-moz-tree-row(selected) {
+ background-color: var(--in-content-item-selected) !important;
+ }
- treechildren::-moz-tree-row(odd) {
- background-color: var(--in-content-box-background-odd) !important;
- }
-
- treechildren::-moz-tree-row(hover) {
- color: var(--in-content-item-hover-text) !important;
- background-color: var(--in-content-item-hover) !important;
- }
- treechildren::-moz-tree-row(selected) {
- background-color: var(--in-content-item-selected) !important;
- }
-
- treechildren::-moz-tree-cell {
- border-inline: 1px solid var(--in-content-table-border-color) !important;
- border-spacing: 0 !important;
- padding: 4px !important;
- margin: 0 !important;
- }
- treechildren::-moz-tree-cell-text(hover) {
- color: var(--in-content-item-hover-text) !important;
- }
- treechildren::-moz-tree-cell-text(selected) {
- font-weight: 600 !important;
- color: var(--in-content-item-selected-text) !important;
+ &::-moz-tree-cell {
+ border-inline: 1px solid var(--in-content-table-border-color) !important;
+ border-spacing: 0 !important;
+ padding: 4px !important;
+ margin: 0 !important;
+ }
+ &::-moz-tree-cell-text(hover) {
+ color: var(--in-content-item-hover-text) !important;
+ }
+ &::-moz-tree-cell-text(selected) {
+ font-weight: 600 !important;
+ color: var(--in-content-item-selected-text) !important;
+ }
}
#imagecontainerbox {
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_proton_commons.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_proton_commons.scss
index 2fe65efb..a3c31e52 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_proton_commons.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/proton_chrome/_proton_commons.scss
@@ -56,19 +56,19 @@
/* Use the same margin of other elements for the alignment */
margin-inline: 4px !important;
min-width: 6.3em !important;
- }
- /* Medium and small buttons get sized to 7/14 and 6/12px padding (when adding
- * the 1px border): */
- button.medium {
- padding: 6px 13px !important;
- min-height: 28px !important;
- font-size: 0.95em !important;
- }
- button.small {
- padding: 5px 11px !important;
- min-height: 24px !important;
- font-size: 0.9em !important;
+ &.medium {
+ /* Medium and small buttons get sized to 7/14 and 6/12px padding (when adding
+ * the 1px border): */
+ padding: 6px 13px !important;
+ min-height: 28px !important;
+ font-size: 0.95em !important;
+ }
+ &.small {
+ padding: 5px 11px !important;
+ min-height: 24px !important;
+ font-size: 0.9em !important;
+ }
}
/* Remove margin added by button.css */
@@ -76,20 +76,11 @@
margin: 0 !important;
}
- button:-moz-focusring,
- xul|menulist:-moz-focusring,
- xul|checkbox:-moz-focusring > .checkbox-check, /* :not([native]) to win specificity over checkbox.css */
- xul|radio[focused="true"]:-moz-focusring {
- box-shadow: none !important;
- outline: 2px solid var(--in-content-focus-outline-color) !important;
- outline-offset: 2px !important;
- }
button:not([disabled="true"]):hover {
background-color: var(--in-content-button-background-hover) !important;
color: var(--in-content-button-text-color-hover) !important;
border-color: transparent !important;
}
-
xul|button:not([disabled="true"]):hover:active,
xul|button[open],
xul|button[open]:hover,
@@ -135,175 +126,118 @@
}
}
+ button:-moz-focusring,
+ xul|menulist:-moz-focusring,
+ xul|checkbox:-moz-focusring > .checkbox-check, /* :not([native]) to win specificity over checkbox.css */
+ xul|radio[focused="true"]:-moz-focusring {
+ box-shadow: none !important;
+ outline: 2px solid var(--in-content-focus-outline-color) !important;
+ outline-offset: 2px !important;
+ }
+
/*- Radio Button -----------------------------------------------------------*/
xul|radio {
- /* margin-inline-start: 0 !important; */
- appearance: none !important;
+ @include Proton.RadioGlobal;
}
xul|*.radio-check {
- appearance: none !important;
- width: 16px !important;
- height: 16px !important;
- padding: 0 !important;
- border: 1px solid var(--in-content-box-border-color) !important;
- border-radius: 100% !important;
- margin-block: 2px !important; /* extend the vertical clicktarget */
- margin-inline: 0 6px !important;
- background-color: var(--in-content-button-background) !important;
- background-position: center !important;
- flex-shrink: 0 !important; /* avoid shrinking inside flex container */
+ @include Proton.RadioIcon;
}
-
- xul|radio:not([disabled="true"]):hover > xul|*.radio-check {
- background-color: var(--in-content-button-background-hover) !important;
- color: var(--in-content-button-text-color-hover) !important;
- }
-
- xul|radio:not([disabled="true"]):hover:active > xul|*.radio-check {
- background-color: var(--in-content-button-background-active) !important;
- }
-
xul|*.radio-check[selected] {
- -moz-context-properties: fill !important;
- fill: currentColor !important;
- color: var(--in-content-primary-button-text-color) !important;
- background-color: var(--in-content-primary-button-background) !important;
- background-image: url("chrome://global/skin/icons/radio.svg") !important;
- border-color: transparent !important;
-
- /* Style the button also when printing with "Print Backgrounds" unchecked */
- color-adjust: exact !important;
+ @include Proton.RadioCheckedIcon;
}
- xul|radio:not([disabled="true"])[selected]:hover > xul|*.radio-check {
- background-color: var(--in-content-primary-button-background-hover) !important;
- color: var(--in-content-primary-button-text-color-hover) !important;
+ xul|radio:not([disabled="true"]):hover {
+ > xul|*.radio-check {
+ @include Proton.RadioIconHover;
+ }
+ &:active > xul|*.radio-check {
+ @include Proton.RadioIconActive;
+ }
}
- xul|radio:not([disabled="true"])[selected]:hover:active > xul|*.radio-check {
- background-color: var(--in-content-primary-button-background-active) !important;
+ xul|radio:not([disabled="true"])[selected]:hover {
+ > xul|*.radio-check {
+ @include Proton.RadioCheckedIconHover;
+ }
+ &:active > xul|*.radio-check {
+ @include Proton.RadioCheckedIconActive;
+ }
}
xul|*.radio-label-box {
- margin-inline: 0 8px !important;
- padding-inline-start: 0 !important;
+ @include Proton.RadioLabel;
}
/* Disabled checkboxes, radios and labels */
xul|checkbox[disabled="true"],
xul|radio[disabled="true"],
xul|label[disabled="true"] {
- color: inherit !important;
- }
-
- xul|checkbox[disabled="true"],
- xul|radio[disabled="true"],
- xul|label[disabled="true"] {
- opacity: 0.5 !important;
+ @include Proton.DisabledMenuItem;
}
/*- Check Box --------------------------------------------------------------*/
/* From checkbox.css */
checkbox {
- appearance: none !important;
- -moz-box-align: center !important;
- margin: 4px 2px !important;
+ @include Proton.CheckboxGlobal;
+ }
+
+ .checkbox-check {
+ @include Proton.CheckboxIcon;
+ }
+ .checkbox-check[checked] {
+ @include Proton.CheckboxCheckedIcon;
+ }
+
+ checkbox:not([disabled="true"]):hover {
+ > .checkbox-check {
+ @include Proton.CheckboxIconHover;
+ }
+ &:active > .checkbox-check {
+ @include Proton.CheckboxIconActive;
+ }
+
+ > .checkbox-check[checked] {
+ @include Proton.CheckboxCheckedIconHover;
+ }
+ &:active > .checkbox-check[checked] {
+ @include Proton.CheckboxCheckedIconActive;
+ }
+ }
+
+ checkbox:-moz-focusring > .checkbox-check {
+ @include Proton.CheckboxFocusRing;
+ }
+
+ @include Contrast {
+ checkbox:not([disabled="true"]):hover > .checkbox-check {
+ @include Proton.CheckboxIconHoverContrast;
+ }
+
+ .checkbox-check[checked] {
+ @include Proton.CheckboxCheckedIconContrast;
+ }
+
+ checkbox:not([disabled="true"]):hover:active > .checkbox-check[checked],
+ checkbox:not([disabled="true"]):hover > .checkbox-check[checked] {
+ > .checkbox-check[checked] {
+ @include Proton.CheckboxCheckedIconHoverContrast;
+ }
+ }
}
.checkbox-icon[src] {
margin-inline-end: 2px !important;
}
.checkbox-label {
- margin: 1px 0 !important;
+ @include Proton.ChexboxLabel;
}
checkbox[disabled="true"] {
- opacity: 0.4 !important;
- }
-
- .checkbox-check {
- appearance: none !important;
- color: var(--checkbox-border-color, ThreeDDarkShadow) !important;
- background-color: var(--checkbox-unchecked-bgcolor, Field) !important;
- border: 1px solid currentColor !important;
- border-radius: 2px !important;
- margin-inline-end: 6px !important;
- }
-
- .checkbox-check {
- height: 16px !important;
- width: 16px !important;
- }
-
- checkbox:not([disabled="true"]):hover > .checkbox-check {
- background-color: var(
- --checkbox-unchecked-hover-bgcolor,
- color-mix(in srgb, -moz-accent-color 4%, Field)
- ) !important;
- }
-
- checkbox:not([disabled="true"]):hover:active > .checkbox-check {
- background-color: var(
- --checkbox-unchecked-active-bgcolor,
- color-mix(in srgb, -moz-accent-color 8%, Field)
- ) !important;
- }
-
- .checkbox-check[checked] {
- border-color: var(--checkbox-checked-border-color, transparent) !important;
- background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important;
- background-image: url("chrome://global/skin/icons/check.svg") !important;
- background-position: center !important;
- background-repeat: no-repeat !important;
- -moz-context-properties: fill !important;
- fill: currentColor !important;
- color: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
- /* Style the button also when printing with "Print Backgrounds" unchecked */
- color-adjust: exact !important;
- }
-
- checkbox:not([disabled="true"]):hover > .checkbox-check[checked] {
- background-color: var(
- --checkbox-checked-hover-bgcolor,
- color-mix(in srgb, currentColor 12.5%, -moz-accent-color)
- ) !important;
- }
-
- checkbox:not([disabled="true"]):hover:active > .checkbox-check[checked] {
- background-color: var(
- --checkbox-checked-active-bgcolor,
- color-mix(in srgb, currentColor 25%, -moz-accent-color)
- ) !important;
- }
-
- checkbox:-moz-focusring > .checkbox-check {
- outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important;
- outline-offset: var(--focus-outline-offset, 2px) !important;
- }
-
- @include Contrast {
- checkbox:not([disabled="true"]):hover > .checkbox-check {
- /* 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;
- }
-
- .checkbox-check[checked] {
- color: var(--checkbox-checked-border-color, currentColor) !important;
- fill: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
- }
-
- checkbox:not([disabled="true"]):hover:active > .checkbox-check[checked],
- checkbox:not([disabled="true"]):hover > .checkbox-check[checked] {
- color: var(--checkbox-checked-border-color-hover, -moz-accent-color-foreground) !important;
- fill: var(--checkbox-checked-border-color-hover, -moz-accent-color-foreground) !important;
- }
+ @include Proton.DisabledChexbox;
}
/* From common.css */
- xul|*.checkbox-check {
- margin-block: 2px !important;
- }
xul|richlistitem > xul|*.checkbox-check {
margin: 3px 6px !important;
}
@@ -318,29 +252,26 @@
padding-block: 4px !important;
padding-inline: 12px 8px !important;
margin: 5px 2px 3px !important;
- }
- xul|menulist[size="medium"] {
- padding-block: 6px !important;
- padding-inline: 16px 10px !important;
- }
+ &[size="medium"] {
+ padding-block: 6px !important;
+ padding-inline: 16px 10px !important;
+ }
+ &[size="large"] {
+ padding-block: 8px !important;
+ padding-inline: 16px 12px !important;
+ }
- xul|menulist[size="large"] {
- padding-block: 8px !important;
- padding-inline: 16px 12px !important;
- }
-
- xul|menulist:hover {
- background-color: var(--button-hover-bgcolor, color-mix(in srgb, currentColor 10%, ButtonFace)) !important;
- }
-
- xul|menulist:hover:active {
- background-color: var(--button-active-bgcolor, color-mix(in srgb, currentColor 20%, ButtonFace)) !important;
- }
-
- xul|menulist:-moz-focusring {
- outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important;
- outline-offset: var(--focus-outline-offset, 2px) !important;
+ &:hover {
+ background-color: var(--button-hover-bgcolor, color-mix(in srgb, currentColor 10%, ButtonFace)) !important;
+ }
+ &:hover:active {
+ background-color: var(--button-active-bgcolor, color-mix(in srgb, currentColor 20%, ButtonFace)) !important;
+ }
+ &:-moz-focusring {
+ outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important;
+ outline-offset: var(--focus-outline-offset, 2px) !important;
+ }
}
#label-box {
@@ -354,15 +285,15 @@
appearance: none !important;
width: 12px !important;
height: 12px !important;
- }
- /* dropmarker::part(icon)
- * ::part is not apply chrome
- */
- dropmarker[exportparts="icon: dropmarker-icon"] {
- list-style-image: url("chrome://global/skin/icons/arrow-down.svg") !important;
- -moz-context-properties: fill !important;
- fill: currentColor !important;
+ &[exportparts="icon: dropmarker-icon"] {
+ /* dropmarker::part(icon)
+ * ::part is not apply chrome
+ */
+ list-style-image: url("chrome://global/skin/icons/arrow-down.svg") !important;
+ -moz-context-properties: fill !important;
+ fill: currentColor !important;
+ }
}
#highlightable-label:not([highlightable="true"]),
@@ -396,25 +327,23 @@
padding-block: 0.2em !important;
padding-inline: 10px 30px !important;
}
-
- xul|menulist > xul|menupopup > xul|menu:not([disabled="true"])[_moz-menuactive="true"],
- xul|menulist > xul|menupopup > xul|menuitem:not([disabled="true"])[_moz-menuactive="true"] {
- color: var(--in-content-item-hover-text) !important;
- background-color: var(--in-content-item-hover) !important;
- }
-
- xul|menulist > xul|menupopup > xul|menu:not([disabled="true"])[selected="true"],
- xul|menulist > xul|menupopup > xul|menuitem:not([disabled="true"])[selected="true"] {
- color: var(--in-content-item-selected-text) !important;
- background-color: var(--in-content-item-selected) !important;
- }
-
- xul|menulist > xul|menupopup > xul|menu[disabled="true"],
- xul|menulist > xul|menupopup > xul|menuitem[disabled="true"] {
- color: #999 !important;
- /* override the [_moz-menuactive="true"] background color from
- global/menu.css */
- background-color: transparent !important;
+
+ xul|menulist > xul|menupopup > xul|menu,
+ xul|menulist > xul|menupopup > xul|menuitem {
+ &:not([disabled="true"])[_moz-menuactive="true"] {
+ color: var(--in-content-item-hover-text) !important;
+ background-color: var(--in-content-item-hover) !important;
+ }
+ &:not([disabled="true"])[selected="true"] {
+ color: var(--in-content-item-selected-text) !important;
+ background-color: var(--in-content-item-selected) !important;
+ }
+ &[disabled="true"] {
+ color: #999 !important;
+ /* override the [_moz-menuactive="true"] background color from
+ global/menu.css */
+ background-color: transparent !important;
+ }
}
xul|menulist > xul|menupopup xul|menuseparator {
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/system_default_theme/_urlbar_focus_color.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/system_default_theme/_urlbar_focus_color.scss
index 947b6b95..a175e0e3 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/system_default_theme/_urlbar_focus_color.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/system_default_theme/_urlbar_focus_color.scss
@@ -1,14 +1,17 @@
/*= Common - URL Bar focus color =============================================*/
// TODO: `OS` Not covered case
+$_urlBarFocusSelector: ":root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme)";
+$_urlBarFocusDarkSelector: ":root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive)";
+
@media (-moz-windows-accent-color-in-titlebar), (-moz-gtk-csd-available) {
/* URL Bar */
- :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme),
- :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) {
+ #{$_urlBarFocusSelector},
+ #{$_urlBarFocusDarkSelector} {
--focus-outline-color: -moz-accent-color !important;
}
- :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) #urlbar[open] > #urlbar-background,
- :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) #urlbar[open] > #urlbar-background {
+ #{$_urlBarFocusSelector} #urlbar[open] > #urlbar-background,
+ #{$_urlBarFocusDarkSelector} #urlbar[open] > #urlbar-background {
border-color: color-mix(
in srgb,
-moz-accent-color 50%,
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/system_default_theme/_win10.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/system_default_theme/_win10.scss
index b45fa9d0..a90a79a8 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/src/theme/system_default_theme/_win10.scss
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/theme/system_default_theme/_win10.scss
@@ -309,16 +309,17 @@
/*= Windows10 - Titlebar accent color ========================================*/
@media (-moz-windows-accent-color-in-titlebar) {
/* Tab Bar */
- :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) .titlebar-color,
- :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) .titlebar-color {
- color: -moz-accent-color-foreground;
- background-color: -moz-accent-color;
- }
+ :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme),
+ :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) {
+ .titlebar-color {
+ color: -moz-accent-color-foreground;
+ background-color: -moz-accent-color;
+ }
- :root[tabsintitlebar]:not(:-moz-window-inactive, :-moz-lwtheme) .toolbar-items,
- :root[tabsintitlebar][lwt-default-theme-in-dark-mode]:not(:-moz-window-inactive) .toolbar-items {
- --toolbarbutton-icon-fill: currentColor;
- --toolbarbutton-hover-background: color-mix(in srgb, -moz-accent-color-foreground 10%, transparent);
- --toolbarbutton-active-background: color-mix(in srgb, -moz-accent-color-foreground 15%, transparent);
+ .toolbar-items {
+ --toolbarbutton-icon-fill: currentColor;
+ --toolbarbutton-hover-background: color-mix(in srgb, -moz-accent-color-foreground 10%, transparent);
+ --toolbarbutton-active-background: color-mix(in srgb, -moz-accent-color-foreground 15%, transparent);
+ }
}
}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/utils/_native_menu.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/utils/_native_menu.scss
new file mode 100644
index 00000000..5e8ee165
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/utils/_native_menu.scss
@@ -0,0 +1,7 @@
+@use "option" as *;
+
+@mixin NativeMenu() {
+ @include Option("widget.macos.native-context-menus", "widget.gtk.native-context-menus") {
+ @content;
+ }
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/src/utils/_proton_elements.scss b/arch-config/.mozilla/firefox/default-release/chrome/src/utils/_proton_elements.scss
new file mode 100644
index 00000000..04eb4591
--- /dev/null
+++ b/arch-config/.mozilla/firefox/default-release/chrome/src/utils/_proton_elements.scss
@@ -0,0 +1,157 @@
+//== Radio Button ==============================================================
+@mixin RadioGlobal {
+ /* margin-inline-start: 0 !important; */
+ appearance: none !important;
+}
+
+@mixin RadioIcon {
+ appearance: none !important;
+ width: 16px !important;
+ height: 16px !important;
+
+ border: 1px solid var(--in-content-box-border-color) !important;
+ border-radius: 100% !important;
+
+ padding: 0 !important;
+ margin-inline: 0 6px !important;
+ margin-block: 2px !important; /* extend the vertical clicktarget */
+
+ background-color: var(--in-content-button-background) !important;
+ background-position: center !important;
+
+ flex-shrink: 0 !important; /* avoid shrinking inside flex container */
+}
+
+@mixin RadioCheckedIcon {
+ -moz-context-properties: fill !important;
+ fill: currentColor !important;
+ color: var(--in-content-primary-button-text-color) !important;
+
+ background-color: var(--in-content-primary-button-background) !important;
+ background-image: url("chrome://global/skin/icons/radio.svg") !important;
+ border-color: transparent !important;
+
+ /* Style the button also when printing with "Print Backgrounds" unchecked */
+ color-adjust: exact !important;
+}
+
+@mixin RadioIconHover {
+ background-color: var(--in-content-button-background-hover) !important;
+ color: var(--in-content-button-text-color-hover) !important;
+}
+
+@mixin RadioIconActive {
+ background-color: var(--in-content-button-background-active) !important;
+}
+
+@mixin RadioCheckedIconHover {
+ background-color: var(--in-content-primary-button-background-hover) !important;
+ color: var(--in-content-primary-button-text-color-hover) !important;
+}
+
+@mixin RadioCheckedIconActive {
+ background-color: var(--in-content-primary-button-background-active) !important;
+}
+
+@mixin RadioLabel {
+ margin-inline: 0 8px !important;
+ padding-inline-start: 0 !important;
+}
+
+@mixin DisabledMenuItem {
+ color: inherit !important;
+ opacity: 0.5 !important;
+}
+
+//== Check Box =================================================================
+@mixin CheckboxGlobal($content: false) {
+ appearance: none !important;
+ -moz-box-align: center !important;
+ margin: if($content, 0px, 4px) 2px !important;
+}
+
+@mixin CheckboxIcon {
+ appearance: none !important;
+ width: 16px !important;
+ height: 16px !important;
+
+ border: 1px solid currentColor !important;
+ border-radius: 2px !important;
+
+ color: var(--checkbox-border-color, ThreeDDarkShadow) !important;
+ background-color: var(--checkbox-unchecked-bgcolor, Field) !important;
+
+ margin-inline-end: 6px !important; /* or 2px */
+ margin-block: 2px !important; /* From common.css */
+}
+
+@mixin CheckboxCheckedIcon {
+ -moz-context-properties: fill !important;
+ fill: currentColor !important;
+ color: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
+ border-color: var(--checkbox-checked-border-color, transparent) !important;
+
+ background-color: var(--checkbox-checked-bgcolor, -moz-accent-color) !important;
+ background-image: url("chrome://global/skin/icons/check.svg") !important;
+ background-position: center !important;
+ background-repeat: no-repeat !important;
+
+ /* Style the button also when printing with "Print Backgrounds" unchecked */
+ color-adjust: exact !important;
+}
+
+@mixin CheckboxIconHover {
+ background-color: var(
+ --checkbox-unchecked-hover-bgcolor,
+ color-mix(in srgb, -moz-accent-color 4%, Field)
+ ) !important;
+}
+
+@mixin CheckboxIconActive {
+ background-color: var(
+ --checkbox-unchecked-active-bgcolor,
+ color-mix(in srgb, -moz-accent-color 8%, Field)
+ ) !important;
+}
+
+@mixin CheckboxCheckedIconHover {
+ background-color: var(
+ --checkbox-checked-hover-bgcolor,
+ color-mix(in srgb, currentColor 12.5%, -moz-accent-color)
+ ) !important;
+}
+
+@mixin CheckboxCheckedIconActive {
+ background-color: var(
+ --checkbox-checked-active-bgcolor,
+ color-mix(in srgb, currentColor 25%, -moz-accent-color)
+ ) !important;
+}
+
+@mixin CheckboxIconHoverContrast {
+ /* 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;
+}
+
+@mixin CheckboxCheckedIconContrast {
+ color: var(--checkbox-checked-border-color, currentColor) !important;
+ fill: var(--checkbox-checked-color, -moz-accent-color-foreground) !important;
+}
+
+@mixin CheckboxCheckedIconHoverContrast {
+ color: var(--checkbox-checked-border-color-hover, -moz-accent-color-foreground) !important;
+ fill: var(--checkbox-checked-border-color-hover, -moz-accent-color-foreground) !important;
+}
+
+@mixin CheckboxFocusRing {
+ outline: 2px solid var(--focus-outline-color, -moz-accent-color) !important;
+ outline-offset: var(--focus-outline-offset, 2px) !important;
+}
+
+@mixin ChexboxLabel {
+ margin: 1px 0 !important;
+}
+
+@mixin DisabledChexbox {
+ opacity: 0.4 !important;
+}
diff --git a/arch-config/.mozilla/firefox/default-release/chrome/yarn.lock b/arch-config/.mozilla/firefox/default-release/chrome/yarn.lock
index 2e2759c0..b7386dbd 100644
--- a/arch-config/.mozilla/firefox/default-release/chrome/yarn.lock
+++ b/arch-config/.mozilla/firefox/default-release/chrome/yarn.lock
@@ -2257,9 +2257,9 @@ minimatch@^3.0.4:
brace-expansion "^1.1.7"
minimist@^1.2.5:
- version "1.2.5"
- resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
- integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==
+ version "1.2.6"
+ resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.6.tgz#8637a5b759ea0d6e98702cfb3a9283323c93af44"
+ integrity sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==
ms@2.1.2:
version "2.1.2"
diff --git a/arch-config/.mozilla/firefox/default-release/user.js b/arch-config/.mozilla/firefox/default-release/user.js
index 83330982..39c37eb8 100644
--- a/arch-config/.mozilla/firefox/default-release/user.js
+++ b/arch-config/.mozilla/firefox/default-release/user.js
@@ -61,6 +61,7 @@ user_pref("userChrome.rounding.square_tab", true);
// user_pref("userChrome.compatibility.dynamic_separator", true); // Need dynamic_seperator
// user_pref("userChrome.compatiblity.os.linux_non_native_titlebar_button", true);
+// user_pref("userChrome.compatibility.os.windows_maximized, true");
// == Theme Custom Settings ====================================================
// -- User Chrome --------------------------------------------------------------
@@ -108,6 +109,7 @@ user_pref("userChrome.rounding.square_tab", true);
// user_pref("userChrome.icon.account_image_to_right", true);
// user_pref("userChrome.icon.account_label_to_right", true);
+// user_pref("userChrome.icon.menu.full", true);
// -- User Content -------------------------------------------------------------
// user_pref("userContent.player.ui.twoline", true);