Fix: Auto Hide - Static auto hide with One Liner

This commit is contained in:
alstjr7375 2022-07-22 09:05:27 +09:00
parent 0490e0e2b8
commit c2c8bc85dd
6 changed files with 98 additions and 86 deletions

View file

@ -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;
}

View file

@ -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";
}
}

View file

@ -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;
}

View file

@ -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]) {

View 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));
}
}
}
}
}

View file

@ -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 {