mirror of
https://github.com/black7375/Firefox-UI-Fix.git
synced 2026-01-03 07:42:47 -08:00
Add: Auto Hide - Fill URL bar
This commit is contained in:
parent
da23a8007b
commit
d3735aadf7
5 changed files with 131 additions and 15 deletions
|
|
@ -4144,9 +4144,16 @@
|
||||||
@supports -moz-bool-pref("userChrome.tabbar.one_liner") {
|
@supports -moz-bool-pref("userChrome.tabbar.one_liner") {
|
||||||
@supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") {
|
@supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") {
|
||||||
:root {
|
:root {
|
||||||
--uc-navbar-size: 40vw;
|
--uc-navbar-width-origin: 40vw;
|
||||||
--uc-tabbar-size: calc(100vw - var(--uc-navbar-size));
|
--uc-navbar-width: var(--uc-navbar-width-origin);
|
||||||
--uc-navbar-margin: calc(var(--uc-navbar-size) + var(--uc-navbar-gap, 0px));
|
--uc-tabbar-width: calc(100vw - var(--uc-navbar-width));
|
||||||
|
--uc-navbar-margin: calc(var(--uc-navbar-width) + var(--uc-navbar-gap, 0px));
|
||||||
|
}
|
||||||
|
@supports -moz-bool-pref("userChrome.autohide.fill_urlbar") {
|
||||||
|
:root {
|
||||||
|
--uc-navbar-width-origin: 50vw;
|
||||||
|
--uc-navbar-width: 24em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
|
|
@ -4223,7 +4230,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
margin-inline-end: var(--uc-tabbar-size) !important;
|
margin-inline-end: var(--uc-tabbar-width) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.titlebar-spacer[type="pre-tabs"] {
|
.titlebar-spacer[type="pre-tabs"] {
|
||||||
|
|
@ -4236,7 +4243,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
margin-inline-start: var(--uc-tabbar-size) !important;
|
margin-inline-start: var(--uc-tabbar-width) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.titlebar-spacer[type="post-tabs"] {
|
.titlebar-spacer[type="post-tabs"] {
|
||||||
|
|
@ -4247,9 +4254,16 @@
|
||||||
@supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") {
|
@supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") {
|
||||||
@media screen and (min-width: 1100px) {
|
@media screen and (min-width: 1100px) {
|
||||||
:root {
|
:root {
|
||||||
--uc-navbar-size: 40vw;
|
--uc-navbar-width-origin: 40vw;
|
||||||
--uc-tabbar-size: calc(100vw - var(--uc-navbar-size));
|
--uc-navbar-width: var(--uc-navbar-width-origin);
|
||||||
--uc-navbar-margin: calc(var(--uc-navbar-size) + var(--uc-navbar-gap, 0px));
|
--uc-tabbar-width: calc(100vw - var(--uc-navbar-width));
|
||||||
|
--uc-navbar-margin: calc(var(--uc-navbar-width) + var(--uc-navbar-gap, 0px));
|
||||||
|
}
|
||||||
|
@supports -moz-bool-pref("userChrome.autohide.fill_urlbar") {
|
||||||
|
:root {
|
||||||
|
--uc-navbar-width-origin: 50vw;
|
||||||
|
--uc-navbar-width: 24em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
|
|
@ -4326,7 +4340,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
margin-inline-end: var(--uc-tabbar-size) !important;
|
margin-inline-end: var(--uc-tabbar-width) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.titlebar-spacer[type="pre-tabs"] {
|
.titlebar-spacer[type="pre-tabs"] {
|
||||||
|
|
@ -4339,7 +4353,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
margin-inline-start: var(--uc-tabbar-size) !important;
|
margin-inline-start: var(--uc-tabbar-width) !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.titlebar-spacer[type="post-tabs"] {
|
.titlebar-spacer[type="post-tabs"] {
|
||||||
|
|
@ -7255,6 +7269,67 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@supports -moz-bool-pref("userChrome.autohide.fill_urlbar") {
|
||||||
|
#nav-bar:not(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) #urlbar-container {
|
||||||
|
-moz-box-ordinal-group: 0;
|
||||||
|
min-width: calc(
|
||||||
|
var(--uc-navbar-width, 100vw) -
|
||||||
|
(2 * var(--urlbar-margin-inline) + var(--uc-window-drag-space-pre, 0px) + var(--uc-navbar-gap, 0px))
|
||||||
|
) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
@supports -moz-bool-pref("userChrome.tabbar.one_liner") {
|
||||||
|
#nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) {
|
||||||
|
--uc-tabbar-width: calc(100vw - var(--uc-navbar-width-origin));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@media (prefers-reduced-motion: no-preference) {
|
||||||
|
@supports -moz-bool-pref("userChrome.tabbar.one_liner") {
|
||||||
|
@supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") {
|
||||||
|
#nav-bar {
|
||||||
|
transition: margin-inline 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||||
|
}
|
||||||
|
|
||||||
|
#nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) {
|
||||||
|
transition-delay: 0s !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") {
|
||||||
|
@media screen and (prefers-reduced-motion: no-preference) and (min-width: 1100px) {
|
||||||
|
#nav-bar {
|
||||||
|
transition: margin-inline 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||||
|
}
|
||||||
|
|
||||||
|
#nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) {
|
||||||
|
transition-delay: 0s !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@supports not -moz-bool-pref("userChrome.tabbar.one_liner") {
|
||||||
|
#urlbar-container {
|
||||||
|
transition: min-width 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||||
|
}
|
||||||
|
|
||||||
|
#nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) #urlbar-container {
|
||||||
|
transition-delay: 0s !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@supports -moz-bool-pref("userChrome.tabbar.one_liner") {
|
||||||
|
@supports -moz-bool-pref("userChrome.tabbar.one_liner.responsive") {
|
||||||
|
@media screen and (prefers-reduced-motion: no-preference) and (max-width: 1100px) {
|
||||||
|
#urlbar-container {
|
||||||
|
transition: min-width 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||||
|
}
|
||||||
|
|
||||||
|
#nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) #urlbar-container {
|
||||||
|
transition-delay: 0s !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
/** Hidden ********************************************************************/
|
/** Hidden ********************************************************************/
|
||||||
@supports not -moz-bool-pref("userChrome.tabbar.one_liner") {
|
@supports not -moz-bool-pref("userChrome.tabbar.one_liner") {
|
||||||
@supports -moz-bool-pref("userChrome.hidden.tabbar") {
|
@supports -moz-bool-pref("userChrome.hidden.tabbar") {
|
||||||
|
|
|
||||||
30
src/autohide/_fill_urlbar.scss
Normal file
30
src/autohide/_fill_urlbar.scss
Normal file
|
|
@ -0,0 +1,30 @@
|
||||||
|
#nav-bar:not(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) #urlbar-container {
|
||||||
|
-moz-box-ordinal-group: 0;
|
||||||
|
min-width: calc(var(--uc-navbar-width, 100vw) - ((2 * var(--urlbar-margin-inline)) + var(--uc-window-drag-space-pre, 0px) + var(--uc-navbar-gap, 0px))) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
@include Option("userChrome.tabbar.one_liner") {
|
||||||
|
#nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) {
|
||||||
|
--uc-tabbar-width: calc(100vw - var(--uc-navbar-width-origin));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include Animate {
|
||||||
|
@include OneLiner {
|
||||||
|
#nav-bar {
|
||||||
|
transition: margin-inline 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||||
|
}
|
||||||
|
#nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) {
|
||||||
|
transition-delay: 0s !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include OneLinerNavbarContent {
|
||||||
|
#urlbar-container {
|
||||||
|
transition: min-width 0.25s var(--animation-easing-function) var(--uc-autohide-toolbar-delay);
|
||||||
|
}
|
||||||
|
#nav-bar:is(:hover, :focus-within, [urlbar-exceeds-toolbar-bounds="true"]) #urlbar-container {
|
||||||
|
transition-delay: 0s !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -29,3 +29,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
@import "sidebar";
|
@import "sidebar";
|
||||||
|
|
||||||
|
@include Option("userChrome.autohide.fill_urlbar") {
|
||||||
|
@import "fill_urlbar";
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,14 @@
|
||||||
:root {
|
:root {
|
||||||
--uc-navbar-size: 40vw;
|
--uc-navbar-width-origin: 40vw;
|
||||||
--uc-tabbar-size: calc(100vw - var(--uc-navbar-size));
|
--uc-navbar-width: var(--uc-navbar-width-origin);
|
||||||
|
--uc-tabbar-width: calc(100vw - var(--uc-navbar-width));
|
||||||
|
|
||||||
--uc-navbar-margin: calc(var(--uc-navbar-size) + var(--uc-navbar-gap, 0px));
|
--uc-navbar-margin: calc(var(--uc-navbar-width) + var(--uc-navbar-gap, 0px));
|
||||||
|
|
||||||
|
@include Option("userChrome.autohide.fill_urlbar") {
|
||||||
|
--uc-navbar-width-origin: 50vw;
|
||||||
|
--uc-navbar-width: 24em;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
|
|
@ -79,7 +85,7 @@ toolbarspring.chromeclass-toolbar-additional {
|
||||||
margin-inline-start: var(--uc-navbar-margin) !important;
|
margin-inline-start: var(--uc-navbar-margin) !important;
|
||||||
}
|
}
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
margin-inline-end: var(--uc-tabbar-size) !important;
|
margin-inline-end: var(--uc-tabbar-width) !important;
|
||||||
}
|
}
|
||||||
.titlebar-spacer[type="pre-tabs"] {
|
.titlebar-spacer[type="pre-tabs"] {
|
||||||
display: none !important;
|
display: none !important;
|
||||||
|
|
@ -90,7 +96,7 @@ toolbarspring.chromeclass-toolbar-additional {
|
||||||
margin-inline-end: var(--uc-navbar-margin) !important;
|
margin-inline-end: var(--uc-navbar-margin) !important;
|
||||||
}
|
}
|
||||||
#nav-bar {
|
#nav-bar {
|
||||||
margin-inline-start: var(--uc-tabbar-size) !important;
|
margin-inline-start: var(--uc-tabbar-width) !important;
|
||||||
}
|
}
|
||||||
.titlebar-spacer[type="post-tabs"] {
|
.titlebar-spacer[type="post-tabs"] {
|
||||||
display: none !important;
|
display: none !important;
|
||||||
|
|
|
||||||
1
user.js
1
user.js
|
|
@ -81,6 +81,7 @@ user_pref("userChrome.rounding.square_tab", false);
|
||||||
// user_pref("userChrome.autohide.navbar", true);
|
// user_pref("userChrome.autohide.navbar", true);
|
||||||
// user_pref("userChrome.autohide.bookmarkbar", true);
|
// user_pref("userChrome.autohide.bookmarkbar", true);
|
||||||
// user_pref("userChrome.autohide.sidebar", true);
|
// user_pref("userChrome.autohide.sidebar", true);
|
||||||
|
// user_pref("userChrome.autohide.fill_urlbar", true);
|
||||||
// user_pref("userChrome.autohide.back_button", true);
|
// user_pref("userChrome.autohide.back_button", true);
|
||||||
// user_pref("userChrome.autohide.forward_button", true);
|
// user_pref("userChrome.autohide.forward_button", true);
|
||||||
// user_pref("userChrome.autohide.page_action", true);
|
// user_pref("userChrome.autohide.page_action", true);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue