From 0e95d0d7b43df2c696662098722227f62bfb124d Mon Sep 17 00:00:00 2001 From: Alex Auvolat Date: Thu, 22 Dec 2022 00:35:27 +0100 Subject: [PATCH] Tentative 2: navigation sur mobile --- content/_index.md | 2 +- sass/juice.scss | 59 +++++++++++++++++++++++++++----------------- templates/_nav.html | 8 +++++- templates/index.html | 22 ++++++----------- 4 files changed, 52 insertions(+), 39 deletions(-) diff --git a/content/_index.md b/content/_index.md index 142d528..a28e9cb 100644 --- a/content/_index.md +++ b/content/_index.md @@ -1,5 +1,5 @@ +++ -title = "Manuels Deuxfleurs" +title = "Guide Deuxfleurs" sort_by = "weight" +++ diff --git a/sass/juice.scss b/sass/juice.scss index 2e2d5e3..ade6dd9 100644 --- a/sass/juice.scss +++ b/sass/juice.scss @@ -100,6 +100,10 @@ main { padding: 50px 100px; margin: 0; + .toc-homepage { + display: none; + } + .toc { max-width: 260px; min-width: 240px; @@ -253,25 +257,12 @@ main details#navigation-toggle summary { /* *********** */ - -.menu-button-container { - display: none; -} - #menu-toggle { display: none; } -.menu-button, -.menu-button::before, -.menu-button::after { - display: block; - background-color: #fff; - position: absolute; - height: 4px; - width: 30px; - transition: transform 400ms ease; - border-radius: 2px; +.menu-button { + display: none; } .menu-button::before { @@ -299,18 +290,40 @@ main details#navigation-toggle summary { } @media (max-width: 768px) { - .menu-button-container { - position: absolute; + main .toc-homepage { display: block; - height: 32px; - width: 32px; - top: 40px; - right: 24px; } - #menu-toggle ~ .toc { + + .toc-menu-title { + font-weight: 600; + margin-left: 64px; + } + + .toc-section { + margin-top: 16px; + } + + .menu-button { + top: 28px; + left:24px; + } + + .menu-button, + .menu-button::before, + .menu-button::after { + display: block; + background-color: #777; + position: absolute; + height: 4px; + width: 30px; + transition: transform 400ms ease; + border-radius: 2px; + } + + #menu-toggle ~ .toc-item { display: none; } - #menu-toggle:checked ~ .toc { + #menu-toggle:checked ~ .toc-item { display: block; } } \ No newline at end of file diff --git a/templates/_nav.html b/templates/_nav.html index 3bfda07..b05e472 100644 --- a/templates/_nav.html +++ b/templates/_nav.html @@ -133,9 +133,15 @@ {% set root_path = hierarchy | nth(n=0) %} {% set root = get_section(path=root_path) %} + + + +
{{ root.title }}
- {{ nav::navsection(hierarchy=hierarchy,level=0,current=current) }} {% endmacro %} diff --git a/templates/index.html b/templates/index.html index a00a979..fd4e9bf 100644 --- a/templates/index.html +++ b/templates/index.html @@ -26,21 +26,15 @@
{% block mainnav %} - {% if page.ancestors or section.ancestors %} - - -