diff --git a/CREDITS b/CREDITS index 944d2c5..a2cc636 100644 --- a/CREDITS +++ b/CREDITS @@ -42,6 +42,9 @@ W: https://www.reddit.com/user/Backseat-Driver/ N: badprogramshere W: https://github.com/badprogramshere +N: BPower0036 +W: https://github.com/BPower0036 + N: Burak Yigit Kaya E: ben@byk.im W: https://byk.im/ diff --git a/css/leptonChrome.css b/css/leptonChrome.css index e72481d..7c2f73f 100644 --- a/css/leptonChrome.css +++ b/css/leptonChrome.css @@ -3643,22 +3643,23 @@ /** Tab Bar UI ****************************************************************/ /*= Tabs on Bottom ===========================================================*/ @supports -moz-bool-pref("userChrome.tab.on_bottom") or -moz-bool-pref("userChrome.fullscreen.overlap") { - #navigator-toolbox { + /* Don't use display: flex at not fullscreen!! side effect #372 */ + :root[sizemode="fullscreen"] #navigator-toolbox { display: flex !important; /* Needed for content to take up entire height, compatibility with tabs on bottom */ flex-wrap: wrap; } - #titlebar, - #nav-bar, - #PersonalToolbar, - #tab-notification-deck, - #tab-notification-deck-template { + :root[sizemode="fullscreen"] #titlebar, + :root[sizemode="fullscreen"] #nav-bar, + :root[sizemode="fullscreen"] #PersonalToolbar, + :root[sizemode="fullscreen"] #tab-notification-deck, + :root[sizemode="fullscreen"] #tab-notification-deck-template { flex-basis: 100%; } /* -moz-default-appearance: -moz-window-titlebar */ - #titlebar { + :root[sizemode="fullscreen"] #titlebar { -moz-appearance: none !important; } } @@ -3668,11 +3669,15 @@ /*= Tabbar - Move to bottom ==================================================*/ #titlebar { order: 2; + /* When userChrome.fullscreen.overlap */ + -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; } #tab-notification-deck { order: 2; + /* When userChrome.fullscreen.overlap */ + -moz-box-ordinal-group: 2; } #TabsToolbar .titlebar-spacer { @@ -3682,6 +3687,8 @@ @supports -moz-bool-pref("userChrome.tab.on_bottom.above_bookmark") { #PersonalToolbar { order: 2; + /* When userChrome.fullscreen.overlap */ + -moz-box-ordinal-group: 2; } } @supports not -moz-bool-pref("userChrome.tab.on_bottom.above_bookmark") { @@ -6008,7 +6015,7 @@ :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup - > menuitem[type="checkbox"][checked="false"] + > menuitem[type="checkbox"]:not([checked="true"]) > .menu-iconic-left { padding-inline-start: var(--context-menu-text-padding); } diff --git a/docs/Restrictions.md b/docs/Restrictions.md index 12427ff..910d0f7 100644 --- a/docs/Restrictions.md +++ b/docs/Restrictions.md @@ -63,6 +63,8 @@ The following code will cause extension panels fail to open and trying to open t ``` Info: `#nav-bar` is [`toolbar`](https://udn.realityripple.com/docs/Archive/Mozilla/XUL/toolbar). +Another `display: flex`'s side effect examples. [#368](https://github.com/black7375/Firefox-UI-Fix/issues/368) [#372](https://github.com/black7375/Firefox-UI-Fix/issues/372) + ## Internals ### CSS Loading Order User CSS(`userChrome.css`, `userContent.css`) is usually loaded first. diff --git a/src/icons/_layout_menu.scss b/src/icons/_layout_menu.scss index ba14f04..dbb393a 100644 --- a/src/icons/_layout_menu.scss +++ b/src/icons/_layout_menu.scss @@ -87,7 +87,7 @@ menupopup:is(#context_sendTabToDevicePopupMenu, #context-sendpagetodevice-popup) } :not(menu, #ContentSelectDropdown, #context-navigation) > menupopup - > menuitem[type="checkbox"][checked="false"] + > menuitem[type="checkbox"]:not([checked="true"]) > .menu-iconic-left { padding-inline-start: var(--context-menu-text-padding); } diff --git a/src/tabbar/_index.scss b/src/tabbar/_index.scss index c8ee31a..4b18055 100644 --- a/src/tabbar/_index.scss +++ b/src/tabbar/_index.scss @@ -1,19 +1,20 @@ /*= Tabs on Bottom ===========================================================*/ @include Option("userChrome.tab.on_bottom", "userChrome.fullscreen.overlap") { - #navigator-toolbox { + /* Don't use display: flex at not fullscreen!! side effect #372 */ + :root[sizemode="fullscreen"] #navigator-toolbox { display: flex !important; /* Needed for content to take up entire height, compatibility with tabs on bottom */ flex-wrap: wrap; } - #titlebar, - #nav-bar, - #PersonalToolbar, - #tab-notification-deck, - #tab-notification-deck-template { + :root[sizemode="fullscreen"] #titlebar, + :root[sizemode="fullscreen"] #nav-bar, + :root[sizemode="fullscreen"] #PersonalToolbar, + :root[sizemode="fullscreen"] #tab-notification-deck, + :root[sizemode="fullscreen"] #tab-notification-deck-template { flex-basis: 100%; } /* -moz-default-appearance: -moz-window-titlebar */ - #titlebar { + :root[sizemode="fullscreen"] #titlebar { -moz-appearance: none !important; } } diff --git a/src/tabbar/_tabs_on_bottom.scss b/src/tabbar/_tabs_on_bottom.scss index acf3ed1..f197f8a 100644 --- a/src/tabbar/_tabs_on_bottom.scss +++ b/src/tabbar/_tabs_on_bottom.scss @@ -3,11 +3,13 @@ See the above repository for updates as well as full license text. */ /*= Tabbar - Move to bottom ==================================================*/ #titlebar{ - order: 2; + order: 2; /* When userChrome.fullscreen.overlap */ + -moz-box-ordinal-group: 2; --tabs-navbar-shadow-size: 0px; } #tab-notification-deck { - order: 2; + order: 2; /* When userChrome.fullscreen.overlap */ + -moz-box-ordinal-group: 2; } #TabsToolbar .titlebar-spacer { @@ -16,7 +18,8 @@ See the above repository for updates as well as full license text. */ @include Option("userChrome.tab.on_bottom.above_bookmark") { #PersonalToolbar { - order: 2; + order: 2; /* When userChrome.fullscreen.overlap */ + -moz-box-ordinal-group: 2; } } @include NotOption("userChrome.tab.on_bottom.above_bookmark") {