Fix the GitHub Dark Menubar | Hacker News Reader

Fix the GitHub Dark Menubar

github.com

60 pointsadamisntdead55 comments

I am baffled by how Github thought this was a meaningful design change.

It looks jarring to have a top bar that has such a high contrast with the rest of the page. Not to mention the color palette used is very...odd. Very off white and pure black (255, 255, 255) do not go well together. They could have at least made the entire site dark themed in which I doubt there would be so much drama around it.

Not expressing any opinions on this but it's not pure black. The shade used is #1e2327 or rgb(30,35,39)

Edit: also 255,255,255 is white, not black.

I think you really need to re-calibrate your monitor.

It's black, but not #000. It's a different and lighter shade of black.

255,255,255 is white.

The text is 0.75 white. The header background color is explicitly set with hex.

and it's totally fine it's not #000 - total black doesn't happen in nature so it shouldn't be used in design - personally, I always use for example #111 ;)

Definitely.

>First of many iterative design changes coming

https://twitter.com/mdo/status/830138373230653440

I have to admit that when I saw the dark bar for the first time, I switched to HN to see if someone died.

Me too!

I thought my account had been flagged for being banned or something (for no reason?). Especially because at the time I double checked in an incognito window which still yielded a white bar.

I assume GitHub's late UI designer.

I checked HN for deaths, github / blog for SOPA style protest, even reddit. I then assumed that there must have been a bug or my browser has cached CSS with any error.

NixOS developers thought a recent change to the nvidia drivers caused the issue: https://github.com/NixOS/nixpkgs/pull/22304#issuecomment-279...

Me too!

To the GitHubbers reading this thread, I like the dark menubar. I thought it was a feature of GitHub Enterprise only though, to distinguish the two :) I guess not!

The dark bar itself isn't really the issue, I'm all for a dark layout for GitHub. But as it is right now, with the header being dark and the rest light, it just looks very jarring and distracting to me. Your attention keeps being pulled to the top bar, but that's not where the real content is.

At first I assumed this was part of an incremental change to go fully dark, although I'm not sure why they would release it part by part.

But then a tweet [0] seems to imply that it's not gonna happen anytime soon.

[0]: https://twitter.com/mdo/status/830210985512218624

That's what I thought too. Dark means the repo is private. If you fuck up, the world won't see

White means, anything you do here is publicly visible.

Seriously github.com can we please use the black to give some meaning.

I don't want my public repos to have black headers.

The problem that I have with it is that I can no longer distinguish a webpage as being from public Github and enterprise Github with a cursory glance.

Just a heads up that these extensions will stop working soon.

https://twitter.com/mdo/status/830149416556191744

Most of these extensions popping up that revert GitHub's header to white are simply removing the `.header-dark` class which (currently) applies the dark styles and according to @mdo the styles will be permanently applied as a default.

The only way to revert them after this would be to reapply the old styles so if someone really wants that they might want to save them now.

I don't understand that point; how are they going to engineer it so that it's impossible to target the menubar via CSS?

They're not saying it will be impossible; they're saying it won't be a simple as removing the class.

If you remove the class right now the header reverts to how it was. This is what these extensions are doing right now, simply removing a class.

I'm saying that Github is going to apply the dark styles by default soon (without the modifier class) and the only way to revert the header will be to rewrite the old styles.

So, what colour should the bike shed be?

Any color that doesn't increase the chances of you misplacing your Enterprise bike.

Whatever brings the most attention to the axle mounts.

For the people that don't like the black bar. It can easily be reverted using the stylish addon. This addon is available for Firefox and Chrome and allows you to add custom styling to any website.

Made a Gist with the styling that will revert the black bar to it's original light grey header.

https://gist.github.com/babobski/41b29114a3c774bd018f75bd4ff...

And the Stylish addons can be found here: FF: https://addons.mozilla.org/en-US/firefox/addon/stylish/

Chrome: https://chrome.google.com/webstore/detail/stylish-custom-the...

Why did they change it? It's so distracting now.

It's the first of many iterative design changes coming to Github. It'll all make sense soon enough.

Why not release them when they make sense as a whole?

Agile!

Maybe they follow the "make it worse, then make it better" approach to user experience.

Even if the end design is objectively worse than the previous/current one, it will feel better compared to the intermediate versions. That might make the users actually complain less in the end.

I coincidentally started using GitHub Dark with Stylish just a few days before these changes went live. I love it: https://github.com/StylishThemes/GitHub-Dark

I think the dark bar is great. Makes the design a lot more clear. I finally understand it:

1) Black Bar: General Github stuff

2) White Stuff: Repository Specific Content

Now, if they could only put the link to the releases section in a place where you can find it, that would make the page perfect.

Agreed! Before when tired or not thinking I would sometimes click on "issues" in the top bar expecting it would take me to the repo issues. It's really a small change, but I could see it being a positive for less experienced users.

Not really.

The search input to search in the current repo is still in the black bar.

I installed a YouTube dark extension and thought it was leaking to GitHub's CSS. That's how bad this design change was.

Why is this not a user preference? Double why can't I color it to the color theme that I would enjoy?

Sorry to break the news but this is already done: https://github.com/DennisSnijder/MakeGithubGreatAgain

Is a full extension to run a single line of JS/CSS really necessary? I feel like for things like this, it makes much more sense to use either greasemonkey or stylish, rather than install a whole browser extension just to remove a single CSS class.

And there's already a handful of userstyles to fix this already: https://userstyles.org/styles/browse/github?as=1&sort=create...

My favourite of that bunch makes the navbar just slightly lighter instead of switching back to the old style: https://userstyles.org/styles/138757/better-dark-github-nav

More people have chrome than greasemonkey / stylish.

Fix the github and gist dark menubar with userscript https://github.com/devmessias/whygithub

:) First time I saw the new dark menubar was on this repo

Regarding the new GitHub dark bar... To quote Mr. Horse: "No sir, I don't like it".

could this be the reason for the dark navbar https://action.github.com/

Yup, I just assumed this was some kind of virtue-signaling political grandstanding sort of thing.

Fix? It looks a lot better that way :D

or just download a more flexible extension like Veneer and modify the CSS yourself

Needs more black.

Srs.

I wish people would just roll with design changes. It's jarring? You'll get used to it. They'll improve it. Just roll with it. Let them experiment with their UI. These are pros. They brought you Bootstrap. And GitHub until now. Plus it's really not that meaningful. The UI is just a means to an end. You'll get used to it. It's what humans do best.

Bootstrap was not made by GitHub. You're thinking of Twitter there.

They even have their own Bootstrap equivalent, primer [0], it's just a shame that it's not quite as mature. I can't remember what it was, but last time I checked it out, there were some pretty glaring omissions.

[0] http://primercss.io/

https://github.com/mdo has been at GitHub and working on Bootstrap probably longer at this point than while he was at Twitter. My impression is that he's also among the leads of this design evolution. He and whoever else is on this team have spent many hours thinking about this as their primary source of income. Why not just see where they take it?

Reply on news.ycombinator.com