diff options
| author | Alex Shpak <alex-shpak@users.noreply.github.com> | 2019-06-18 23:20:29 +0200 |
|---|---|---|
| committer | Alex Shpak <alex-shpak@users.noreply.github.com> | 2019-06-18 23:20:29 +0200 |
| commit | c679f74cff00b419c9c042190ff825c43788d672 (patch) | |
| tree | 7d3b75aa8c6e27d24c131974ac82ad11c919ba7d /assets | |
| parent | 12f2af4d34f9e836e40da8990aedef75e9e8f906 (diff) | |
Make columns shortcode mobile friendly
Diffstat (limited to 'assets')
| -rw-r--r-- | assets/_shortcodes.scss | 17 | ||||
| -rw-r--r-- | assets/_utils.scss | 4 | ||||
| -rw-r--r-- | assets/_variables.scss | 2 |
3 files changed, 13 insertions, 10 deletions
diff --git a/assets/_shortcodes.scss b/assets/_shortcodes.scss index 2ec5712..485f0f2 100644 --- a/assets/_shortcodes.scss +++ b/assets/_shortcodes.scss @@ -62,15 +62,14 @@ // {{< columns >}} .book-columns { - margin-top: $padding-16; - margin-bottom: $padding-16; -} -.book-columns > { - div { - max-width: 50%; - } - div + div { - margin-left: $padding-16 * 2; + margin-left: -$padding-16; + margin-right: -$padding-16; + + > div { + margin: $padding-16 0; + // max-width: 50%; + min-width: $body-min-width * 0.66; + padding: 0 $padding-16; } } diff --git a/assets/_utils.scss b/assets/_utils.scss index 887a866..76ff8ae 100644 --- a/assets/_utils.scss +++ b/assets/_utils.scss @@ -10,6 +10,10 @@ flex: 1 1; } +.flex-wrap { + flex-wrap: wrap; +} + .justify-start { justify-content: flex-start; } diff --git a/assets/_variables.scss b/assets/_variables.scss index 0bdf238..452494f 100644 --- a/assets/_variables.scss +++ b/assets/_variables.scss @@ -35,7 +35,7 @@ $container-max-width: 80rem; $header-height: 3.5rem; $menu-width: 16rem; -$toc-width: 14rem; +$toc-width: 16rem; $sm-breakpoint: $menu-width + $body-min-width + 5; $md-breakpoint: $sm-breakpoint + $toc-width; |