MozillaZine


Firefox Proton: center tab label

User Help for Mozilla Firefox
Yaron10
 
Posts: 455
Joined: July 5th, 2011, 6:32 am

Post Posted June 7th, 2021, 3:01 pm

Hello,

The following CSS code used to center the tab label prior to Proton.

Code: Select all
.tab-label { -moz-box-flex: 1 !important; text-align: center !important; }


Any idea how to achieve that in Proton?

Thank you.

morat
 
Posts: 4696
Joined: February 3rd, 2009, 6:29 pm

Post Posted June 7th, 2021, 8:10 pm

The following entry works after I removed the align="start" attribute in the parent vbox.tab-label-container element.

Code: Select all
.tab-label {
  text-align: center !important;
}

I guess the tweak isn't possible using the userChrome.css file.

Similar thread: viewtopic.php?p=14894394#p14894394

P.S.

Maybe there is a trick to workaround the align attribute of the xul:vbox tag.

Similar thread: viewtopic.php?p=14815952#p14815952

Yaron10
 
Posts: 455
Joined: July 5th, 2011, 6:32 am

Post Posted June 8th, 2021, 1:34 am

@morat,

Thanks for replying. I appreciate it.

I haven't modified FF source files since FF 57.
I suppose that removing align="start" from tabbrowser-tab.js is not enough. Can you please elaborate?

morat
 
Posts: 4696
Joined: February 3rd, 2009, 6:29 pm

Post Posted June 8th, 2021, 6:10 am

Sorry, I don't know a solution.

You can remove the align attribute using the Page Inspector tab in the Browser Toolbox utility.

i.e. right click on align="start" in parent vbox.tab-label-container element > Attributes > Remove Attribute "align"

Browser Toolbox
http://developer.mozilla.org/docs/Tools/Browser_Toolbox

Page Inspector - Element popup context menu
http://developer.mozilla.org/docs/Tools ... ntext_menu

Yaron10
 
Posts: 455
Joined: July 5th, 2011, 6:32 am

Post Posted June 8th, 2021, 8:27 am

So apparently it should also work by modifying tabbrowser-tab.js.

What else should I change so that FF reads the new modified file?
Hash? Module?

Thank you.

morat
 
Posts: 4696
Joined: February 3rd, 2009, 6:29 pm

Post Posted June 8th, 2021, 9:46 am

Do you really want to hack the omni.ja file for a style tweak? Seems like too much trouble.

I think the omni.ja files are signed so the modifying hack may not be possible. I know I can't hack a signed extension so I assume I can't hack a signed omni.ja file. That's the whole point of signing.

Yaron10
 
Posts: 455
Joined: July 5th, 2011, 6:32 am

Post Posted June 8th, 2021, 2:12 pm

@morat,

Thanks again. I've found a CSS solution. :)


Code: Select all
.tab-label-container.proton { display: grid !important;  justify-items: safe center !important; }
.tab-label { overflow: hidden !important; }


Seems to work properly with Proton enabled.

***

Credit and many thanks to @sean1138 in https://github.com/black7375/Firefox-UI-Fix/issues/71.

morat
 
Posts: 4696
Joined: February 3rd, 2009, 6:29 pm

Post Posted June 8th, 2021, 2:25 pm

Very nice. I shared the solution with charscot in the other thread.

charscot
 
Posts: 188
Joined: August 14th, 2006, 4:38 pm
Location: London, UK

Post Posted June 8th, 2021, 2:25 pm

Thanks for that worked for me. Many thanks for passing this info on.
Cheers

Rich

Yaron10
 
Posts: 455
Joined: July 5th, 2011, 6:32 am

Post Posted June 8th, 2021, 3:31 pm

My pleasure.

Yaron10
 
Posts: 455
Joined: July 5th, 2011, 6:32 am

Post Posted June 9th, 2021, 7:02 am

IMPORTANT.

You need to add:

Code: Select all
.tab-close-button
{
   width: unset !important;
   padding-inline-start: 7px !important;
}


See the last comments in https://github.com/black7375/Firefox-UI-Fix/issues/71.

Return to Firefox Support


Who is online

Users browsing this forum: Bing [Bot] and 6 guests