FF 58 - Auothide last tab

User Help for Mozilla Firefox
ejm_dc
Posts: 70
Joined: December 20th, 2003, 4:12 pm

FF 58 - Auothide last tab

Post by ejm_dc »

Does anyone know if there is any CSS that would hide the tab bar if there is only one tab?

The following from http://forums.mozillazine.org/viewtopic ... &t=2706317, hides the tab but leaves the bar with the new tab button (plus sign). Is this doable?

Code: Select all

#TabsToolbar { border : none !important;}
#TabsToolbar { min-height: 0px !important;}
#tabbrowser-tabs tab[first-tab='true'][last-tab='true'] { display:none !important; }
Any options? for getting ride of the tab bar when there is only one tab open (FF 58)?

Thanks!
Last edited by ejm_dc on February 20th, 2018, 8:12 pm, edited 1 time in total.
morat
Posts: 6403
Joined: February 3rd, 2009, 6:29 pm

Re: FF 58 - Auothide last tab

Post by morat »

Try this:

Code: Select all

/* Firefox userChrome.css */

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#TabsToolbar {
  border: none !important;
  min-height: 0px !important;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
  display: none !important;
}
http://kb.mozillazine.org/UserChrome.css

CustomCSSforFx
http://github.com/Aris-t2/CustomCSSforFx

tab_close_hidden_for_only_one_visible_tab.css
http://github.com/Aris-t2/CustomCSSforF ... le_tab.css
ejm_dc
Posts: 70
Joined: December 20th, 2003, 4:12 pm

Re: FF 58 - Auothide last tab

Post by ejm_dc »

Thanks! Unfortunately, that doesn't seem to work for me. I'm using CustomCSSforFX and included it in my_userChrome.css, but it does not remove the last tab (or any tabs) at all.
morat
Posts: 6403
Joined: February 3rd, 2009, 6:29 pm

Re: FF 58 - Auothide last tab

Post by morat »

Did you try the first tweak I posted?

Aris' tweak hides the tab close button if there is only one tab.
ejm_dc
Posts: 70
Joined: December 20th, 2003, 4:12 pm

Re: FF 58 - Auothide last tab

Post by ejm_dc »

morat wrote:Did you try the first tweak I posted? Aris' tweak hides the tab close button if there is only one tab.
Yes. I did. It didn't work even when there was only one tab, possibly because I was using CustomCSSforFX and had the tabs below the bookmark bar.

So, I tried it without CustomCSSforFX (i.e., just using a blank userChrome.css file with the code) and it does remove the tab but like the tweak I copied above the new tab button plus sign remains.

The code I copied in my first post works with (and without) CustomCSSforFX but again it leaves the new tab button and the tab bar.

Any ideas for code that will also remove the new tab button and the tab bar itself.
morat
Posts: 6403
Joined: February 3rd, 2009, 6:29 pm

Re: FF 58 - Auothide last tab

Post by morat »

Sorry, I misread the post.

I think what you are asking is not possible with css.
aborix
Posts: 29
Joined: October 23rd, 2017, 1:23 pm

Re: FF 58 - Auothide last tab

Post by aborix »

So let's try it with JavaScript.

Put this code into the userChrome.css:

Code: Select all

toolbarbutton#alltabs-button {
  -moz-binding: url(userChrome.xml#execute_javascript_code);
}
Also create another text file, name it "userChrome.xml" and put this code into it:

Code: Select all

<?xml version="1.0"?>

<bindings id="generalBindings"
  xmlns="http://www.mozilla.org/xbl"
  xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
  xmlns:xbl="http://www.mozilla.org/xbl">

  <binding id="execute_javascript_code" extends="chrome://global/content/bindings/toolbarbutton.xml#menu">
    <implementation>
      <constructor>
        <![CDATA[

          (function() {
            if (window.ucjsExecuted)
              return;
            ucjsExecuted = true;
            function showHideTabbar() {
              document.getElementById('TabsToolbar').style.visibility =
                (gBrowser.visibleTabs.length == 1) ? 'collapse' : '';
            };
            showHideTabbar();
            let observer = new MutationObserver(showHideTabbar);
            observer.observe(document.getElementById('tabbrowser-tabs'), {childList: true});
          })();

        ]]>
      </constructor>
    </implementation>
  </binding>
</bindings>
Copying from the code box may add spaces at the beginning of each line. Remove the spaces from the first line.
Then put the file into the chrome directory too.
Last edited by aborix on February 22nd, 2018, 12:03 am, edited 1 time in total.
ejm_dc
Posts: 70
Joined: December 20th, 2003, 4:12 pm

Re: FF 58 - Auothide last tab

Post by ejm_dc »

Oh, Brilliant!!! That works perfectly! Thanks so much!!!
aborix wrote:So let's try it with JavaScript.

Put this code into the userChrome.css:

Code: Select all

toolbarbutton#alltabs-button {
  -moz-binding: url(userChrome.xml#execute_javascript_code);
}
Also create another text file, name it "userChrome.xml" and put this code into it:

Code: Select all

<?xml version="1.0"?>

<bindings id="generalBindings"
  xmlns="http://www.mozilla.org/xbl"
  xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
  xmlns:xbl="http://www.mozilla.org/xbl">

  <binding id="execute_javascript_code" extends="chrome://global/content/bindings/toolbarbutton.xml#menu">
    <implementation>
      <constructor>
        <![CDATA[

          (function() {
            if (window.ucjsExecuted)
              return;
            ucjsExecuted = true;
            function showHideTabbar() {
              document.getElementById('TabsToolbar').style.visibility =
                (gBrowser.visibleTabs.length == 1) ? 'collapse' : '';
            };
            showHideTabbar();
            let observer = new MutationObserver(showHideTabbar);
            observer.observe(document.getElementById('tabbrowser-tabs'), {childList: true});
          })();

        ]]>
      </constructor>
    </implementation>
  </binding>
</bindings>
Copying from the code box may add spaces at the begin of each line. Remove the spaces from the first line.
Then put the file into the chrome directory too.
aborix
Posts: 29
Joined: October 23rd, 2017, 1:23 pm

Re: FF 58 - Auothide last tab

Post by aborix »

You're welcome.
GKnight
Posts: 24
Joined: November 7th, 2013, 8:51 am

Re: FF 58 - Auothide last tab

Post by GKnight »

@ aborix - thanks for the JavaScript code! It works, but on Windows 10 it also hides the Window control buttons (minimize/maximize/close). The buttons still work but become hidden (kind of placeholders if it makes sense).
aborix
Posts: 29
Joined: October 23rd, 2017, 1:23 pm

Re: FF 58 - Auothide last tab

Post by aborix »

Do you have the titlebar shown or hidden? Same question also for the menubar.
In which bar shall the control buttons be shown and are not?
ejm_dc
Posts: 70
Joined: December 20th, 2003, 4:12 pm

Re: FF 58 - Auothide last tab

Post by ejm_dc »

FWIW, I have the titlebar and menubars shown, and the javascript does not affect the window control buttons.
GKnight
Posts: 24
Joined: November 7th, 2013, 8:51 am

Re: FF 58 - Auothide last tab

Post by GKnight »

aborix wrote:Do you have the titlebar shown or hidden? Same question also for the menubar.
In which bar shall the control buttons be shown and are not?
Both are hidden. If I enable the title bar, then this works well. Interesting. With Title bar disabled, I just see the black bar on top of the window with no control buttons but there are place holders for them which activate (change color to grey) if I hover mouse over them, and they still work if I click the mouse.

With Title bar activated, this only looks good with the single tab (which is now hidden). If I have multiple tabs open, it adds the title bar on top of the window which is a waste of space.
aborix
Posts: 29
Joined: October 23rd, 2017, 1:23 pm

Re: FF 58 - Auothide last tab

Post by aborix »

GKnight wrote:With Title bar disabled, I just see the black bar on top of the window with no control buttons
May I see a screenshot of this, please?
GKnight
Posts: 24
Joined: November 7th, 2013, 8:51 am

Re: FF 58 - Auothide last tab

Post by GKnight »

aborix wrote:
GKnight wrote:With Title bar disabled, I just see the black bar on top of the window with no control buttons
May I see a screenshot of this, please?
Here's the window with single tab (maximized):

Image

Here's what happens when I hover the mouse where minimize button should be (and it actually works, you just don't see the button):

Image

It gets weird if I open another tab. It adds a black bar on top (see below). If I minimize & maximize the window, black bar disappears and it looks normal (with visible window control buttons).

Image
Locked