mirror of
https://github.com/black7375/Firefox-UI-Fix.git
synced 2025-12-30 06:00:24 -08:00
Fix: Auto Hide - Static auto hide with One Liner
This commit is contained in:
parent
0490e0e2b8
commit
c2c8bc85dd
6 changed files with 98 additions and 86 deletions
|
|
@ -3829,8 +3829,8 @@
|
|||
}
|
||||
|
||||
#nav-bar {
|
||||
margin-top: calc(-1 * var(--tab-min-height)) !important;
|
||||
height: var(--tab-min-height) !important;
|
||||
margin-top: var(--uc-tabbar-hide-height) !important;
|
||||
height: var(--uc-tabbar-height) !important;
|
||||
}
|
||||
|
||||
#urlbar-container {
|
||||
|
|
@ -5465,15 +5465,22 @@
|
|||
}
|
||||
@supports -moz-bool-pref("userChrome.autohide.tabbar") or -moz-bool-pref("userChrome.autohide.navbar") or -moz-bool-pref(
|
||||
"userChrome.autohide.bookmarkbar"
|
||||
) {
|
||||
)
|
||||
or -moz-bool-pref("userChrome.tab.one_liner") {
|
||||
:root {
|
||||
--uc-titlebar-height: calc((var(--tab-block-margin) * 2) + var(--tab-min-height));
|
||||
--uc-titlebar-hide-height: calc(-1 * var(--uc-titlebar-height));
|
||||
--uc-tabbar-height: calc((var(--tab-block-margin) * 2) + var(--tab-min-height));
|
||||
--uc-tabbar-hide-height: calc(-1 * var(--uc-tabbar-height));
|
||||
--uc-navbar-height: calc(16px + 2 * (var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding)));
|
||||
--uc-navbar-hide-height: calc(-1 * var(--uc-navbar-height));
|
||||
--uc-bm-height: calc(20px + (2 * var(--bookmark-block-padding, 4px)));
|
||||
/* 20px = 16px + (2px * 2) [margin block] */
|
||||
--uc-bm-hide-height: calc(-1 * var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
@supports -moz-bool-pref("userChrome.autohide.tabbar") or -moz-bool-pref("userChrome.autohide.navbar") or -moz-bool-pref(
|
||||
"userChrome.autohide.bookmarkbar"
|
||||
) {
|
||||
:root {
|
||||
--uc-autohide-toolbar-delay: 600ms;
|
||||
}
|
||||
|
||||
|
|
@ -5517,26 +5524,26 @@
|
|||
}
|
||||
@supports -moz-bool-pref("userChrome.autohide.tabbar") {
|
||||
#navigator-toolbox:hover {
|
||||
--uc-toolbar-height: var(--uc-titlebar-height);
|
||||
--uc-toolbar-height: var(--uc-tabbar-height);
|
||||
}
|
||||
@supports not -moz-bool-pref("userChrome.autohide.bookmarkbar") {
|
||||
@supports -moz-bool-pref("userChrome.autohide.navbar") {
|
||||
#navigator-toolbox:hover {
|
||||
--uc-toolbar-height: calc(var(--uc-titlebar-height) + var(--uc-navbar-height));
|
||||
--uc-toolbar-height: calc(var(--uc-tabbar-height) + var(--uc-navbar-height));
|
||||
}
|
||||
}
|
||||
}
|
||||
@supports not -moz-bool-pref("userChrome.autohide.navbar") {
|
||||
@supports -moz-bool-pref("userChrome.autohide.bookmarkbar") {
|
||||
#navigator-toolbox:hover {
|
||||
--uc-toolbar-height: calc(var(--uc-titlebar-height) + var(--uc-bm-height));
|
||||
--uc-toolbar-height: calc(var(--uc-tabbar-height) + var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
}
|
||||
@supports -moz-bool-pref("userChrome.autohide.navbar") {
|
||||
@supports -moz-bool-pref("userChrome.autohide.bookmarkbar") {
|
||||
#navigator-toolbox:hover {
|
||||
--uc-toolbar-height: calc(var(--uc-titlebar-height) + var(--uc-navbar-height) + var(--uc-bm-height));
|
||||
--uc-toolbar-height: calc(var(--uc-tabbar-height) + var(--uc-navbar-height) + var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -5573,7 +5580,7 @@
|
|||
}
|
||||
|
||||
:root:not([customizing]) #titlebar {
|
||||
margin-bottom: var(--uc-titlebar-hide-height);
|
||||
margin-bottom: var(--uc-tabbar-hide-height);
|
||||
will-change: margin-bottom;
|
||||
}
|
||||
|
||||
|
|
@ -5612,7 +5619,7 @@
|
|||
}
|
||||
@supports -moz-bool-pref("userChrome.autohide.navbar") {
|
||||
#nav-bar:not([customizing]) {
|
||||
margin-bottom: var(--uc-titlebar-hide-height);
|
||||
margin-bottom: var(--uc-tabbar-hide-height);
|
||||
opacity: 0;
|
||||
will-change: margin-bottom, opacity;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,16 @@
|
|||
@include Option("userChrome.autohide.tabbar", "userChrome.autohide.navbar", "userChrome.autohide.bookmarkbar") {
|
||||
@include Option("userChrome.autohide.tabbar", "userChrome.autohide.navbar", "userChrome.autohide.bookmarkbar", "userChrome.tab.one_liner") {
|
||||
:root {
|
||||
--uc-titlebar-height: calc((var(--tab-block-margin) * 2) + var(--tab-min-height));
|
||||
--uc-titlebar-hide-height: calc(-1 * var(--uc-titlebar-height));
|
||||
--uc-tabbar-height: calc((var(--tab-block-margin) * 2) + var(--tab-min-height));
|
||||
--uc-tabbar-hide-height: calc(-1 * var(--uc-tabbar-height));
|
||||
--uc-navbar-height: calc(16px + 2 * (var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding)));
|
||||
--uc-navbar-hide-height: calc(-1 * var(--uc-navbar-height));
|
||||
--uc-bm-height: calc(20px + (2 * var(--bookmark-block-padding, 4px))); /* 20px = 16px + (2px * 2) [margin block] */
|
||||
--uc-bm-hide-height: calc(-1 * var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
|
||||
@include Option("userChrome.autohide.tabbar", "userChrome.autohide.navbar", "userChrome.autohide.bookmarkbar") {
|
||||
:root {
|
||||
--uc-autohide-toolbar-delay: 600ms;
|
||||
}
|
||||
|
||||
|
|
@ -21,73 +25,6 @@
|
|||
}
|
||||
|
||||
@include Option("userChrome.autohide.toolbar_overlap") {
|
||||
#navigator-toolbox {
|
||||
--uc-toolbar-hide-height: calc(-1 * var(--uc-toolbar-height, 0));
|
||||
margin-bottom: var(--uc-toolbar-hide-height) !important;
|
||||
|
||||
@include Animate {
|
||||
@include Option("userChrome.decoration.animate") {
|
||||
transition: margin-top 1s ease,
|
||||
margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||
|
||||
&:hover {
|
||||
transition-delay: 0s !important;
|
||||
}
|
||||
|
||||
&[inFullscreen="true"] {
|
||||
transition: margin-top 1.3s var(--animation-easing-function) 50ms,
|
||||
margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||
}
|
||||
}
|
||||
@include NotOption("userChrome.decoration.animate") {
|
||||
transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||
|
||||
&:hover {
|
||||
transition-delay: 0s !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include Option("userChrome.autohide.tabbar") {
|
||||
--uc-toolbar-height: var(--uc-titlebar-height);
|
||||
|
||||
@include NotOption("userChrome.autohide.bookmarkbar") {
|
||||
@include Option("userChrome.autohide.navbar") {
|
||||
--uc-toolbar-height: calc(var(--uc-titlebar-height) + var(--uc-navbar-height));
|
||||
}
|
||||
}
|
||||
@include NotOption("userChrome.autohide.navbar") {
|
||||
@include Option("userChrome.autohide.bookmarkbar") {
|
||||
--uc-toolbar-height: calc(var(--uc-titlebar-height) + var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
|
||||
@include Option("userChrome.autohide.navbar") {
|
||||
@include Option("userChrome.autohide.bookmarkbar") {
|
||||
--uc-toolbar-height: calc(var(--uc-titlebar-height) + var(--uc-navbar-height) + var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
}
|
||||
@include NotOption("userChrome.autohide.tabbar") {
|
||||
@include NotOption("userChrome.autohide.bookmarkbar") {
|
||||
@include Option("userChrome.autohide.navbar") {
|
||||
--uc-toolbar-height: var(--uc-navbar-height);
|
||||
}
|
||||
}
|
||||
@include NotOption("userChrome.autohide.navbar") {
|
||||
@include Option("userChrome.autohide.bookmarkbar") {
|
||||
--uc-toolbar-height: var(--uc-bm-height);
|
||||
}
|
||||
}
|
||||
|
||||
@include Option("userChrome.autohide.navbar") {
|
||||
@include Option("userChrome.autohide.bookmarkbar") {
|
||||
--uc-toolbar-height: calc(var(--uc-navbar-height) + var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@import "toolbar_overlap";
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
#nav-bar:not([customizing]) {
|
||||
margin-bottom: var(--uc-titlebar-hide-height);
|
||||
margin-bottom: var(--uc-tabbar-hide-height);
|
||||
opacity: 0;
|
||||
will-change: margin-bottom, opacity;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
}
|
||||
|
||||
:root:not([customizing]) #titlebar {
|
||||
margin-bottom: var(--uc-titlebar-hide-height);
|
||||
margin-bottom: var(--uc-tabbar-hide-height);
|
||||
will-change: margin-bottom;
|
||||
}
|
||||
#TabsToolbar:not([customizing]) {
|
||||
|
|
|
|||
68
src/autohide/_toolbar_overlap.scss
Normal file
68
src/autohide/_toolbar_overlap.scss
Normal file
|
|
@ -0,0 +1,68 @@
|
|||
#navigator-toolbox {
|
||||
--uc-toolbar-hide-height: calc(-1 * var(--uc-toolbar-height, 0));
|
||||
margin-bottom: var(--uc-toolbar-hide-height) !important;
|
||||
|
||||
@include Animate {
|
||||
@include Option("userChrome.decoration.animate") {
|
||||
transition: margin-top 1s ease,
|
||||
margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||
|
||||
&:hover {
|
||||
transition-delay: 0s !important;
|
||||
}
|
||||
|
||||
&[inFullscreen="true"] {
|
||||
transition: margin-top 1.3s var(--animation-easing-function) 50ms,
|
||||
margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||
}
|
||||
}
|
||||
@include NotOption("userChrome.decoration.animate") {
|
||||
transition: margin-bottom 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||
|
||||
&:hover {
|
||||
transition-delay: 0s !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include Option("userChrome.autohide.tabbar") {
|
||||
--uc-toolbar-height: var(--uc-tabbar-height);
|
||||
|
||||
@include NotOption("userChrome.autohide.bookmarkbar") {
|
||||
@include Option("userChrome.autohide.navbar") {
|
||||
--uc-toolbar-height: calc(var(--uc-tabbar-height) + var(--uc-navbar-height));
|
||||
}
|
||||
}
|
||||
@include NotOption("userChrome.autohide.navbar") {
|
||||
@include Option("userChrome.autohide.bookmarkbar") {
|
||||
--uc-toolbar-height: calc(var(--uc-tabbar-height) + var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
|
||||
@include Option("userChrome.autohide.navbar") {
|
||||
@include Option("userChrome.autohide.bookmarkbar") {
|
||||
--uc-toolbar-height: calc(var(--uc-tabbar-height) + var(--uc-navbar-height) + var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
}
|
||||
@include NotOption("userChrome.autohide.tabbar") {
|
||||
@include NotOption("userChrome.autohide.bookmarkbar") {
|
||||
@include Option("userChrome.autohide.navbar") {
|
||||
--uc-toolbar-height: var(--uc-navbar-height);
|
||||
}
|
||||
}
|
||||
@include NotOption("userChrome.autohide.navbar") {
|
||||
@include Option("userChrome.autohide.bookmarkbar") {
|
||||
--uc-toolbar-height: var(--uc-bm-height);
|
||||
}
|
||||
}
|
||||
|
||||
@include Option("userChrome.autohide.navbar") {
|
||||
@include Option("userChrome.autohide.bookmarkbar") {
|
||||
--uc-toolbar-height: calc(var(--uc-navbar-height) + var(--uc-bm-height));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -8,8 +8,8 @@
|
|||
}
|
||||
|
||||
#nav-bar {
|
||||
margin-top: calc(-1 * var(--tab-min-height)) !important;
|
||||
height: var(--tab-min-height) !important;
|
||||
margin-top: var(--uc-tabbar-hide-height) !important;
|
||||
height: var(--uc-tabbar-height) !important;
|
||||
}
|
||||
|
||||
#urlbar-container {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue