diff --git a/__tests__/native_menu.test.scss b/__tests__/native_menu.test.scss index ba7189b7..e0c79018 100644 --- a/__tests__/native_menu.test.scss +++ b/__tests__/native_menu.test.scss @@ -15,6 +15,9 @@ @include native_menu.Win10_NativeMenu { @include example; } + @include native_menu.Win10_NonNativeMenu { + @include example; + } } @include expect { @supports -moz-bool-pref("widget.macos.native-context-menus") or -moz-bool-pref("widget.gtk.native-context-menus") { @@ -27,6 +30,9 @@ @media not (-moz-windows-non-native-menus) { @include example; } + @media (-moz-windows-non-native-menus) { + @include example; + } } } } diff --git a/css/leptonChrome.css b/css/leptonChrome.css index be695eed..af1806a1 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -10545,6 +10545,30 @@ } } /* 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) { + :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) + ); + } + } + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8) { + :root { + --context-menu-text-padding: calc(1.45em + 8px); + --bookmark-menu-icon-align-padding: calc((1.45em - 16px) / 2 + 1px); + } + } @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) { :root { --context-menu-background-padding-default: 2px; @@ -10590,15 +10614,22 @@ @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { :root { --context-menu-background-padding: 1em; - --context-menu-text-padding: 24px; /* 16px + 8px */ + --context-menu-text-padding: 24px; --menu-background-padding-default: calc( var(--context-menu-background-padding) + var(--context-menu-text-padding) ); } + @media (-moz-windows-non-native-menus) { + :root { + --bookmark-menu-icon-align-padding: 0px; + } + } @media not (-moz-windows-non-native-menus) { :root { --context-menu-background-padding: 3px; --menu-background-padding-default: 0px; + --context-menu-text-padding: calc(1.45em + 8px); + --bookmark-menu-icon-align-padding: calc((1.45em - 16px) / 2 + 1px); } @supports -moz-bool-pref("userChrome.compatibility.os.win11") { :root { @@ -10722,50 +10753,31 @@ #PersonalToolbar { --context-menu-background-padding: var(--arrowpanel-menuitem-padding-inline); } - /* Windows 7, 8 */ + /* Windows */ @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7), (-moz-os-version: windows-win8), - (-moz-platform: windows-win8) { - /* Global Menu */ - menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) .bookmark-item { - padding-inline-start: 0 !important; - } + (-moz-platform: windows-win8), + (-moz-os-version: windows-win10), + (-moz-platform: windows-win10) { /* Bookmark Popup - None icon menu */ - #BMB_bookmarksPopup, - #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) { - margin-inline: var(--arrowpanel-menuitem-padding-inline) !important; - background-position: var(--uc-menu-background-position) 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) { - 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) { - padding-inline-start: var(--arrowpanel-menuicon-padding) !important; + margin-inline: var(--arrowpanel-menuitem-margin-inline) !important; + padding-inline-start: var(--bookmark-menu-icon-text-padding) !important; + background-position: var(--uc-menu-background-position) var(--bookmark-menu-icon-background-padding) center !important; } } - /* Windows */ - @media (-moz-os-version: windows-win10), (-moz-platform: windows-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) { - margin-inline-start: var(--arrowpanel-menuitem-margin-inline) !important; - padding-inline-start: calc( - var(--arrowpanel-menuitem-padding-inline) + var(--context-menu-text-padding) - ) !important; - background-position: var(--uc-menu-background-position) var(--arrowpanel-menuitem-padding-inline) center !important; + /* Windows 7, 8 */ + @media (-moz-os-version: windows-win7), + (-moz-platform: windows-win7), + (-moz-os-version: windows-win8), + (-moz-platform: windows-win8) { + /* Global Menu */ + menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) .bookmark-item { + padding-inline-start: 0 !important; } } /* Linux */ diff --git a/css/leptonContent.css b/css/leptonContent.css index adf594cf..73af0803 100644 --- a/css/leptonContent.css +++ b/css/leptonContent.css @@ -2999,6 +2999,15 @@ 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) { + :root { + --context-menu-text-padding: calc(1.45em + 8px); + --bookmark-menu-icon-align-padding: calc((1.45em - 16px) / 2 + 1px); + } + } @media (-moz-os-version: windows-win7), (-moz-platform: windows-win7) { :root { --context-menu-background-padding-default: 2px; @@ -3032,15 +3041,22 @@ @media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) { :root { --context-menu-background-padding: 1em; - --context-menu-text-padding: 24px; /* 16px + 8px */ + --context-menu-text-padding: 24px; --menu-background-padding-default: calc( var(--context-menu-background-padding) + var(--context-menu-text-padding) ); } + @media (-moz-windows-non-native-menus) { + :root { + --bookmark-menu-icon-align-padding: 0px; + } + } @media not (-moz-windows-non-native-menus) { :root { --context-menu-background-padding: 3px; --menu-background-padding-default: 0px; + --context-menu-text-padding: calc(1.45em + 8px); + --bookmark-menu-icon-align-padding: calc((1.45em - 16px) / 2 + 1px); } @supports -moz-bool-pref("userChrome.compatibility.os.win11") { :root { diff --git a/src/icons/layout/_bookmark_menu.scss b/src/icons/layout/_bookmark_menu.scss index 1c801b43..dd9c33bb 100644 --- a/src/icons/layout/_bookmark_menu.scss +++ b/src/icons/layout/_bookmark_menu.scss @@ -52,37 +52,21 @@ $_bookmarkToolbarMenus: selector.nest( //------------------------------------------------------------------------------ -/* Windows 7, 8 */ -@include OS($win7, $win8) { - /* Global Menu */ - menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) .bookmark-item { - padding-inline-start: 0 !important; - } - +/* Windows */ +@include OS($win) { /* Bookmark Popup - None icon menu */ - #BMB_bookmarksPopup, - #PersonalToolbar { - --arrowpanel-menuicon-padding: 9px; - } @include _layoutBookmarkMenu() { - margin-inline: var(--arrowpanel-menuitem-padding-inline) !important; - background-position: var(--uc-menu-background-position) calc(var(--arrowpanel-menuicon-padding)) center !important; - } - @include _layoutBookmarkPopup() { - padding-inline-start: calc(var(--arrowpanel-menuicon-padding) + var(--context-menu-text-padding) + 2px) !important; - } - @include _layoutBookmarkToolbar() { - padding-inline-start: var(--arrowpanel-menuicon-padding) !important; + margin-inline: var(--arrowpanel-menuitem-margin-inline) !important; + padding-inline-start: var(--bookmark-menu-icon-text-padding) !important; + background-position: var(--uc-menu-background-position) var(--bookmark-menu-icon-background-padding) center !important; } } -/* Windows */ -@include OS($win10) { - /* Bookmark Popup - None icon menu */ - @include _layoutBookmarkMenu() { - margin-inline-start: var(--arrowpanel-menuitem-margin-inline) !important; - padding-inline-start: calc(var(--arrowpanel-menuitem-padding-inline) + var(--context-menu-text-padding)) !important; - background-position: var(--uc-menu-background-position) var(--arrowpanel-menuitem-padding-inline) center !important; +/* Windows 7, 8 */ +@include OS($win7, $win8) { + /* Global Menu */ + menupopup:is(#goPopup, #historyMenuPopup, #bookmarksMenuPopup) .bookmark-item { + padding-inline-start: 0 !important; } } diff --git a/src/icons/layout/_menu.scss b/src/icons/layout/_menu.scss index b0b8bafb..a4cadec8 100644 --- a/src/icons/layout/_menu.scss +++ b/src/icons/layout/_menu.scss @@ -79,6 +79,7 @@ $_layoutCommonMenus: ( } /* Padding - Windows */ +@include _layout_root_win; @include _layout_root_win7_8; @include OS($win7, $win8) { @include _layoutIconMenus { diff --git a/src/icons/layout/_menu_common.scss b/src/icons/layout/_menu_common.scss index 80325e46..4ab2582a 100644 --- a/src/icons/layout/_menu_common.scss +++ b/src/icons/layout/_menu_common.scss @@ -76,17 +76,32 @@ $_initialMenus: selector.append( padding-inline-start: var(--context-menu-background-padding) !important; } +@mixin _layout_win_native_context_text_padding() { + --context-menu-text-padding: calc(1.45em + 8px); + --bookmark-menu-icon-align-padding: calc((1.45em - 16px) / 2 + 1px); +} + +@mixin _layout_root_win() { + :root { + @include OS($win) { + --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)); + } + } +} + @mixin _layout_root_win7_8() { - @include OS($win7) { - :root { + :root { + @include OS($win7, $win8) { + @include _layout_win_native_context_text_padding; + } + @include OS($win7) { --context-menu-background-padding-default: 2px; @media (-moz-windows-classic) { --context-menu-background-padding-default: -0.5px; } } - } - @include OS($win8) { - :root { + @include OS($win8) { --context-menu-background-padding-default: 3px; } } @@ -99,13 +114,18 @@ $_initialMenus: selector.append( @mixin _layout_root_win10() { :root { --context-menu-background-padding: 1em; - --context-menu-text-padding: 24px; /* 16px + 8px */ + --context-menu-text-padding: #{ 16px + 8px }; --menu-background-padding-default: calc(var(--context-menu-background-padding) + var(--context-menu-text-padding)); + + @include Win10_NonNativeMenu() { + --bookmark-menu-icon-align-padding: 0px; + } } @include Win10_NativeMenu() { :root { --context-menu-background-padding: 3px; --menu-background-padding-default: 0px; + @include _layout_win_native_context_text_padding; @include Option("userChrome.compatibility.os.win11") { --context-menu-background-padding: 5px; } diff --git a/src/utils/_native_menu.scss b/src/utils/_native_menu.scss index 66ac8ce7..d9eb33f6 100644 --- a/src/utils/_native_menu.scss +++ b/src/utils/_native_menu.scss @@ -18,3 +18,9 @@ @content; } } + +@mixin Win10_NonNativeMenu() { + @media (-moz-windows-non-native-menus) { + @content; + } +}