mirrors/Firefox-UI-Fix
1
Fork 0
mirror of https://github.com/black7375/Firefox-UI-Fix.git synced 2025-12-31 06:20:48 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix: Tab Bar - As titlebar with pinned tab

Browse source
This commit is contained in:
alstjr7375 2022-08-20 19:09:29 +09:00
parent 76e37ffeaf
commit ccd1a8e7a7
5 changed files with 131 additions and 100 deletions
Download patch file Download diff file Expand all files Collapse all files

131
css/leptonChrome.css
View file

@ -4397,6 +4397,50 @@
}
}
/*= Tab Bar - Shared Layout ==================================================*/
@supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.tabbar.one_liner") or -moz-bool-pref(
"userChrome.hidden.tabbar"
)
or -moz-bool-pref("userChrome.tabbar.as_titlebar") {
:root {
--uc-window-control-width: 0px;
/* Same as .titlebar-buttonbox-container - Space reserved for window controls */
--uc-window-drag-space-pre: 0px;
/* Same as .titlebar-spacer[type="pre-tabs"] - Extra space reserved on both sides of the nav-bar to be able to drag the window */
--uc-window-drag-space-post: 0px;
/* Same as .titlebar-spacer[type="post-tabs"] */
--uc-widow-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
}
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 84px;
/* 84px is default value of linux */
--uc-window-drag-space-pre: var(--uc-title-pre-spacer, 40px);
--uc-window-drag-space-post: var(--uc-title-post-spacer, 40px);
}
@media (-moz-os-version: windows-win7),
(-moz-platform: windows-win7),
(-moz-os-version: windows-win8),
(-moz-platform: windows-win8) {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 105px;
}
}
@media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 138px;
}
}
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 72px;
}
}
:root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {
--uc-window-drag-space-pre: 0px;
/* Remove pre space */
}
}
@supports -moz-bool-pref("userChrome.tabbar.on_bottom") or -moz-bool-pref("userChrome.tabbar.one_liner") or -moz-bool-pref(
"userChrome.hidden.tabbar"
) {
@ -4996,28 +5040,6 @@
}
/*= Navbar - Padding for window controls =====================================*/
/* Customized https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/window_control_placeholder_support.css */
:root {
--uc-window-control-width: 0px;
/* Same as .titlebar-buttonbox-container - Space reserved for window controls */
--uc-window-drag-space-pre: 0px;
/* Same as .titlebar-spacer[type="pre-tabs"] - Extra space reserved on both sides of the nav-bar to be able to drag the window */
--uc-window-drag-space-post: 0px;
/* Same as .titlebar-spacer[type="post-tabs"] */
--uc-widow-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
}
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 84px;
/* 84px is default value of linux */
--uc-window-drag-space-pre: var(--uc-title-pre-spacer, 40px);
--uc-window-drag-space-post: var(--uc-title-post-spacer, 40px);
}
:root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {
--uc-window-drag-space-pre: 0px;
/* Remove pre space */
}
@supports -moz-bool-pref("userChrome.tabbar.one_liner") {
@supports not -moz-bool-pref("userChrome.tabbar.one_liner.responsive") {
@supports -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") {
@ -5025,12 +5047,19 @@
/* Don't need pre spacer */
--uc-window-drag-space-pre: 0px;
}
@supports -moz-bool-pref("userChrome.tabbar.as_titlebar") {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) #tabbrowser-tabs {
/* Don't need window control */
--uc-widow-control-space: 0px;
}
}
}
@supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
/* Don't need window control */
--uc-window-control-width: 0px;
--uc-window-drag-space-post: 0px;
@supports not -moz-bool-pref("userChrome.tabbar.as_titlebar") {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
/* Don't need window control */
--uc-widow-control-space: 0px;
}
}
}
}
@ -5041,8 +5070,7 @@
/* Don't need pre spacer */
--uc-window-drag-space-pre: 0px;
/* Don't need window control */
--uc-window-control-width: 0px;
--uc-window-drag-space-post: 0px;
--uc-widow-control-space: 0px;
}
}
}
@ -5052,12 +5080,19 @@
/* Don't need pre spacer */
--uc-window-drag-space-pre: 0px;
}
@supports -moz-bool-pref("userChrome.tabbar.as_titlebar") {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) #tabbrowser-tabs {
/* Don't need window control */
--uc-widow-control-space: 0px;
}
}
}
@supports not -moz-bool-pref("userChrome.tabbar.one_liner.tabbar_first") {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
/* Don't need window control */
--uc-window-control-width: 0px;
--uc-window-drag-space-post: 0px;
@supports not -moz-bool-pref("userChrome.tabbar.as_titlebar") {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
/* Don't need window control */
--uc-widow-control-space: 0px;
}
}
}
}
@ -5122,27 +5157,9 @@
}
}
/* Windows */
@media (-moz-os-version: windows-win7),
(-moz-platform: windows-win7),
(-moz-os-version: windows-win8),
(-moz-platform: windows-win8) {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 105px;
}
}
@media (-moz-os-version: windows-win10), (-moz-platform: windows-win10) {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 138px;
}
}
/* Use this pref to check Mac OS where window controls are on left */
/* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */
@supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled") {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 72px;
}
@supports not -moz-bool-pref("userChrome.tabbar.one_liner") {
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar {
border-inline-start-width: var(--uc-widow-control-space);
@ -5210,7 +5227,7 @@
#scrollbutton-up,
#scrollbutton-down,
.titlebar-spacer[type="pre-tabs"],
spacer[part="overflow-end-indicator"],
spacer:is([part="overflow-start-indicator"], [part="overflow-end-indicator"]),
.tabbrowser-tab:not([selected="true"]),
.tabbrowser-tab[selected="true"] .tab-background,
.tabbrowser-tab[selected="true"] .tab-stack:is(::before, ::after),
@ -5221,16 +5238,15 @@
.tabbrowser-tab[selected="true"] {
-moz-window-dragging: drag;
--tab-max-width: 100%;
width: var(--tab-max-width) !important;
--tab-max-width: 100vw;
min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-widow-control-space)) !important;
max-width: var(--tab-max-width) !important;
margin-inline-start: calc(var(--tab-shadow-max-size) * -1) !important;
}
.tabbrowser-tab[selected="true"][pinned="true"] {
-moz-box-flex: 100;
max-width: var(--tab-max-width) !important;
}
.tabbrowser-tab[selected="true"] .tab-label-container {
margin-inline: 0 !important;
}
@ -5241,7 +5257,12 @@
}
/* Pinned */
#tabbrowser-tabs[positionpinnedtabs] > #tabbrowser-arrowscrollbox > .tabbrowser-tab[pinned][selected="true"] {
position: relative !important;
}
#tabbrowser-tabs {
--tab-overflow-pinned-tabs-width: 0 !important;
padding-inline: 0 !important;
/* Original: var(--tab-overflow-pinned-tabs-width) 0; */
}

27
src/tabbar/_as_titlebar.scss
View file

@ -2,7 +2,7 @@
#scrollbutton-up, /* Defaults */
#scrollbutton-down,
.titlebar-spacer[type="pre-tabs"],
spacer[part="overflow-end-indicator"],
spacer:is([part="overflow-start-indicator"], [part="overflow-end-indicator"]),
.tabbrowser-tab:not([selected="true"]),
.tabbrowser-tab[selected="true"] .tab-background,
.tabbrowser-tab[selected="true"] .tab-stack:is(::before, ::after),
@ -13,20 +13,21 @@ spacer[part="overflow-end-indicator"],
.tabbrowser-tab[selected="true"] {
-moz-window-dragging: drag;
--tab-max-width: 100%;
width: var(--tab-max-width) !important;
--tab-max-width: 100vw;
min-width: calc(var(--uc-tabbar-width, 100vw) - var(--uc-widow-control-space)) !important;
max-width: var(--tab-max-width) !important;
margin-inline-start: calc(var(--tab-shadow-max-size) * -1) !important;
// padding-inline-start: calc(var(--tab-shadow-max-size) + 1px) !important;
}
.tabbrowser-tab[selected="true"][pinned="true"] {
-moz-box-flex: 100;
max-width: var(--tab-max-width) !important;
}
.tabbrowser-tab[selected="true"] .tab-label-container {
margin-inline: 0 !important;
}
&[pinned="true"] {
-moz-box-flex: 100;
max-width: var(--tab-max-width) !important;
}
.tab-label-container {
margin-inline: 0 !important;
}
}
.tab-content {
margin-inline: auto;
width: 100%;
@ -34,7 +35,11 @@ spacer[part="overflow-end-indicator"],
/* Pinned */
#tabbrowser-tabs[positionpinnedtabs] > #tabbrowser-arrowscrollbox > .tabbrowser-tab[pinned][selected="true"] {
position: relative !important;
}
#tabbrowser-tabs {
--tab-overflow-pinned-tabs-width: 0 !important;
padding-inline: 0 !important; /* Original: var(--tab-overflow-pinned-tabs-width) 0; */
}
.tab-throbber,

3
src/tabbar/_index.scss
View file

@ -31,6 +31,9 @@
}
/*= Tab Bar - Shared Layout ==================================================*/
@include Option("userChrome.tabbar.on_bottom", "userChrome.tabbar.one_liner", "userChrome.hidden.tabbar", "userChrome.tabbar.as_titlebar") {
@import "layout/window_control_size";
}
@include Option("userChrome.tabbar.on_bottom", "userChrome.tabbar.one_liner", "userChrome.hidden.tabbar") {
@import "layout";
}

43
src/tabbar/layout/_navbar_padding.scss
View file

@ -1,20 +1,5 @@
/*= Navbar - Padding for window controls =====================================*/
/* Customized https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/window_control_placeholder_support.css */
:root {
--uc-window-control-width: 0px; /* Same as .titlebar-buttonbox-container - Space reserved for window controls */
--uc-window-drag-space-pre: 0px; /* Same as .titlebar-spacer[type="pre-tabs"] - Extra space reserved on both sides of the nav-bar to be able to drag the window */
--uc-window-drag-space-post: 0px; /* Same as .titlebar-spacer[type="post-tabs"] */
--uc-widow-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
}
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 84px; /* 84px is default value of linux */
--uc-window-drag-space-pre: var(--uc-title-pre-spacer, 40px); // 30px
--uc-window-drag-space-post: var(--uc-title-post-spacer, 40px); // 25px
}
:root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {
--uc-window-drag-space-pre: 0px; /* Remove pre space */
}
//-- Mixin ---------------------------------------------------------------------
@mixin _remove_spacer_pre() {
@ -24,16 +9,22 @@
@mixin _remove_spacer_post() {
/* Don't need window control */
--uc-window-control-width: 0px;
--uc-window-drag-space-post: 0px;
--uc-widow-control-space: 0px;
}
@mixin _remove_spacer_oneLiner() {
@include Option("userChrome.tabbar.one_liner.tabbar_first") {
@include _remove_spacer_pre;
@include Option("userChrome.tabbar.as_titlebar") {
#tabbrowser-tabs {
@include _remove_spacer_post;
}
}
}
@include NotOption("userChrome.tabbar.one_liner.tabbar_first") {
@include _remove_spacer_post;
@include NotOption("userChrome.tabbar.as_titlebar") {
@include _remove_spacer_post;
}
}
}
@ -110,25 +101,9 @@
}
}
/* Windows */
@include OS($win7, $win8) {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 105px;
}
}
@include OS($win10) {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 138px;
}
}
/* Use this pref to check Mac OS where window controls are on left */
/* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */
@include OS($mac) {
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 72px;
}
:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar {
@include _oneLiner_navBar_borderPadding {
border-inline-start-width: var(--uc-widow-control-space);

27
src/tabbar/layout/_window_control_size.scss Normal file
View file

@ -0,0 +1,27 @@
:root {
--uc-window-control-width: 0px; /* Same as .titlebar-buttonbox-container - Space reserved for window controls */
--uc-window-drag-space-pre: 0px; /* Same as .titlebar-spacer[type="pre-tabs"] - Extra space reserved on both sides of the nav-bar to be able to drag the window */
--uc-window-drag-space-post: 0px; /* Same as .titlebar-spacer[type="post-tabs"] */
--uc-widow-control-space: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-post));
}
:root:is([tabsintitlebar], [sizemode="fullscreen"]) {
--uc-window-control-width: 84px; /* 84px is default value of linux */
--uc-window-drag-space-pre: var(--uc-title-pre-spacer, 40px); // 30px
--uc-window-drag-space-post: var(--uc-title-post-spacer, 40px); // 25px
@include OS($win7, $win8) {
--uc-window-control-width: 105px;
}
@include OS($win10) {
--uc-window-control-width: 138px;
}
@include OS($mac) {
--uc-window-control-width: 72px;
}
}
:root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {
--uc-window-drag-space-pre: 0px; /* Remove pre space */
}