A couple of theme/tab height questions

[Mojira]

Okay, what's probably the easiest question first - I've been looking at creating my own what used to be called Persona, but is now seemingly called "Lightweight Theme", but all the how-tos I've found have either required the LT to be uploaded to the Mozilla website, or have reams of code in loads of files which I'd have to turn into an .xpi which would still, ultimately require me to upload the picture(s) I want to use somewhere, although not necessarily to a Mozilla site. Well, I'm looking to use pictures of my girlfriend, which she's happy for me to use, but wouldn't be happy to have published on the internet in any fashion.

It's my understanding that the way LTs work is to download the pictures for whatever the last selected one was and then use those. Currently these are in the "lwtheme" folder in my profile and are called "lightweighttheme-footer-1280x1024" and "lightweighttheme-header-1280x1024", without any file extensions. What I want to know is can I just replace those files with pictures that I want to use? All sources I've found have said that the dimensions should be either 3,000px wide and 100px tall or 3,000px wide and 200px tall, so I assume that the numbers listed there aren't in fact correct dimensions.

I would just try this, but I don't want to risk the possibility of breaking anything irreparably, even if I can probably just rename the files with an extension of "backup" and restore them if I do.

The second, and possibly more difficult question is about tab height. I used to use the Classic Compact theme, but that broke when 29 came out and the author appears to have disappeared from the internet since saying he was working on updating it. Unfortunately, this has spoilt me for screen space, and I really dislike tall tabs. I've not yet found a theme that effectively (and attractively) gives me small tabs. I've tried looking at a couple of how-to guides to create my own theme entirely, but it's way beyond my skill set.

What I have found, though, is some places talking about adding code to the userChrome.css file I've got. Specifically, this code:

Code: Select all

@namespace url

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

.tabbrowser-tabs *|tab {

   font-size: 12px !important;
   height:    15px !important;}

The problem is that Firefox doesn't like this very much and, rather than actually making the tabs smaller, what this does is make only the top part of them be counted and the rest of the tab extend below the line where the tab is supposed to end. Furthermore, it makes it odd and clicking on one tab may actually activate the tab below. It's extremely ugly, difficult to read what tab is what, and hampers functionality.

Is there any way to make Firefox take up less screen real estate while keeping it functional and not ugly? A way, that is, that doesn't require me to learn a great deal of coding and create lots and lots of files?

Any help and/or advice greatly appreciated.

[LIMPET235]

Moving to Theme Dev...

[Aris]

You are probably looking for something like this to start with:

Code: Select all

#tabbrowser-tabs{
   min-height: 0px !important;
   height:22px !important;
   max-height:22px !important;
   margin-bottom:1px !important;
}
#tabbrowser-tabs .tab-content{
   margin-top: -8px !important;
}
#nav-bar:-moz-lwtheme,
#TabsToolbar:-moz-lwtheme{
   border:0 !important;
   box-shadow:none !important;
   background:none !important;
}

[Mojira]

Thanks for the reply, but Firefox doesn't seem to like that. The tabs are successfully smaller, but when there's enough for there to be more than one row the tab bar extends downwards enough to encompass 3 rows. If the browser window had that many tabs and was loaded from TabMix Plus' session manager, then only the last line of tabs is displayed at the top, with the rest of the bar being empty space and there being no navigation buttons with which to scroll up to see other other tabs, and if new tabs are created to make the tabs multi-row, then the space below the top line is again empty, with the new tabs simply not appearing.

[Aris]

I should have mentioned this before. Of course this css only works for "default" tab appearance and not multirowed tabs. Also session managers and tab ui tweaks often don't play well.

[Mojira]

Okay, thanks. Any other suggestions? At this stage, I'd take a suggestion for a compact theme that isn't ugly, although I'd have preferred to be able to rustle up something specifically for me.

Although, I have to say, I don't know why, but before I input your code I renamed the css file that I had. When your code didn't work, I renamed the old css file back and, although it's still got the issue with tabs hanging below the line they're supposed to, it no longer has the issue where clicking near the top of a tab can activate the tab above it.

Odd, as it's exactly the same code as before, just behaving differently.

[patrickjdempsey]

Modding the default theme plus TabMixPlus? All bets are off and good luck. You've got convoluted code on top of convoluted code. You might try userStyles.org as those guys are doing lots of mods on top of the default.