Show your browser layout

[dragon0823]

[Leonick]

OMG! OMG! Heartripper! Please, could you share your perfect Windows 8 Style? If you'd like, send privately the code to try and send feedback -in case I find 1-2 glitches.

He did, it's on the previous page. (And quote just below this.)

uploaded! http://userstyles.or...ha?r=1350746753 :)

Awesome! I've also felt firefox was a bit out of place on windows 8, mostly due to the gradient behind the tab and navigationbar. I'm hardly new to css or userstyles but I didn't know the names of all the default firefox elements to be able to write the style myself, you wouldn't happen to know where I could find some reference for this or the default them file or something? There are a few things I'd like to tweak (for example, when maximized the tabbar lines up with the left side just like the navigation bar and the firefox button but when in a normal window there is a margin on the left side).

I made some slight modifications to your style, if you or anyone else is interested I've a txt file with the css.

What I did was gave inactive tabs a background and border (just the way I prefer it) taking some inspiration from IE10, the inactive tabs are a slight grey with some transparency which means they'll take on a shade of whatever colour you're using in Windows be it grey, red, blue or something else. The hover effect for inactive tabs is also inspired by IE10 (good reference for Windows 8 style) which is a gradient. I also modified the Firefox button giving it the same standard and hover colours as the File button in explorer (not sure I'll stick with blue though, might go Firefox orange again soon :p).

Here's a screenshot of my Firefox layout which should do well as a demonstration of my change to Hertripper's userstyle (You see active, hovered inactive and an inactive tab).

A note on my bookmarks bar, in the folders are stuff I actually regularly use and just on the bar are things I've just saved for later. Most of my actual bookmarks are in the "bookmarks menu" and usually accessed by typing their name or tags in the addressbar. The bookmarksbar will hide as soon as the mouse is no longer over the bookmarksbar, navigationbar or tabbar thanks to a userstyle. The addressfield and searchfield are combine by InstantFox. There's also a whole bunch of addons that can't be seen like adblock, flashblock, tools like html validator and tweaks like "reload tab on double-click" and hide find bar which hides the find bar after a given amount of time.

firefox8mod.txt

[Leonick]

I managed to find a way to browse the default css for Firefox and made some more modifications to the Windows 8 userstyle.

• Applied styling to the find in page toolbar, it is now white like the rest.
  
• Gave the addonbar and find in page toolbar a top border.
  
• Set the min-height of the addonbar to 24px, the value used by other toolbars, for consistency.
  
• Removed rounded borders in the ctrl+tab tab switching dialogue.
  
• The tabbar now has a 4 or 2 (depending on tabs on top or not) pixel padding on the left and right side when Firefox is maximized and not just when in regular window.
  

firefox8mod.txt

[+Gary7 Subscriber²]

[derviskemal]

Safari - OSX 10.8.2

[+Heartripper Subscriber¹]

[Crimson Rain]

:shifty:

[Dane]

Does it show the websites name like that by default?

[Colin McGregor]

No ads, flash only on sites I say, and 0 popups ever. All with no addons. How a browser should be. (used this site cause theres normally google ads boxes all over)

[.stan]

Could you update the userstyle please? Looks awesome :)

[Haggis Veteran]

[+Heartripper Subscriber¹]

Could you update the userstyle please? Looks awesome :)

Here it is, haven't updated it in a long time though.

http://userstyles.org/styles/76943/firefox-8-alpha

[+Gary7 Subscriber²]

My latest blends in with my DT

[LUTZIFER]

Weird... pretty much all the screenshots shown here, the users are running Windows XP, but you never see them in the "Show your desktop" threads.

Also, haven't finished going threw every page yet, but I've seen many old IE versions shown, but no IE 9 or 10.

No point in showing mine, it's default IE 10 layout, so I won't bother.

[ccoltmanm]

I really enjoyed looking through the early pages and seeing some 2005-2008 style screenshots. Cool to see the evolution.

[LUTZIFER]

I really enjoyed looking through the early pages and seeing some 2005-2008 style screenshots. Cool to see the evolution.

Definitely true, I thought the same. Brought back some memories. Nice to see some of the browsers I once used, and I always did love Windows XP.

[The Evil Overlord]

mine

(NOTE triple screen layout doesn't show until you click the image)

[.stan]

Here it is, haven't updated it in a long time though.

http://userstyles.or...firefox-8-alpha

Can you update it, please?

[Douglas_C]

Nothing too special really...

[Lewkwarm]

Could anyone tell me how to customize the thumbnails like this? I know its simple enough with the Fast Dial extension, but this looks like the native about:newtab page.

[+Heartripper Subscriber¹]

Could anyone tell me how to customize the thumbnails like this? I know its simple enough with the Fast Dial extension, but this looks like the native about:newtab page.

It is the native about:newtab the code is here:

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url("about:newtab") {
.newtab-thumbnail{
    background-size: auto !important;
    background-position: center center !important;
}
.newtab-title{
    visibility: hidden !important;
}

/*For each thumbnail*/
.newtab-link[href*="url-pattern"] > .newtab-thumbnail{
    background-color: background-color !important;
    background-image: url(image-url) !important;
}
}
[/CODE]

You have to copy the third rule for each custom thumbnail you want to define

[Lewkwarm]

It is the native about:newtab the code is here:

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document url("about:newtab") {
.newtab-thumbnail{
	background-size: auto !important;
	background-position: center center !important;
}
.newtab-title{
	visibility: hidden !important;
}

/*For each thumbnail*/
.newtab-link[href*="url-pattern"] > .newtab-thumbnail{
	background-color: background-color !important;
	background-image: url(image-url) !important;
}
}
[/CODE]

You have to copy the third rule for each custom thumbnail you want to define

You are amazing, sir. Thank you!!

[+Heartripper Subscriber¹]

You are amazing, sir. Thank you!!

You're welcome :)

[Lewkwarm]

I couldn't decide what my 9th bookmark should be. So I did this:

[+Frank B. Subscriber²]

IE 10 preview on Windows 7