quatuorbellefeuille.com

commit 9101c491153a5016888d05314cebbd67a8bf3322
parent aaef34f4d967888e4249b8c72f025ed24c4da8bf
Author: Kévin Le Gouguec <kevin.legouguec@gmail.com>
Date:   Wed,  3 Mar 2021 23:52:35 +0100

Revert "Move lang button at the bottom of the menu"

This reverts commit aaef34f4d967888e4249b8c72f025ed24c4da8bf.

Layout is reportedly broken on actual phones.

Diffstat:
M
stylesheets/commun.css
 | 
31
++++++++++++++++++-------------
M
template.html
 | 
6
+++---

2 files changed, 21 insertions(+), 16 deletions(-)
diff --git a/stylesheets/commun.css b/stylesheets/commun.css
@@ -306,7 +306,7 @@ footer.legal {
         z-index: 1;
 
         display: grid;
-        grid-template-columns: 3rem 1fr;
+        grid-template-columns: 3rem 1fr 3rem;
         grid-template-rows: 3rem repeat(4, auto);
     }
     header.slidingmenu > .content > img.button.close {
@@ -318,9 +318,22 @@ footer.legal {
         grid-row: 1 / 3;
         justify-self: start;
     }
+    header.slidingmenu > .content > a.lang {
+        grid-column: -2;
+        grid-row: 1;
+
+        display: flex;
+        align-self: center;
+        justify-self: center;
+        align-items: center;
+        justify-content: center;
+
+        padding: 0.4rem;
+        font-size: 0.8rem;
+    }
     header.slidingmenu > .content > nav.menu,
     header.slidingmenu > .content > nav.social {
-        grid-column: 2;
+        grid-column: 1 / -1;
     }
 
     header.slidingmenu > .content nav ol,
@@ -331,18 +344,20 @@ footer.legal {
     header.slidingmenu > .content > nav.menu li > a {
         display: block;
         padding: 0.5em;
+        padding-left: 2em;
     }
     header.slidingmenu > .content > nav.menu li.dropdown > a {
         display: flex;
     }
     header.slidingmenu > .content > nav.menu li.dropdown li > a {
         padding: 0.2em;
-        padding-left: 2em;
+        padding-left: 4em;
     }
 
     header.slidingmenu > .content > nav.social > ul {
         display: flex;
         padding-left: 0;
+        margin-left: 2em;
     }
     header.slidingmenu > .content > nav.social > ul > li:not(:first-child) {
         margin-left: 1em;
@@ -357,16 +372,6 @@ footer.legal {
         height: 2em;
     }
 
-    header.slidingmenu > .content > a.lang {
-        grid-column: 2;
-
-        justify-self: start;
-
-        margin-left: 0.5em;
-        padding: 0.4rem;
-        font-size: 0.8rem;
-    }
-
     header.slidingmenu > input:checked ~ .content {
         transform: none;
     }
diff --git a/template.html b/template.html
@@ -25,6 +25,9 @@
             <h1>Quatuor Bellefeuille</h1>
           </a>
         </header>
+        <a class="lang" href="">
+          EN
+        </a>
         <nav class="menu">
           <ol>
             <li class="dropdown"><a href="quatuor.html">le quatuor</a>
@@ -63,9 +66,6 @@
             </li>
           </ul>
         </nav>
-        <a class="lang" href="">
-          EN
-        </a>
       </div>
     </header>