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

Fix: Tab Group supports #1086

Browse source
This commit is contained in:
alstjr7375 2025-04-06 00:00:00 +09:00
parent f547441c6f
commit f53624ab6e
7 changed files with 205 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

112
css/leptonChrome.css generated
View file

@ -4239,6 +4239,15 @@
.tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
max-width: var(--tab-max-width) !important; /* Original: 225px */
}
#tabbrowser-tabs[orient="horizontal"]
tab-group[collapsed]
> .tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
min-width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
margin: 0 !important;
overflow-clip-margin: 0;
}
/* neighbouring tabs should "pinch" together */
:root[customizing="true"] #tabbrowser-arrowscrollbox-periphery,
#tabbrowser-tabs:not([hasadjacentnewtabbutton]):not([overflow="true"])
@ -4246,6 +4255,9 @@
> #tabbrowser-arrowscrollbox-periphery {
min-width: 3px;
}
#tabbrowser-tabs[orient="horizontal"] .tab-group-label-container {
margin-inline-start: 4px !important;
}
@media not -moz-pref("userChrome.tab.photon_like_padding") {
@media -moz-pref("userChrome.tab.lepton_like_padding") {
#TabsToolbar:not([multibar]) .tabbrowser-tab[pinned] {
@ -6920,6 +6932,9 @@
margin-top: 0px !important;
margin-bottom: 0px !important;
}
#tabbrowser-tabs[orient="horizontal"] tab-group .tabbrowser-tab:is([selected], [multiselected]) .tab-group-line {
transform: translateY(calc(var(--tab-group-line-thickness) * -1));
}
/* Remove line at Toolbar's top */
#tabbrowser-tabs {
z-index: 1 !important;
@ -6977,6 +6992,19 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:is(:-moz-lwtheme, [lwtheme])
#tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:is(:-moz-lwtheme, [lwtheme])
#tabbrowser-tabs[orient="horizontal"]:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected] {
/* Original: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none)
*/
@ -6997,6 +7025,19 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:not([lwtheme-image]):is(:-moz-lwtheme, [lwtheme])
#tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:not([lwtheme-image]):is(:-moz-lwtheme, [lwtheme])
#tabbrowser-tabs[orient="horizontal"]:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected] {
background-image: linear-gradient(transparent, transparent),
linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-additional-images, none) !important;
@ -7017,6 +7058,12 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]),
#tabbrowser-tabs:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]) {
/* Original:
background-attachment: scroll, scroll, fixed;
@ -7789,6 +7836,13 @@
opacity: var(--tab-separator-opacity);
}
}
#tabbrowser-tabs[orient="horizontal"]
tab-group:has(.tabbrowser-tab:last-child:is(:hover, [selected]))
+ .tabbrowser-tab
.tab-stack::before,
#tabbrowser-tabs[orient="horizontal"] tab-group[collapsed] + .tabbrowser-tab .tab-stack::before {
opacity: 0 !important;
}
#navigator-toolbox:not([movingtab])
.tabbrowser-tab:is([first-visible-unpinned-tab], :nth-child(1 of :not([pinned], [hidden]))):is(
[visuallyselected],
@ -18425,6 +18479,15 @@
.tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
max-width: var(--tab-max-width) !important; /* Original: 225px */
}
#tabbrowser-tabs[orient="horizontal"]
tab-group[collapsed]
> .tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
min-width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
margin: 0 !important;
overflow-clip-margin: 0;
}
}
@media (-moz-bool-pref: "userChrome.padding.tabbar_width") {
:root[customizing="true"] #tabbrowser-arrowscrollbox-periphery,
@ -18434,6 +18497,11 @@
min-width: 3px;
}
}
@media (-moz-bool-pref: "userChrome.padding.tabbar_width") {
#tabbrowser-tabs[orient="horizontal"] .tab-group-label-container {
margin-inline-start: 4px !important;
}
}
@media (-moz-bool-pref: "userChrome.padding.tabbar_width") and (not (-moz-bool-pref: "userChrome.tab.photon_like_padding")) and (-moz-bool-pref: "userChrome.tab.lepton_like_padding") {
#TabsToolbar:not([multibar]) .tabbrowser-tab[pinned] {
padding-inline: 1px !important;
@ -21536,6 +21604,9 @@
margin-top: 0px !important;
margin-bottom: 0px !important;
}
#tabbrowser-tabs[orient="horizontal"] tab-group .tabbrowser-tab:is([selected], [multiselected]) .tab-group-line {
transform: translateY(calc(var(--tab-group-line-thickness) * -1));
}
/* Remove line at Toolbar's top */
#tabbrowser-tabs {
z-index: 1 !important;
@ -21597,6 +21668,19 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:is(:-moz-lwtheme, [lwtheme])
#tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:is(:-moz-lwtheme, [lwtheme])
#tabbrowser-tabs[orient="horizontal"]:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected] {
/* Original: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none)
*/
@ -21618,6 +21702,19 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:not([lwtheme-image]):is(:-moz-lwtheme, [lwtheme])
#tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:not([lwtheme-image]):is(:-moz-lwtheme, [lwtheme])
#tabbrowser-tabs[orient="horizontal"]:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected] {
background-image: linear-gradient(transparent, transparent),
linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-additional-images, none) !important;
@ -21637,6 +21734,12 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]),
#tabbrowser-tabs:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]) {
/* Original:
background-attachment: scroll, scroll, fixed;
@ -22547,6 +22650,15 @@
opacity: var(--tab-separator-opacity);
}
}
@media (-moz-bool-pref: "userChrome.tab.dynamic_separator") {
#tabbrowser-tabs[orient="horizontal"]
tab-group:has(.tabbrowser-tab:last-child:is(:hover, [selected]))
+ .tabbrowser-tab
.tab-stack::before,
#tabbrowser-tabs[orient="horizontal"] tab-group[collapsed] + .tabbrowser-tab .tab-stack::before {
opacity: 0 !important;
}
}
@media (-moz-bool-pref: "userChrome.tab.dynamic_separator") {
#navigator-toolbox:not([movingtab])
.tabbrowser-tab:is([first-visible-unpinned-tab], :nth-child(1 of :not([pinned], [hidden]))):is(

54
css/leptonChromeESR.css generated
View file

@ -4562,6 +4562,15 @@
.tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
max-width: var(--tab-max-width) !important; /* Original: 225px */
}
#tabbrowser-tabs[orient="horizontal"]
tab-group[collapsed]
> .tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
min-width: 0 !important;
max-width: 0 !important;
padding: 0 !important;
margin: 0 !important;
overflow-clip-margin: 0;
}
/* neighbouring tabs should "pinch" together */
:root[customizing="true"] #tabbrowser-arrowscrollbox-periphery,
#tabbrowser-tabs:not([hasadjacentnewtabbutton]):not([overflow="true"])
@ -4569,6 +4578,9 @@
> #tabbrowser-arrowscrollbox-periphery {
min-width: 3px;
}
#tabbrowser-tabs[orient="horizontal"] .tab-group-label-container {
margin-inline-start: 4px !important;
}
@supports not -moz-bool-pref("userChrome.tab.photon_like_padding") {
@supports -moz-bool-pref("userChrome.tab.lepton_like_padding") {
#TabsToolbar:not([multibar]) .tabbrowser-tab[pinned] {
@ -7356,6 +7368,9 @@
margin-top: 0px !important;
margin-bottom: 0px !important;
}
#tabbrowser-tabs[orient="horizontal"] tab-group .tabbrowser-tab:is([selected], [multiselected]) .tab-group-line {
transform: translateY(calc(var(--tab-group-line-thickness) * -1));
}
/* Remove line at Toolbar's top */
#tabbrowser-tabs {
z-index: 1 !important;
@ -7413,6 +7428,19 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:is(:-moz-lwtheme, [lwtheme])
#tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:is(:-moz-lwtheme, [lwtheme])
#tabbrowser-tabs[orient="horizontal"]:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected] {
/* Original: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none)
*/
@ -7433,6 +7461,19 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:not([lwtheme-image]):is(:-moz-lwtheme, [lwtheme])
#tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
:root:not([lwtheme-image]):is(:-moz-lwtheme, [lwtheme])
#tabbrowser-tabs[orient="horizontal"]:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected] {
background-image: linear-gradient(transparent, transparent),
linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-additional-images, none) !important;
@ -7453,6 +7494,12 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]),
#tabbrowser-tabs:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]) {
/* Original:
background-attachment: scroll, scroll, fixed;
@ -8231,6 +8278,13 @@
opacity: var(--tab-separator-opacity);
}
}
#tabbrowser-tabs[orient="horizontal"]
tab-group:has(.tabbrowser-tab:last-child:is(:hover, [selected]))
+ .tabbrowser-tab
.tab-stack::before,
#tabbrowser-tabs[orient="horizontal"] tab-group[collapsed] + .tabbrowser-tab .tab-stack::before {
opacity: 0 !important;
}
#navigator-toolbox:not([movingtab])
.tabbrowser-tab:is([first-visible-unpinned-tab], :nth-child(1 of :not([pinned], [hidden]))):is(
[visuallyselected],

11
src/padding/_tabbar_width.scss
View file

@ -92,6 +92,14 @@
}
.tabbrowser-tab[fadein]:not([pinned]):not([style*="max-width"]) {
max-width: var(--tab-max-width) !important; /* Original: 225px */
#tabbrowser-tabs[orient="horizontal"] tab-group[collapsed] > & {
min-width: 0 !important;
max-width: 0 !important;
padding: 0 !important;;
margin: 0 !important;
overflow-clip-margin: 0;
}
}
/* neighbouring tabs should "pinch" together */
@ -100,6 +108,9 @@
> #tabbrowser-arrowscrollbox > #tabbrowser-arrowscrollbox-periphery {
min-width: 3px; // With Panorama Tab Groups #643 #846
}
#tabbrowser-tabs[orient="horizontal"] .tab-group-label-container {
margin-inline-start: 4px !important;
}
@include NotOption("userChrome.tab.photon_like_padding") {
@include Option("userChrome.tab.lepton_like_padding") {
#TabsToolbar:not([multibar]) .tabbrowser-tab {

4
src/tab/_connect_to_window.scss
View file

@ -18,6 +18,10 @@
margin-bottom: 0px !important;
}
#tabbrowser-tabs[orient="horizontal"] tab-group .tabbrowser-tab:is([selected], [multiselected]) .tab-group-line {
transform: translateY(calc(var(--tab-group-line-thickness) * -1));
}
/* Remove line at Toolbar's top */
#tabbrowser-tabs {
z-index: 1 !important;

11
src/tab/selected_tab/_color_like_toolbar.scss
View file

@ -15,6 +15,17 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
#tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected],
#tabbrowser-tabs[orient="horizontal"]:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[selected] {
@include lwtheme(false) {
/* Original: linear-gradient(var(--lwt-selected-tab-background-color, transparent), var(--lwt-selected-tab-background-color, transparent)), linear-gradient(var(--toolbar-bgcolor), var(--toolbar-bgcolor)), var(--lwt-header-image, none)

6
src/tab/selected_tab/_multi_selected.scss
View file

@ -10,6 +10,12 @@
> #tabbrowser-arrowscrollbox
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]),
#tabbrowser-tabs:not([movingtab])
> #tabbrowser-arrowscrollbox
> tab-group
> .tabbrowser-tab
> .tab-stack
> .tab-background[multiselected]:not([selected]) {
/* Original:
background-attachment: scroll, scroll, fixed;

7
src/tab/unselected_tab/_dynamic_separator.scss
View file

@ -95,6 +95,13 @@
}
}
#tabbrowser-tabs[orient="horizontal"] tab-group {
&:has(.tabbrowser-tab:last-child:is(:hover, [selected])) + .tabbrowser-tab .tab-stack::before,
&[collapsed] + .tabbrowser-tab .tab-stack::before {
opacity: 0 !important;
}
}
#navigator-toolbox:not([movingtab])
.tabbrowser-tab:is([first-visible-unpinned-tab], :nth-child(1 of :not([pinned], [hidden]))):is([visuallyselected], [multiselected], :hover)
.tab-stack::before,