search

getnikola / nikola-themes

Themes for Nikola
https://themes.getnikola.com/
71 stars 51 forks source link

Make the material-theme a little more mobile friendly: #127

Closed cheshirekow closed 6 years ago

cheshirekow commented 7 years ago

In the smallest of the bootstrap breakpoints:

  1. use a single column layout, rather than a two column layout
  2. make the navigation menu items inline-block so they form a horizontal menu across the top of the page
  3. remove padding from the content div
  4. don't scroll posts separately from the "background" of the page, leave it all as one linear stream

The comments probably aren't desirable and I didn't even check on style issues... but if the change is desirable I'd be happy to clean up this patch.

Kwpolska commented 7 years ago

:+1: from me, please try cleaning it up. But perhaps (2) would work better if you used the bootstrap-style expanding menu, if that’s possible?

cheshirekow commented 7 years ago

Cool. Have any pointers to documentation/tutorial/example of the bootstrap-style expanding menu you're referring to? Also is there a nikola style guide or should I just try to match what's there?

Kwpolska commented 7 years ago

I mean the menu bootstrap3 uses. There is no style guide for CSS — be reasonable, avoid unreadably clever hacks, indent with 4 spaces.

cheshirekow commented 7 years ago

Updated the review.

Excuse my ignorance, I'm still not 100% positive what you meant by the menu, but I think I implemented it. As implemented, it looks like this:

unexpanded: image

expanded: selection_021

Kwpolska commented 7 years ago

I meant a menu that behaves the same way https://getnikola.com/ does on mobile. The hamburger button would work better as part of the green header.

cheshirekow commented 6 years ago

Ok done. Moved hamburger button into the header. Now looks like this:

Closed: selection_025

Open: selection_027

Kwpolska commented 6 years ago

Looks great, thanks for fixing this!