mirror of
https://github.com/black7375/Firefox-UI-Fix.git
synced 2025-12-15 15:20:33 -08:00
231 lines
7.7 KiB
SCSS
231 lines
7.7 KiB
SCSS
//-- Variables -----------------------------------------------------------------
|
|
// Items
|
|
// .menu-iconic, .menuitem-iconic: Already 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})";
|
|
$_checkMenu: ":not([type=\"checkbox\"][checked=\"true\"], [type=\"radio\"])";
|
|
|
|
// Components
|
|
$_nestedPopup: "> menupopup:not(.in-menulist) >";
|
|
$_nestedPopupIcon: ":not(menu, #ContentSelectDropdown) #{$_nestedPopup}";
|
|
$_nestedPopupPadding: ":not(menu, #ContentSelectDropdown, #context-navigation) #{$_nestedPopup}";
|
|
$_iconMenuPopup: "menupopup:is(#menu_FilePopup, #menu_EditPopup, #menu_viewPopup, #goPopup, #historyMenuPopup, #bookmarksMenuPopup, #menu_ProfilesPopup, #menu_ToolsPopup, #windowPopup, #menu_HelpPopup, #usercssloader-menupopup)";
|
|
|
|
$_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}";
|
|
$_sendTabMenuPopup: "#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup, #context-sendlinktodevice-popup";
|
|
$_otherPopupMenuitem: "menupopup:is(#{$_sendTabMenuPopup}, #frame > menupopup, #spell-dictionaries-menu, #context-ask-chat > menupopup) > menuitem#{$_checkMenu}";
|
|
$_otherIconMenu: ".openintabs-menuitem, #blockedPopupDontShowMessage, #BMB_viewBookmarksToolbar, #sidebarMenu-popup:is(menupopup)";
|
|
|
|
//-- Mixin ---------------------------------------------------------------------
|
|
// Init Menu
|
|
$_initialMenus: selector.append(
|
|
"menupopup menuitem, menupopup menu",
|
|
$_checkMenu
|
|
);
|
|
$_initialMenus: $_initialMenus + "," +
|
|
selector.nest($_initialMenus, "> .menu-iconic-left > .menu-iconic-icon, > .menu-icon");
|
|
@mixin _initial_menus() {
|
|
-moz-appearance: none !important; /* Linux: menulist */
|
|
}
|
|
|
|
// Icon
|
|
@mixin _layout_icon_menus() {
|
|
/* Color */
|
|
-moz-context-properties: fill, fill-opacity, stroke !important;
|
|
fill: currentColor !important;
|
|
stroke: currentColor;
|
|
|
|
/* Layout */
|
|
background-size: 16px !important;
|
|
background-repeat: no-repeat !important;
|
|
background-image: var(--menuitem-image);
|
|
}
|
|
|
|
@mixin _layout_icon_native_menus() {
|
|
@include NativeToolkitMenu {
|
|
list-style-image: var(--menuitem-image, url("../icons/blank.svg")) !important;
|
|
}
|
|
}
|
|
|
|
// Padding
|
|
@mixin _layout_root_padding() {
|
|
:root {
|
|
--uc-menu-background-position: left;
|
|
--context-menu-background-padding-default: 5px;
|
|
--context-menu-background-padding: var(--context-menu-background-padding-default);
|
|
&:-moz-locale-dir(rtl) {
|
|
--uc-menu-background-position: right;
|
|
}
|
|
}
|
|
}
|
|
@mixin _layout_init_padding() {
|
|
background-position: var(--uc-menu-background-position) var(--context-menu-background-padding) center !important;
|
|
padding-inline-start: var(--context-menu-background-padding) !important;
|
|
}
|
|
|
|
@mixin _layout_root_non_native() {
|
|
:root {
|
|
--context-menu-background-padding: 1em;
|
|
--context-menu-text-padding-default: #{ 16px + 8px };
|
|
--context-menu-text-padding: var(--context-menu-text-padding-default);
|
|
--menu-background-padding-default: calc(var(--context-menu-background-padding) + var(--context-menu-text-padding));
|
|
|
|
--bookmark-menu-icon-align-padding: 0px;
|
|
}
|
|
}
|
|
|
|
@mixin _layout_init_non_native() {
|
|
padding-inline-start: var(--menu-background-padding-default) !important;
|
|
margin-left: 0 !important;
|
|
}
|
|
|
|
@mixin _layout_win_native_menu_popup() {
|
|
@include NativeMenuPopup {
|
|
.menu-iconic,
|
|
.menuitem-iconic {
|
|
> .menu-iconic-left {
|
|
appearance: none !important;
|
|
padding-block: 0 !important;
|
|
padding-inline-start: 5px !important;
|
|
margin-inline-end: 8px !important;
|
|
@include Option("userChrome.compatibility.os.win11") {
|
|
box-sizing: content-box;
|
|
}
|
|
}
|
|
}
|
|
.menu-accel, .menu-iconic-accel {
|
|
box-sizing: content-box;
|
|
min-height: 16px;
|
|
}
|
|
.menu-accel, .menu-iconic-accel,
|
|
.menu-text, .menu-iconic-text {
|
|
padding-block: 0 !important;
|
|
}
|
|
}
|
|
}
|
|
|
|
@mixin _layout_root_win() {
|
|
@include OS($win) {
|
|
:root {
|
|
--bookmark-menu-icon-text-padding: calc(var(--context-menu-text-padding) + var(--arrowpanel-menuitem-padding-inline));
|
|
--bookmark-menu-icon-background-padding: calc(var(--arrowpanel-menuitem-padding-inline) + var(--bookmark-menu-icon-align-padding));
|
|
}
|
|
|
|
@include WinNativeMenu() {
|
|
:root {
|
|
--context-menu-text-padding: calc(1.45em + 8px);
|
|
--bookmark-menu-icon-align-padding: calc((1.45em - 16px) / 2 + 1px);
|
|
|
|
@include OS($win7) {
|
|
--context-menu-background-padding-default: 2px;
|
|
@media (-moz-windows-classic) {
|
|
--context-menu-background-padding-default: -0.5px;
|
|
}
|
|
}
|
|
@include OS($win8) {
|
|
--context-menu-background-padding-default: 3px;
|
|
}
|
|
}
|
|
|
|
@include OS($win10) {
|
|
:root {
|
|
--context-menu-background-padding: 3px;
|
|
--menu-background-padding-default: 0px;
|
|
}
|
|
|
|
@include Option("userChrome.compatibility.os.win11") {
|
|
:root {
|
|
--context-menu-background-padding: 5px;
|
|
}
|
|
#main-menubar {
|
|
--context-menu-background-padding: calc(5px + ((1.45em - 16px) / 2));
|
|
}
|
|
menuitem {
|
|
&:is([type="checkbox"], [type="radio"]) {
|
|
--menu-padding: 0px;
|
|
}
|
|
&[checked="true"] {
|
|
--context-menu-background-padding: 0px;
|
|
> .menu-iconic-left {
|
|
transform: translateX(2px);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@include _layout_win_native_menu_popup();
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
@mixin _layout_init_win() {
|
|
@include WinNativeMenu() {
|
|
background-position: left var(--context-menu-background-padding) center !important;
|
|
padding-inline-start: 0 !important;
|
|
}
|
|
}
|
|
|
|
@mixin _layout_root_linux() {
|
|
:root {
|
|
--context-menu-background-padding-default: 6px;
|
|
|
|
// https://github.com/mozilla/gecko-dev/commit/e54707888510dec75db59a170b287d1db031505a
|
|
// https://github.com/mozilla/gecko-dev/blob/e54707888510dec75db59a170b287d1db031505a/toolkit/themes/linux/global/menu.css#L103
|
|
--context-menu-text-padding: 21px;
|
|
}
|
|
.menu-icon {
|
|
display: unset !important;
|
|
}
|
|
}
|
|
@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);
|
|
// }
|
|
// }
|