This attempts to fix the problem where (on smaller windows), the text
flows out of the blocks.
This uses one of the solutions mentioned in https://stackoverflow.com/a/19695851/1811501,
with some additonal style changes.
Unfortunately, it introduces another issue, where (just before a break-point; after
the right-hand navigation is hidden, but before we switch to "mobile" / "small",
the blocks are wrapped, but no longer have equal _widths_.
See https://github.com/docker/docker.github.io/pull/13433#issuecomment-910843789
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
- Reduce white-space after headings, so that the section content groups
better with the heading
- Increase white-space before headings, so that sections are more separated
from the previous sections.
- Reduce indentation of bullet-lists and numbered-lists. These lists are
still indented slightly (5px), but reducing the indentation to make the
layout a bit less "busy", and to give list-items slightly more width
before content is wrapped.
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
- fix margin at the top
- fix left-hand border from disappearing when hovering over the link
- fix indentation for active link (compensate for border-width)
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
Adjust text, add modal pop-up for browsers with JavaScript enabled, and show
EULA inline for browsers without JavaScript.
Added configuration options in the _config.json to set the correct URLs
once known.
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
This fixes various inconsistencies between the landing page and the
other pages by sharing more styles between both:
- fix homepage using a different color for the active tab
- fix homepage not having "hover" styles for the top navigation
I addition, this:
- fixes unwanted whitespace in the hamburger-menu on mobile
- fixes "active" menu item not being highlighted on mobile
- fixes left-side aligning of left-hand menu on desktop
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
Some works still to be done:
- styling may need some tweaking
- if we don't have breadcrumbs for a page, positioning of other elements should
be adjusted
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
Change H4's to not be presented in "all caps". To compensate, the font
size is increased from 16px to 18px (otherwise it would be the same size
as H5 headings).
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
We don't want users to copy the prompt and process output in
"console" blocks, but for other code blocks (bash scripts, yaml)
copying comments should not be disabled.
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
Show a "text" cursor for the prompt. Even though the prompt itself is not
selectable, make it appear as if it is, so that users don't get confused
when they try to select an example for copying.
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
Prevent selecting comments, command-output and command-prompt in shell
examples that use the "console" lexer/highlighter to allow easier copying.
See https://github.com/rouge-ruby/rouge/issues/1023
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
Changes should be mostly invisible, except for a very slight increase in
contrast in the "night" theme between the body-background and left/right
navigation blocks.
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
While more verbose, HSL colors (Hue, Saturation, Lightness) allow
for easier selecting color variations that only differ in lightness,
but have the same hue.
This conversion also reveals some slight differences in hue between
existing color-variations that I'll address in a follow-up commit.
Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
