The existing sidebar doesn't play nicely with small screens, per the tweeted issue.
This PR makes the sidebar a fixed width, which trades consistency (yay!) for some issues if there were ever a chapter title that exceeded the fixed width.
Sidebar also now floats down the page with you as you read the chapter (position: fixed) and has a separate scroll context from the main page, if there's vertical overflow.
Setting the background color makes it so that, when content overflows the x direction in the main contents of the page, scrolling left and right won't result in text competes for space with the sidebar; instead it scrolls 'underneath' the sidebar.
Other drive-by nit-fixes:
line heights for headings
fixed logo size in the sidebar
whitespace in the node.ibis template
At narrow screen width:
Question: I didn't commit the updated build artifacts (docs/), but can push those changes too if that's appropriate. It's a little unclear to me whether those should be updated or not as part of this kind of change.
Issue: https://github.com/gvwilson/sdxjs/issues/32
The existing sidebar doesn't play nicely with small screens, per the tweeted issue.
This PR makes the sidebar a fixed width, which trades consistency (yay!) for some issues if there were ever a chapter title that exceeded the fixed width.
Sidebar also now floats down the page with you as you read the chapter (position: fixed) and has a separate scroll context from the main page, if there's vertical overflow.
Setting the background color makes it so that, when content overflows the x direction in the main contents of the page, scrolling left and right won't result in text competes for space with the sidebar; instead it scrolls 'underneath' the sidebar.
Other drive-by nit-fixes:
At narrow screen width:
Question: I didn't commit the updated build artifacts (docs/), but can push those changes too if that's appropriate. It's a little unclear to me whether those should be updated or not as part of this kind of change.