3.5/1.9.1 multirow tabs dirty guide

Discussion about official Mozilla Firefox builds
Post Reply
DeathWolf
Posts: 85
Joined: June 24th, 2007, 7:14 am

3.5/1.9.1 multirow tabs dirty guide

Post by DeathWolf »

Since TMP & Tabkit are broken with anything but the 3.0.x series and trunk up to around nov or so... I decided to do something.
(And anyway TMP has a few nasty outstanding bugs)
This is untested on Trunk, but I believe it'll work on it.
So here's my small and dirty guide to do it.

Basically you need to do two things.
1.First install http://saber.kawaii-shoujo.net/Various/ ... jo.net.xpi
That's just a little ext containing only a single xbl file to override some tabbar stuff.
2.add the following to your userchrome.css:

Code: Select all

.tabbrowser-tabs[flowing="singlebar"] .tabs-frame,
.tabbrowser-tabs[flowing="singlebar"] .tabs-frame>box,
.tabbrowser-tabs:not([flowing]) .tabbrowser-arrowscrollbox,
.tabbrowser-tabs:not([flowing]) .tabbrowser-arrowscrollbox .scrollbox
{
display:block !important;
overflow:visible !important;
}

.tabbrowser-arrowscrollbox{
-moz-binding:url(chrome://bindings/content/scrollbox.v2.xml#arrowscrollbox) !important;
}
.tabbrowser-tabs .tabbrowser-tab
{
vertical-align:bottom !important;
-moz-box-sizing: border-box !important;
min-width: 192px !important;/* width of tab */
max-width: 192px !important
}


This effectively replaces the tabbar default binding for arrowscrollbox, and adds some (more or less classic) code to have the multirow tabbar.

A few more quick and dirty tricks:
If you want to remove the alltabs button:

Code: Select all

.tabs-alltabs-button{display: none !important}

If you want to remove the alltabs icon, but not the drop down:

Code: Select all

.tabs-alltabs-button .toolbarbutton-icon{display: none !important}

And to remove the new tab button.

Code: Select all

.tabs-newtab-button{display: none !important}
User avatar
alterna
Posts: 3993
Joined: January 16th, 2007, 8:27 am
Location: Big Apple

Re: 3.5/1.9.1 multirow tabs dirty guide

Post by alterna »

both of the following seem to work for multirow tabs both in trunk and branch

Code: Select all

/* Tab Browser, replaces the horizontal arrowscrollbox

 * with an overflow scroll panel, such as in:

 * http://userstyles.org/styles/481

 */



 /* These are the values to change the box height.

  */

 tabs.tabbrowser-tabs

  {

    height: 58px !important;

    max-height: 58px !important;

    min-height: 58px !important;

  }

 tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox,

 tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox,

 tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox > box

  {

    /* Less than height of the tabbrowser,

     * line it up with the bottom of yours.

     */

    height: 54px !important;

    max-height: 54px !important;

    min-height: 54px !important;

  }



 /* hide the scroll arrows and alltabs button */

 .tabs-alltabs-stack,

 tabs.tabbrowser-tabs .scrollbutton-up,

 tabs.tabbrowser-tabs .scrollbutton-down-stack

  {

    display: none !important;

  }



 /* box default */

 tabs.tabbrowser-tabs,

 tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox,

 tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox

  {

    display: -moz-box !important;

    padding: 0 !important;

  }

 tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox > box

  {

    display: block !important;

    min-width: 0 !important;

    margin: 0 !important;

    overflow-y: auto !important;

    padding: 0 0 0 1px !important;

  }



 /* tab default */

 tab.tabbrowser-tab

  {

    display: -moz-box !important;

    height: 25px !important;

    margin-bottom: 1px !important;

    margin-left: 0 !important;

    margin-right: 1px !important;

    margin-top: 1px !important;

    padding: 0 !important;

    -moz-box-sizing: border-box !important;



    border: 1px solid !important;

    /*

    -moz-border-top-colors: ThreeDLightShadow ThreeDHighlight !important;

    -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow !important;

    -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow !important;

    -moz-border-left-colors: ThreeDLightShadow ThreeDHighlight !important;

    */

    -moz-border-radius: 0 !important;

  }

 tab.tabbrowser-tab .tab-close-button,

 tab.tabbrowser-tab .tab-image-left,

 tab.tabbrowser-tab .tab-image-middle,

 tab.tabbrowser-tab .tab-image-right,

 tab.tabbrowser-tab .tab-text

  {

    margin: 0 !important;

    padding: 0 !important;

  }

 tab.tabbrowser-tab .tab-text

  {

    min-width: 100px !important;

  }



/* Selected tabs */

 tab.tabbrowser-tab[selected="true"]

  {

    margin-bottom: 0 !important;

    margin-left: 0 !important;

    margin-right: 1px !important;

    margin-top: 1px !important;



    border: 2px solid !important;

    -moz-border-bottom-colors: ThreeDLightShadow ThreeDHighlight !important;

    -moz-border-left-colors: ThreeDDarkShadow ThreeDShadow !important;

    -moz-border-top-colors: ThreeDDarkShadow ThreeDShadow !important;

    -moz-border-right-colors: ThreeDLightShadow ThreeDHighlight !important;

    -moz-border-radius: 0 !important;

  }


Code: Select all



tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox, tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox, tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox > box { height:46px !important; max-height:46px !important; min-height:46px !important;}



tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox, tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox { padding:0px !important; margin-bottom:4px !important;}



tabs.tabbrowser-tabs .tabbrowser-arrowscrollbox > scrollbox > box { margin:0 !important; padding:0 0 0 1px  !important; display:block !important; overflow-y:auto !important;}



tab.tabbrowser-tab { margin:0px 0px 0px 0px !important; border-bottom:3px solid #C1C1B7 !important; min-width:120px !important; }



tab.tabbrowser-tab:hover { border-top:0 !important;}



from http://userstyles.org/
"So it goes" - Kurt Vonnegut, Jr.
User avatar
steviex
Moderator
Posts: 28902
Joined: August 12th, 2006, 8:27 am
Location: Middle England

Re: 3.5/1.9.1 multirow tabs dirty guide

Post by steviex »

Moving to Firefox Builds, as you are using Pre-release versions of Firefox...
Only two things are infinite, the universe and human stupidity, and I'm not sure about the former. -Albert Einstein

Please DO NOT PM me for support... Lets keep it on the board, so we can all learn.
User avatar
alterna
Posts: 3993
Joined: January 16th, 2007, 8:27 am
Location: Big Apple

Re: 3.5/1.9.1 multirow tabs dirty guide

Post by alterna »

btw, tabkit seems working for me on both latest trunk and branch.
"So it goes" - Kurt Vonnegut, Jr.
DeathWolf
Posts: 85
Joined: June 24th, 2007, 7:14 am

Re: 3.5/1.9.1 multirow tabs dirty guide

Post by DeathWolf »

alterna wrote:btw, tabkit seems working for me on both latest trunk and branch.

Check your error log, you'll see half a gazillion errors. You'll also notice your recent pages drop down for back forward is likely broken.
(tabkit removes an important element, the arrowscrollbox)

Same issue with TMP.

EDIT:
Also the first one seems to making ugly tabs in a fixed height tab bar.(Tried tweaking it, but without success)

EDIT2:
same issue with the second one, height is fixed.
it doesnt add rows as it needs them.
User avatar
alterna
Posts: 3993
Joined: January 16th, 2007, 8:27 am
Location: Big Apple

Re: 3.5/1.9.1 multirow tabs dirty guide

Post by alterna »

^Too true about fixed height in the codes

I haven't had a chance to try your hack...will do. Thanks for heads up.

On branch, tabkit scrollbar appears when my default three rows are exceeded, and rightclick dropdown from back/forward works fine

also, have no tabkit errors (though plenty of usual css warnings)
"So it goes" - Kurt Vonnegut, Jr.
DeathWolf
Posts: 85
Joined: June 24th, 2007, 7:14 am

Re: 3.5/1.9.1 multirow tabs dirty guide

Post by DeathWolf »

odd, I get a lot of tsbo errors&such. But maybe that was only on trunk, cant remember.
Will check again later.
Post Reply