MozillaZine

Australis Ico/Text, Text Only and more...

Discussion of general topics about Mozilla Firefox
Frank Lion

User avatar
 
Posts: 19425
Joined: April 23rd, 2004, 6:59 pm
Location: ... The Exorcist....United Kingdom

Post Posted March 30th, 2014, 4:34 pm

patrickjdempsey wrote:Or background:unset would probably get it as well. ;)

You love using that unset ever since you first found it, don't you? :) You're like the devs and their latest hsla and calc crush.

But no, actually, unset will indeed disappear that vast purple slab, but will actually leave a 48px blank space in its place for users to wonder '..why is there a 48px blank space at the end of my tabbar?' type way.

Do boot into Aust and look at that 'feature' on default sometime though - it's pretty funny.
Metal Lion latest SeaMonkey & Thunderbird Themes - Sea Monkey and Silver Sea Monkey
"The only thing necessary for the triumph of evil, is for good men to do nothing." - Edmund Burke (attrib.)

patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted March 30th, 2014, 5:31 pm

I do like unset, especially with things like "border" and "background" that have multiple settings, because it just clears out everything.
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

Caspid

User avatar
 
Posts: 574
Joined: December 18th, 2005, 4:01 pm

Post Posted April 1st, 2014, 2:00 pm

Frank Lion wrote:
Caspid wrote:I'm trying to change the back/forward icons and not having a whole lot of luck. Any pointers?

:-k

Caspid wrote:Any pointers?

Yeah, spend 10 minutes to write a post that I can understand what you're trying to do and what you've already done so far.

You might want to change the Forward/Back icons into toadstools for all I know by reading that. :)

ntim wrote:
Caspid wrote:I'm trying to change the back/forward icons and not having a whole lot of luck. Any pointers?

back-button and forward-button are the ids.

Code: Select all
#back-button {
    list-style-image:url(your-image.png) !important;
    -moz-image-region: rect(0,18px,18px,0) !important;
}
#forward-button {
    list-style-image:url(your-image.png) !important;
    -moz-image-region: rect(0,18px,18px,0) !important;
}

Thanks!

sorry I never got back to you Frank, things got busy and I forgot.

Here's what I ended up with:

Image
"Know what I pray for? The strength to change what I can, the inability to accept what I can't, and the incapacity to tell the difference." -Calvin

Frank Lion

User avatar
 
Posts: 19425
Joined: April 23rd, 2004, 6:59 pm
Location: ... The Exorcist....United Kingdom

Post Posted April 1st, 2014, 2:52 pm

Caspid wrote:sorry I never got back to you Frank, things got busy and I forgot.

That's OK, I know what it gets like busy-wise.

Trouble with asking a theme author anything (apparently, I'm supposed to call myself a 'Firefox developer' - not going to happen) is that we tend to know 20 ways of doing anything, so you need to be very specific in what you ask.

Your pic looks good, coming along nicely.
Metal Lion latest SeaMonkey & Thunderbird Themes - Sea Monkey and Silver Sea Monkey
"The only thing necessary for the triumph of evil, is for good men to do nothing." - Edmund Burke (attrib.)

Frank Lion

User avatar
 
Posts: 19425
Joined: April 23rd, 2004, 6:59 pm
Location: ... The Exorcist....United Kingdom

Post Posted April 15th, 2014, 5:48 pm

When I was writing about z-index a while back - viewtopic.php?p=13440563#p13440563 I was struggling at the time to think of a good example of where you would use it, so that one sort of ended up all being a bit theoretical.

Since then, I've come up with a good example that really does show how it can get you out of a tight spot.

The problem - If you have an 'Addons Bar' at the bottom of the browser, then the page loading info shows on directly above it, which seems/is a bit of a waste of space and doesn't look that great. If you know the user will have that bar enabled all the time, it's not a problem as you margin down the .statuspanel-label over the top of the toolbar and the job's done. Trouble is, if that toolbar is toggled off or disabled, then the loading info will vanish off the bottom of the screen. Not ideal.

As css-wise there is no conditional relationship between the label and the addon bar ..you have a problem. In other words there is no 'If that is showing then do this' solution. Normally, it would be long-winded extension stuff to fix that.

However, .css z-index comes to the rescue - if you give the statuspanel a z-index: 1 and the addon bar z-index: 0, then when the addon bar appears it effectively slides up underneath the statuspanel and because the statuspanel doesn't realise it's there then it doesn't move up.

The .statuspanel-label (loading info) shows on top of the addon bar (in this case, already built in to the theme) and if that is toggled off or disabled, the loading info stays where it is, because it never moved in the first place.

Still too theoretical? OK, try this - bottom left corner is that fix and string together enough bits of userChrome.css code together and you can up with something that looks like this -

http://s16.postimg.org/x7quqbchx/Sn0704.png
http://franklion.co.uk/ML-Aust/Pictures/Sn0704.png

That one is a theme, but it could just as easily be your stuff. That's why people learn .css, not because it's that fascinating, but because of what it can do and turn all your 'It would be nice ifs...' into reality.

:)
Metal Lion latest SeaMonkey & Thunderbird Themes - Sea Monkey and Silver Sea Monkey
"The only thing necessary for the triumph of evil, is for good men to do nothing." - Edmund Burke (attrib.)

nicolaos
 
Posts: 82
Joined: December 5th, 2012, 2:57 am
Location: Macedonia, Greece

Post Posted April 25th, 2014, 10:11 am

Please mate... The only thing I'd like would be fully squared tabs (Opx border-radius) along with the cross "Open New Tab".

Do you think you could wite such a code? I found none that working yet.

thank you in advance!

P.S. Forgot to say that I'd like it as native as possible -just fully squared.

Frank Lion

User avatar
 
Posts: 19425
Joined: April 23rd, 2004, 6:59 pm
Location: ... The Exorcist....United Kingdom

Post Posted April 25th, 2014, 2:46 pm

nicolaos wrote:Please mate... The only thing I'd like would be fully squared tabs (Opx border-radius) along with the cross "Open New Tab".

Do you think you could wite such a code? I found none that working yet.

thank you in advance!

P.S. Forgot to say that I'd like it as native as possible -just fully squared.


I don't have access to my full tab fixes atm (which do the full 'unset' routine) but we've done loads of tab styles recently. I'm assuming you want active tab going up like on default and not dropping down like on Macs and also that you'd want the tabs not as tall as default. I've also no idea what native colours your Win8 uses, so you'll have to do the tab backgrounds to suit.

Code: Select all
/*Franks very quick native squared off tabs fix.....*/
.tab-background {
   opacity: 0!important;
}
#tabbrowser-tabs {
   min-height: 25px !important;
       height: 25px !important;
}
.tab-content {
   margin-top: -9px !important;
}   
.tabbrowser-tab {
   border-top: 1px #F0F0F0 solid !important;
   border-radius: 0px !important ;
   background: #CECECE !important;
}
.tabbrowser-tab[selected] {
   background: #F0F0F0 !important;
}
.tabs-newtab-button {
  display: -moz-box !important;
  visibility: visible !important;
  margin-top: -7px !important;
  background: unset!important;}


Tested on default in XP. The proper fix does the tab borders and other stuff properly, but that should get you by for now.

Edit - ooops, forgot to give you a hover state -
Code: Select all
.tabbrowser-tab:not([selected]):hover {
   text-decoration: underline !important;}
Metal Lion latest SeaMonkey & Thunderbird Themes - Sea Monkey and Silver Sea Monkey
"The only thing necessary for the triumph of evil, is for good men to do nothing." - Edmund Burke (attrib.)

harhar
 
Posts: 78
Joined: April 27th, 2012, 4:28 pm

Post Posted April 25th, 2014, 4:46 pm

For native colors everywhere, I guess you'd go and try to build things out of the color names used here: http://cyn.in/home/cyn.in-developers/sys-colors.html ?

I used some of those to customize stuff and noticed it looking different when using the same Firefox profile on another OS.

patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted April 27th, 2014, 1:45 pm

There is no real "native color" for Win Vista/7/8 because the border color is not revealed through a CSS color unless you are in Classic mode. Otherwise, the toolbar color is always light blue, text is always black, and hover/highlight is always bright sky blue. This is a deficiency in how Windows reports it's colors.

Also, that link is offering a download instead of a website which is very strange.
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

LoudNoise
Moderator

User avatar
 
Posts: 40048
Joined: October 18th, 2007, 1:45 pm
Location: Next door to the west

Post Posted April 28th, 2014, 6:57 pm

Moving to General.
Post wrangler
"Choose between the Food Select Feature or other Functions. If no food or function is chosen, Toast is the default."

LIMPET235
Moderator

User avatar
 
Posts: 37610
Joined: October 19th, 2007, 1:53 am
Location: The South Coast of N.S.W. Oz.

Post Posted April 29th, 2014, 8:06 am

Made a Sticky.
Ancient Amateur Astronomer
Win-7-HP/Intel® DualCore-2.0GHz/500G HDD/4 Gig Ram/550Watt PSU/350WattUPS/Firefox-20.0-56.0.1/T-bird-2.0.0.24/SnagIt-v10.0.1/MWP-7.11.0.
RadioYachting.
(Always choose the "Custom" Install.)

Frank Lion

User avatar
 
Posts: 19425
Joined: April 23rd, 2004, 6:59 pm
Location: ... The Exorcist....United Kingdom

Post Posted May 1st, 2014, 1:09 pm

Well, I think I've solved one riddle - viewtopic.php?p=13372259#p13372259

The reason these 'Tabs on Bottom' extensions keep needing to be reset, because the tabs keep going back to the top on FF restart is down to the Addons SDK 'No Restart' stuff.

I say 'these' plural, because someone pointed out another one to me - https://addons.mozilla.org/en-US/firefo ... src=search

I couldn't work out how such simple coding could keep being messed up, but that's why. I must admit, I laughed out loud when I looked at the coding of the above linked one and saw this -

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

/*Frank's Tabs back to Bottom.... added 19.11.13 - Landis*/
/* space */
/* Rem'd for Aurora test - 04.12.13 - Landis */
#TabsToolbar {
   -moz-box-ordinal-group: 2 !important;
}

#addon-bar {
   -moz-box-ordinal-group: 3 !important;
}


:)

Nothing wrong with that, of course. That is why I put code here, even so, I did laugh.

Of course, the code has been slightly changed since then (see very top link above) and although code like this is fine for the individual, you will run into a problem for general use. That is - if a user hides the menubar and Titlebar then the window controls are going to directly overlay the Nav Bar (because dumb old Firefox doesn't realise the tabs have been moved.

Therefore, you either do a fake titlebar there (how is that helping the guy who is obviously trying to maximise space?) or else you show those controls only on hoverover, which is the approach I took on Tiger SP..

Hopefully someone will eventually bring out a proper 'Tabs on Bottom' extension, as I don't fancy doing another one. It is silly though, the whole correct css code is only around 20 lines long and just needs to be in a 'normal' .xpi extension.
Metal Lion latest SeaMonkey & Thunderbird Themes - Sea Monkey and Silver Sea Monkey
"The only thing necessary for the triumph of evil, is for good men to do nothing." - Edmund Burke (attrib.)

patrickjdempsey

User avatar
 
Posts: 23734
Joined: October 23rd, 2008, 11:43 am
Location: Asheville NC

Post Posted May 1st, 2014, 3:43 pm

*FACEPALM*
Tip of the day: If it has "toolbar" in the name, it's crap.
What my avatar is about: https://addons.mozilla.org/en-US/seamonkey/addon/sea-fox/

Frank Lion

User avatar
 
Posts: 19425
Joined: April 23rd, 2004, 6:59 pm
Location: ... The Exorcist....United Kingdom

Post Posted May 1st, 2014, 5:07 pm

Until very recently, this thread was in the Builds forum, where the really tech-savvy betatesters hang out :---) and a while back now, I set a challenge - viewtopic.php?p=13298423#p13298423

The first part was not too bad, but the whole fix (see screenshots of my new theme stuff) was a bit of a pig, that involves heavy margining around, breaking 'conditional Forward' and slapping down the flexing addressbar text. But it wouldn't have been much of a challenge if it was easy, would it? :) ...and I'm glad that a good few of you managed the first part OK. =D>

Anyway, it's that first part that we're going to cover now. Partly because it's about time we did and partly because people here, new people, want this stuff.

So *shudder* into the pig-ugly default theme, gaze in awe at the amazing 'Tree Stump' tabs and the fix will look like this -


Image

Click the link and search for the fullsize amongst the ads. It's there somewhere.


Before we do the actual fix, we need to cover some history. With browser UI stuff, there has always been 'The Big Five' - Back, Forward, Stop, Reload and Home. Over the years the Home has become far less important.

What are 'The Big Five'? If you are designing or creating browser UI icon buttons, these are the 5 you must get right, because they are the most used. Nothing to do with Firefox, this applies to every Internet browser ever made and every designer knows about them (apart from guess who?)

If you're in a big hurry, you can slap the other buttons together and users will not mind/notice much, but those 5 have to look right. You can imagine my reaction when I first saw Australis way back and saw the 14 x 14 px of the Stop and Reload buttons? :P

So, this fix will enlarge those, as you see in the pic. I've also slung that damn annoying Notification garbage out of the eyeline and to the far right of the addressbar, where you hardly notice them. A bit like the default Stop/Reload now, in fact.

So, without further whatever..it is fix time -

Code: Select all
/*..Franks Larger Reload and Stop on Left End of Urlbar Fix.....*/

#urlbar .autocomplete-textbox-container,
#urlbar > .autocomplete-textbox-container {
   -moz-box-ordinal-group: 2 !important;
}

#urlbar .autocomplete-history-dropmarker,
#urlbar > .autocomplete-history-dropmarker {
   -moz-box-ordinal-group: 3 !important;
}

#urlbar-reload-button,
#urlbar-stop-button,
#urlbar-go-button {
   -moz-margin-start: 8px !important;
/*   -moz-margin-end: 4px !important;*/
   transform: scale(1.2, 1.2) !important;
}
 #notification-popup-box  {
   -moz-box-ordinal-group: 3 !important;
   -moz-margin-start: -2px !important;
   -moz-margin-end: 2px !important;}


Usual, into your userChrome.css (or use Stylish extension) and you're done.

Frank :)
Metal Lion latest SeaMonkey & Thunderbird Themes - Sea Monkey and Silver Sea Monkey
"The only thing necessary for the triumph of evil, is for good men to do nothing." - Edmund Burke (attrib.)

Protocol

User avatar
 
Posts: 433
Joined: October 18th, 2003, 12:44 am

Post Posted May 1st, 2014, 7:12 pm

Why isn't it working for me in Stylish, Frank?

Return to Firefox General


Who is online

Users browsing this forum: No registered users and 2 guests