Add links to our lovely new Help repo

[parkr]

/cc @jekyll/help

[parkr]

@cobyism There seems to be some weirdness with breakpoints. Do you think we should move to a 1/4 to 3/4 grid at the top instead of 1/3 to 2/3?

[cobyism]

Yeah, adding another top-level nav item in here is going to be a little tricky. Possible, but tricky. For example, there’s also issues with getting this in on mobiles:

I originally avoided doing a toggleable/offscreen-style nav thing on mobiles because it was pretty simple to have them all in view, but as this menu grows, that might be the only solution.

Do you think we should move to a 1/4 to 3/4 grid at the top instead of 1/3 to 2/3?

I’d prefer to just switch to "docs" as a shorter link everywhere (currently it shrinks down to that when there’s no space), since I think changing to 1/4 + 3/4 at the top doesn’t leave enough room for the logo when viewed at full width, and also makes the left-edge of the nav not line up with the landing page text below (just me being pedantic). Neither of those options fixes it on portrait mobiles though, and I’m pretty sure changing those .mobile-nav links to be 20% width each won’t do it either, so something else is probably going to have to be done there.

[oblakeerickson]

Awesome! I was going to suggest adding a link to the new Help repo. I also like shortening 'Documentation' to just 'Docs'.

[parkr]

Thanks for the detailed response, @cobyism! You rock. What do you think about shortening "Overview" to something else?

[cobyism]

What do you think about shortening "Overview" to something else?

Yeah, it could be shortened to "home"?

[ndarville]

Second “home”; it’s also more descriptive than “overview”.

[parkr]

That sees to fit more nicely:

[cobyism]

@parkr What’s the width of that browser window? Have you tried it in an actual phone? The reason I ask is that some browsers don’t actually quite let you resize down to 320px wide, so you might not be seeing the whole story.

[cobyism]

For example, notice the places the text in the intro block is wrapping in your screenshot vs. my mobile screenshot above—it’s quite a bit narrower.

[parkr]

Sacrebleu! It's whatever the minimum width for Opera is.

640x1136:

Can we squeeze the margins between each?

[parkr]

Radical idea: What if we strip out GitHub on this heading in the mobile view? I can see people wanting to get help on-the-go but who's going to be looking through source code while waiting to board a plane or sitting on the subway? Seems like Help > GitHub at this level.

[troyswanson]

Ya, I agree. If we're really trying to push the jekyll/help repo, it would probably serve more people to have a link there instead of to the source repo.

[cobyism]

who's going to be looking through source code while waiting to board a plane or sitting on the subway?

I'd say it's more that people on mobile discovering Jekyll may want to star the repo for pulling up later. The mobile UI of github.com places emphasis on the non-code aspects of the site (social/starring etc, and workflow/issues/comments etc.), which a surprising amount of people do from phones. I'm not saying that you shouldn't drop the link on mobiles—that's up to you—just don't presume that people won't want to head to the repo on small screens.

💙

[troyswanson]

@cobyism 👍 Thanks a lot for the data. We really ought to figure out a way to have all the links up there. It might make more sense to use display: table-cell; to get those items to stretch and contract to 100% of the viewport. Maybe call it "Code" instead of "GitHub"? Another solution might be to include an Unofficial GitHub Button for easy 🌟 action.

[parkr]

I got it! Simple CSS thing: f3e8026

[troyswanson]

🔥 Hawt.