Shop More Submit  Join Login
×



Details

Submitted on
May 18
Image Size
494 KB
Resolution
1024×768
Submitted with
Sta.sh
Link
Thumb
Embed

Stats

Views
271
Favourites
2 (who?)
Comments
9
Downloads
6
×
Firefox 29 Skinned by electricjonny Firefox 29 Skinned by electricjonny
So I had been staying away from Firefox v29 for a while, since the new Australis skin really annoyed me, and my current Stylish skin that changed how Firefox looks didn't work with version 29.  But I played around with my skin on another computer that ran Firefox 29 and I got it looking pretty similar to how my old skin looked.  Although it took 3 extra extensions to do that (Classic Theme Restorer, Classic Toolbar Buttons, and Throbber Restored—Why Mozilla decided to remove the throbber that indicates a site loading confuses the hell out of me).

As you can see, I prefer a dark theme, and then I've added a few things like the Windows Aero fuzzy glass look to menus, along with menu icons.  And that time in the bottom toolbar, that's just a Greasemonkey script I wrote that puts the time down there, since I run my browser on my second monitor that doesn't have the Windows taskbar and I often watch television on my main monitor.  Yeah, enabling custom text in the status bar is generally frowned on, and it's disabled by default in most browsers, but Firefox at least lets you enable it, if you want.

And as you can see, I have quite a few extensions up in the top right, so if you want any info on any of them, just ask.

Anyhow, I've managed to make Firefox 29 look and work pretty close to how past versions look, so I'm happy now.  I really am not a fan of programs changing how things look.  I'm happy with my current look, so don't mess with it.
Add a Comment:
 

The Artist has requested Critique on this Artwork

Please sign up or login to post a critique.

:iconneurotype:
neurotype Featured By Owner May 19, 2014  Hobbyist General Artist
Oh shite, nice! More incentive to go back to it.
Reply
:iconelectricjonny:
electricjonny Featured By Owner May 19, 2014  Hobbyist Photographer
Hehe thanks, yeah that's one of the main reasons why I like Firefox; it lets you skin it pretty easily (aside from the many official skins available).  Chrome skins just don't compare to the ones for Firefox.  And this is all hand coded in Stylish, sort of based on an old theme I used years ago.
Reply
:iconneurotype:
neurotype Featured By Owner May 19, 2014  Hobbyist General Artist
Oooooh.
Reply
:iconrotane:
rotane Featured By Owner May 19, 2014   General Artist
Good work!

Hey, you managed to get a drop shadow under the menus at last? What trickery is this?
Reply
:iconelectricjonny:
electricjonny Featured By Owner May 19, 2014  Hobbyist Photographer
Hmm, not sure.  I remember trying to add that with a normal box-shadow, but it didn't seem to work.  I think the -moz-win-glass value on the -moz-appearance property automatically adds that?  The only problem, and it's most likely a bug within the program, is the bottom right corner doesn't follow my border-radius.  You can't really tell from the screenshot, but the fuzzy glass background pops out of the rounded corner.  But it's no huge deal.

What I probably spent the most time perfecting was the rounded parts at the top of the tabs.  I hid the default rounded parts they added in Australis then made my own rounded parts with a box-shadow :slow: CSS is:
box-shadow:0px -2px 2px -1px rgba(255,255,255,.6),
                1px 12px 0px 0px #000000,
                2px 15px 0px 0px #000000,
                3px 18px 0px 0px #000000,
                6px 20px 0px 0px #000000,
                9px 22px 0px 0px #000000,

                -1px 12px 0px 0px #000000,
                -2px 15px 0px 0px #000000,
                -3px 18px 0px 0px #000000,
                -6px 20px 0px 0px #000000,
                -9px 22px 0px 0px #000000,

                1px 12px 1px 0px rgba(255,255,255,.4),
                2px 15px 1px 0px rgba(255,255,255,.4),
                3px 18px 1px 0px rgba(255,255,255,.4),
                6px 20px 1px 0px rgba(255,255,255,.4),
                9px 22px 1px 0px rgba(255,255,255,.4),

                -1px 12px 1px 0px rgba(255,255,255,.4),
                -2px 15px 1px 0px rgba(255,255,255,.4),
                -3px 18px 1px 0px rgba(255,255,255,.4),
                -6px 20px 1px 0px rgba(255,255,255,.4),
                -9px 22px 1px 0px rgba(255,255,255,.4)!important;


It's a bit of work for something that seems rather easy to do, but I've had it for years now, and just changed it slightly to clean it up.  I probably could have used the selectors for the new default rounded parts, but figuring out a good way to use those (I think they're svg's?) was more work than I wanted to do =P So I just hid them and added my box-shadow to simulate some rounded corners (they really need to add support for negative border-radius... somehow).
Reply
:iconrotane:
rotane Featured By Owner May 19, 2014   General Artist
Okay, so you're still doing that workaround, then. We talked about this some time ago, but looking at your screenshot, i thought you found something nicer ;)

Anyway, thanks for the heads-up, but i couldn't get this to work. Oh well, maybe one day :)
Reply
:iconelectricjonny:
electricjonny Featured By Owner May 19, 2014  Hobbyist Photographer
The glass look on menus or just adding a box-shadow to them?  I'm pretty sure that you can't add a box-shadow, for whatever reason, and obviously the glass look only works on Windows (not sure if you're a Mac user or not).

And now, for whatever reason, I can't even find the selectors for the menus/right click :o
Reply
:iconrotane:
rotane Featured By Owner May 19, 2014   General Artist
I tried your massive box-shadow code, with and without all sorts of -moz-appearance variations. I ended up seeing no difference, or just a transparent menu. But don't waste any thoughts on this on my behalf. Had it been a quick fix to get the drop shadows, then cool, but i don't have to have it.
Reply
:iconelectricjonny:
electricjonny Featured By Owner May 19, 2014  Hobbyist Photographer
Heh well I found it.  Forgot I added -moz-win-borderless-glass, not the other one.

/* menus */
menupopup, popup:not(#autoscroller) {
    -moz-appearance:-moz-win-borderless-glass!important;
    background:rgba(0,0,0,0)!important;/* Hmm, not working... */
    padding:4px 2px 4px 2px!important;
    margin:0px 1px 0px 1px!important;
}

/* the labels for keyboard shortcuts */
menupopup hbox label, popup:not(#autoscroller) hbox label {
    color:#DBDBDB!important;
    text-shadow:1px 1px 1px rgba(0,0,0,1), 1px 1px 2px rgba(0,0,0,1)!important;
}

/* text for menus */
menupopup > menuitem, popup:not(#autoscroller) > menuitem, menupopup > menu, popup:not(#autoscroller) > menu {
    color:#FFFFFF!important;
    text-shadow:0px 0px 6px #000000, 0px 0px 4px #000000, 1px 1px 0px #000000, 1px 1px 1px #000000, 1px 1px 2px #000000!important;
}

/* disabled text for menus */
menu[disabled="true"], menuitem[disabled="true"], .splitmenu-menuitem[disabled="true"], menu[_moz-menuactive="true"][disabled="true"], menuitem[_moz-menuactive="true"][disabled="true"], .splitmenu-menuitem[_moz-menuactive="true"][disabled="true"] {
    opacity:.5!important;
}
Reply
Add a Comment: