6 ms·

I have a single major problem with all of their new layouts. They place content at extreme ends of the screen, completely stretched out like a rubber band with

• dgellow 6y ago
  Yep, I have the exact same issue. I started to use the new design via their beta program, I had to stop after a few days because the content stretches from one side of my screen to the other. I hoped they would fix it before release.
• AOsborn 6y ago
  Agree completely. Feels like a huge step backwards. Maybe usage metrics show most users are using a much smaller window size, but the layout is all over the place on my 27" monitor (2560x1440).
  • giancarlostoro 6y ago
    > Maybe usage metrics show most users are using a much smaller window size, but the layout is all over the place on my 27" monitor (2560x1440). Some of us like to code with git / bitbucket / gitlab side by side with our IDE so we can reference existing issues more directly while writing code. Which reminds me I need a better screen resolution... 1080p is so 2016.
    • threeseed 6y ago
      The problem is your resolution. I have a 4K monitor and have Git/IDE side by side and the layout is a real problem. It's 30cm/1ft between the Issues button and the main table.
      • onion2k 6y ago
        This may not work for your specific case, but there are Github issues plugins for various IDEs that will show you the issues list right there in your IDE. I've found them very useful.
• SenHeng 6y ago
  I remember this happened before several years ago in a previous redesign where the top menu would just stretch to fill the entire screen. It was later changed to one with a proper max width. I guess they forgot that lesson.
  • saltcured 6y ago
    Ha, to me it is an improper max width. My biggest peeve with the GitHub web UI is the squished center pane. I hate that it centers it with giant gutters wasting over half the width of a 4K monitor, should I choose to maximize a browser window. I'd much rather see everything shifted to the left. I'd even be OK with some soft margin still causing regular README text to wrap at a typical width. But, if there are long code or raw text lines, or any embedded image or markdown table or other structure that is inherently wide, I want it to overflow and use that extra screen space, not get clipped into this ridiculously narrow bowling lane. That's my instinctual desire and the only reason I would expand the browser to full screen, and it is an utter disappointment to try that and be told, "no space for you."
    • wonderlg 6y ago
      Sorry but do you use full screen windows on a 4K monitor? I doubt any website is really designed to fill anything more than ~1400 horizontal logical pixels.
      • onion2k 6y ago
        The current 13" Macboook Pro has a hardware resolution of 2560x1600. The screen resolution will be the same if you switch off display scaling. Pretty much everyone using one will have maximised windows because it's physically small. You really need CSS that accounts for resolution and pixel density these days.
      • tasuki 6y ago
        I do. In the age of various resolutions and screen sizes and css frameworks, websites can and should be designed to look reasonable on any number of horizontal logical pixels. If it isn't supposed to be wider than 1400px, that's what css's `max-width` is for.
• humblebee 6y ago
  Ya, I didn't understand this design choice. For a while I've had some custom css which also extends the width of the main content on github as well because I've always found reading some github issues with logs in them challenging. This is the css I'm running now to fix this, as well as extend the width of the main content. The 1600px is such that when using i3 and having my browser be half the screen it consumes most of the screen space on my 4k monitor. :root { --width: 1600px; } .container-xl { max-width: var(--width); } .pagehead { padding-left: calc(50% - (var(--width) / 2)); padding-right: calc(50% - (var(--width) / 2)); }
  • fireattack 6y ago
    Thank you, this works perfectly.
  • drey08 6y ago
    How can I use this code snippet? Apologies if it's obvious to everyone.
    • Jetroid 6y ago
      On Chrome, I use an extension called 'Stylebot'. Not sure about other platforms.
      • square_usual 6y ago
        You can use Stylus on Firefox (and Chrome, too.)
    • nsuser3 6y ago
      You can use Stylus (https://addons.mozilla.org/en-US/firefox/addon/styl-us/ https://addons.mozilla.org/en-US/firefox/addon/styl-us/) to add custom CSS to websites.
    • vimslayer 6y ago
      People have suggested extensions here, which is fine, but Firefox also supports this natively via custom css files that it can load for you on startup. They can be used for both styling Firefox itself and for modifying websites' styling. https://superuser.com/a/319322/1173126 https://superuser.com/a/319322/1173126 (be sure to read the comments of that answer too, these days you need to switch a flag in Ff settings to enable this feature)
• d0m 6y ago
  Seems like a bug or probably an oversight. Don't think that was intended
  • mikaelsouza 6y ago
    I hope so. I just noticed their beta period ended. I am not sure if they changed anything from how it was previously in the beta. I don't think the new design is bad, it's just different. It's fine tbh, but these top bars are pretty bad on a big screen. Hopefully they'll change that soon enough.
  • bradstewart 6y ago
    Except that MS Teams is designed exactly the same way.
• nmfisher 6y ago
  Just logged into GitHub, freaked out when I saw the redesign, and came straight here to say exactly this. It's unnatural eye movement to look wide for platform navigation, then narrow for README/repository navigation. This is outright bad design. There was nothing wrong with GitHub's UI before, it was probably the closest thing to "perfect" I'd ever encountered. Alongside that incredibly irritating "navigate to code definition" popup, it feels GitHub has too many designers with too little to do, so they're desperately scrounging around for things to change to fill their day. Either that, or there's some monetization angle (ala the Reddit redesign) that we haven't seen yet.
  • risyachka 6y ago
    Genuinely curious here - isn't it better for eyes to move more? Can moving in unnatural way be a good thing considering most of the time they move naturally? Like a sort fo stretching.
    • nmfisher 6y ago
      I don't mean it's literally bad for your eyes - there may well be benefits to constantly shifting your gaze/focus/etc. I can't comment on that. I'm talking about "natural" eye movement being a well-known design principle. This means that eyes very naturally follow a Z pattern that doesn't exceed the periphery of your focus. So if you load up a fresh page, your eyes will naturally look top left -> top right -> bottom left -> bottom right, bounded by your standard viewbox (which is about 800px-1200px wide at 96dpi and 1-2ft, the standard distance most people sit from their monitor). So you usually stick your most important information along that pattern. Anything outside this boundary requires an extra "look", which means a slight hesitation/delay on the part of the user. That's not to say the space is unusable, just that you put your most common/important features/information along this flow. It's also not an ironclad rule, but it does work very well. When I went to the old GitHub, my eyes always followed the same pattern: repository name (top-left, to make sure I was on the right page), account (verifying that I'm logged in), branch, clone/download, then file list or more commonly, the README (bottom-left). It was a very quick, natural way to navigate a random GitHub page. Now, I literally have to move my head to do this. The weighting also feels completely unbalanced, like there's too much information on the left it's all slanting in one direction.
• JMTQp8lwXL 6y ago
  I feel my eyes having to move around a lot more due to the increased layout width.
• hubert1234 6y ago
  They should really just get rid of the column entirely, it's a bad idea in my opinion. Before I could simply scan a page from top to bottom and I wouldnt miss anything. I understand why there is an instinct to put non-essential information to the side but really, the better design decision in my opinion is to make a decision for the user: Either this info is necessary or it isnt. If it is, it deserves a place at the front. If it isnt, get rid of it entirely and put it behind a link. For example the contributors list in my opinion is truly not necessary except somewhere deep in settings. Reading what the latest commit message is, is basically always interesting to me. Yet they hide that and I have to click a tiny button to show it. The language info for a repo is now hidden very far below everything else even though that information is the first thing I look at when I see a repo. It's just that basic and interesting to get a feel of what's inside a repo. The about text for a repo is kind of the same, now they squish it into the side column into a much harder to read textbox. The about text is arguably the most important first information of a repo.
• minetest2048 6y ago
  Its much worse when you are using an ultrawide monitor. Before this change I can just look at the center of the monitor and see all important things, while now I can feel my eyeball moving trying to read everytihng
• ian0 6y ago
  I think they designed it using regular sized screens, works fine on my 13'' laptop. Honestly - pretty refreshing, designers typically forget to test on low end monitors - not high end ones!