From 29ecfc78ac8f6cc1881f914970fb4564b4113df1 Mon Sep 17 00:00:00 2001
From: Simon C <simonc@linux.com>
Date: Sun, 20 Dec 2020 00:59:40 +0100
Subject: [PATCH] =?UTF-8?q?fix:=20Affichage=20du=20menu=20en=20JS=20vu=20q?=
 =?UTF-8?q?u'en=20CSS=20=C3=A7a=20ne=20fonctionne=20pas=20sous=20iOS?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 assets/styles/header.sass    | 27 ++++++++++++---------------
 layouts/partials/header.html |  6 +++---
 2 files changed, 15 insertions(+), 18 deletions(-)

diff --git a/assets/styles/header.sass b/assets/styles/header.sass
index 0b74b09..d51078b 100644
--- a/assets/styles/header.sass
+++ b/assets/styles/header.sass
@@ -164,12 +164,6 @@
       flex-direction: column
       justify-content: center
 
-      &:hover
-        display: inherit
-
-      &:hover + .close-button
-        display: inherit
-
       img
         display: inherit
 
@@ -213,16 +207,19 @@
     display: none
     white-space: nowrap
 
-    &:focus + #menu
-      display: inherit
-
-    &:focus + #menu + .close-button
-      display: inherit
-
-    @media screen and (max-width: $size-md)
-      display: inherit
-
   .close-button
     white-space: nowrap
     display: none
     z-index: 200
+
+  @media screen and (max-width: $size-md)
+    .nav[data-open="true"]
+      .open-button
+        display: none
+      .close-button, #menu
+        display: inherit
+    .nav[data-open="false"]
+      .open-button
+        display: inherit
+      .close-button, #menu
+        display: none
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 3318298..e3fbd40 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -13,14 +13,14 @@
       sizes="(max-width: 600px) 500px, 1920px"
      />
   {{ end }}
-  <nav class="nav">
+  <nav class="nav" id="nav" data-open="false">
     <div class="container">
       <div class="logo">
         <a href="/" class="">
           <img src="/icons/logo-entete-200x70.svg" alt="Blason de Crémeaux" />
         </a>
       </div>
-      <button class="open-button">≡ Menu</button>
+      <button class="open-button" onClick="document.getElementById('nav').setAttribute('data-open', true)">≡ Menu</button>
       <ol id="menu">
         {{ range .Site.Menus.main }}
         <li class="menu{{ if .HasChildren }} withSubmenu{{ end }}">
@@ -39,7 +39,7 @@
         </li>
         {{ end }}
       </ol>
-      <button class="close-button">✖ Fermer</button>
+      <button class="close-button" onClick="document.getElementById('nav').setAttribute('data-open', false)">✖ Fermer</button>
     </div>
   </nav>
 </header>