28
$\begingroup$

I was really disappointed with the recently introduced black top bar. It really doesn't fit the math.stackexchange theme!

Hence I installed the free StyleBot extension to Chrome, and then I created this layout, which just kills the horrible black bar. Here's the result:

enter image description here

Hope you like it!

If you modify the style or create a new one, please share it here.

PS: Yes, it works on the meta too ;-)

UPDATE: Now the SE Logo at the top is fixed. Enjoy!

enter image description here

$\endgroup$
16
  • 2
    $\begingroup$ We want one for firefox too!! :P $\endgroup$
    – user14082
    Commented Dec 9, 2013 at 2:24
  • 2
    $\begingroup$ I’m not terribly keen on the new look, but I much prefer it to using Chrome! (And I expect that I’ll get used to it before too awfully long.) $\endgroup$
    – Brian M. Scott
    Commented Dec 9, 2013 at 2:29
  • 1
    $\begingroup$ I'm not that terribly fond of it, myself (actually, I hate it, like you!) I've got an astigmatism that makes reading light font on a darker background (white on black, or the dreaded white on green, e.g.) particularly difficult for me. (Do web developers/programmers take such things into consideration? I think humans read more readily and have less impairments when print is dark on a light background!) In any case, I can't readily access information that I was able to in the prior version. But like @BrianM.Scott, I suspect I'll get more used to it, save for the literal "eyesore". $\endgroup$
    – amWhy
    Commented Dec 9, 2013 at 15:06
  • $\begingroup$ @BrianM.Scott: What do you have against Chrome? Really, since I'm using it I'm curious to know $\endgroup$
    – Abramo
    Commented Dec 9, 2013 at 15:12
  • $\begingroup$ nice, but how to get rid of it again? $\endgroup$
    – draks ...
    Commented Dec 9, 2013 at 18:16
  • $\begingroup$ @Abramo: Probably mostly habit: I’ve been using Firefox since about version $0.7$. I tried Chrome on MSE for a while, but (a) I never felt entirely comfortable with it, and (b) MSE tabs in Chrome crashed too often when I was writing answers. $\endgroup$
    – Brian M. Scott
    Commented Dec 9, 2013 at 18:47
  • $\begingroup$ Well, I'm not using it from a long time, but I'm pretty happy about it. Probably it got much better nowadays! I thought you were against it because of the Google quasi-monopoly and the fact that they retain all of your personal data. $\endgroup$
    – Abramo
    Commented Dec 9, 2013 at 18:51
  • 2
    $\begingroup$ @Abramo: That actually is part of it; I’m less and less happy with Google, though for the moment at least I’m still using Gmail. $\endgroup$
    – Brian M. Scott
    Commented Dec 9, 2013 at 22:02
  • $\begingroup$ @Abramo : I hate the new black bar too, but I use Firefox, and I've heard a lot of bad things about Chrome. Do you foresee this being done for Firefox? $\endgroup$
    – Stefan Smith
    Commented Dec 10, 2013 at 4:45
  • $\begingroup$ @BrianM.Scott : you might want to consider inbox.com . Unlike gmail, you can create folders, and they don't group your messages into confusing "conversations" without your asking like gmail does (but you can do this if you want). Unlike Yahoo Mail, there seem to be very few ads. $\endgroup$
    – Stefan Smith
    Commented Dec 10, 2013 at 4:48
  • $\begingroup$ @Stefan: Thanks; I may look into it. (The ‘conversations’ aren’t actually much of a problem, since I download everything to my own mail client; gmail’s storage is just a backup for me. I concur with your opinion of the organization, though!) $\endgroup$
    – Brian M. Scott
    Commented Dec 10, 2013 at 5:05
  • $\begingroup$ @Brian M.Scott : Google doesn't seem to follow their own motto "Don't be evil." They operate in China and filter out search results that offend the totalitarian regime there. I know there are many other big Internet firms that refuse to do business with Red China (sorry I can't name them at the moment). They donate money to ultra-right-wing political activist groups. They are famous for gathering and hoarding all the personal data they can about their users. $\endgroup$
    – Stefan Smith
    Commented Dec 11, 2013 at 13:31
  • $\begingroup$ Everybody: starting today or yesterday or so, I see both the ugly black bar and the classic Mathematics and Mathematics meta logos at the top. I didn't do anything to Firefox, it just happened. I can live with the ugly little black bar as long as the classic logo is there too. $\endgroup$
    – Stefan Smith
    Commented Dec 12, 2013 at 3:07
  • $\begingroup$ Dear @Abramo, how did you fix the SE logo so that "Stack" stays black? $\endgroup$
    – Andrew
    Commented Dec 12, 2013 at 20:27
  • 1
    $\begingroup$ @Andrew: You need to insert in the CSS for ".topbar .icon-site-switcher" the line "background-position: 10px -50px !important;". This will pick the alternative logo from this image: cdn.sstatic.net/img/topbar-sprite.png $\endgroup$
    – Abramo
    Commented Dec 12, 2013 at 20:34

2 Answers 2

Reset to default
3
$\begingroup$

In the comments, some users asked about a Firefox analog of the above. A popular Firefox extension for managing user stylesheets is Stylish. Several stylesheets for the top bar, some specifically designed for Firefox, can be found at Gallery of custom styles and/or scripts for the top-bar.

Apart from extensions, most of today's browsers have built-in support for user stylesheets. This guide has the browser-specific details.

Perhaps as an overreaction to the Big Black Bar, I now use a simple stylesheet with toned-down appearance and hidden "StackExchange" name:

topbar

$\endgroup$
2
$\begingroup$

Here is a modification for MSE of phils's answer in Post No Bills's link. This works with "Stylish" on Firefox: 

@namespace url(http://www.w3.org/1999/xhtml);

@-moz-document domain("stackexchange.com")
               /* domain("mathoverflow.net") /* for MO */
{
  .topbar,
  .topbar .icon-achievements.icon-achievements-unread,
  .topbar .icon-achievements .unread-count {
    color: #999 !important;
    background: #f1f7fe none !important;
    /* background: #eee none !important; /* for MO */
  }
  .topbar .topbar-icon:hover,
  .topbar .topbar-icon-on,
  .topbar .topbar-icon-on:hover,
  .topbar .topbar-links .profile-me:hover,
  .topbar .topbar-links .topbar-menu-links a:hover,
  .topbar .icon-achievements.icon-achievements-unread:hover .unread-count {
    background-color: #bcd4e6 !important;
    /* background-color: #f38810 !important; /* for MO */
  }
  .topbar .icon-achievements,
  .topbar .icon-achievements .unread-count,
  .topbar .topbar-links .topbar-menu-links a,
  .topbar .topbar-links .topbar-menu-links a:visited,
  .topbar .topbar-links .topbar-flair .reputation,
  .topbar .topbar-links .topbar-flair .badgecount {
    color: #737373 !important;
  }
  .topbar .avatar-me {
    display: none !important;
  }
  .topbar .topbar-links .search-container input[type="text"] {
    border-color: inherit !important;
  }
  .topbar .icon-site-switcher {
    /* background-position: 11px 11px !important;
    /* background-image: url(data:image/png;base64,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) !important; */
    background-position: 10px -50px !important;
  }
}

And a screenshot:

enter image description here

$\endgroup$
3
  • $\begingroup$ Very nice, but I would add mathoverflow.net to the list of domains. It's probably more relevant to MSE users than serverfault. $\endgroup$
    – Post No Bulls
    Commented Dec 12, 2013 at 21:29
  • $\begingroup$ Dear @PostNoBills, good point! I just noticed this as I went over to mathoverflow. However, the colour schemes don't match, so I've modified them to create another (almost the same) style sheet for MO. I will comment in the MO colours I've chosen. $\endgroup$
    – Andrew
    Commented Dec 12, 2013 at 21:34
  • 1
    $\begingroup$ Why not putting a nice shadow under the top bar? It can be done with "box-shadow: 0px 1px 1px 1px #eee;" $\endgroup$
    – Abramo
    Commented Dec 18, 2013 at 12:45

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .