From 9b536133909dd2a32c3c8831377c27bde35f3030 Mon Sep 17 00:00:00 2001
From: Louis Vigneras <louis.vigneras@code.gouv.fr>
Date: Fri, 5 Jul 2024 15:15:03 +0200
Subject: [PATCH 1/3] src/style.scss: Fix sticky sidebar

Fix sticky sidebar when scrolling for mobile screen width as well.
Remove .fr-sidemenu--sticky-full-height because it is neither used nor
existant.

Signed-off-by: Louis Vigneras <louis.vigneras@code.gouv.fr>
---
 src/style.scss | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/style.scss b/src/style.scss
index b3ec805..b798b24 100644
--- a/src/style.scss
+++ b/src/style.scss
@@ -23,11 +23,12 @@ body:not(.close) {
   }
 
   .sidebar {
-    @extend .fr-sidemenu--sticky-full-height;
     background-color: var(--background-default-grey);
     height: calc(100vh - 38px);
     overflow: auto;
     overflow-y: scroll;
+    position: sticky;
+    top: 0;
 
     @media (max-width: $mobile-phone-width) {
       height: 100%;
@@ -35,6 +36,8 @@ body:not(.close) {
       position: fixed;
       top: 0;
       z-index: 1000;
+      position: sticky;
+      top: 0;
     }
 
     .app-name, .sidebar-nav {

From 838a2425ad697811ec95b4f388ff15c65154846e Mon Sep 17 00:00:00 2001
From: Louis Vigneras <louis.vigneras@code.gouv.fr>
Date: Fri, 5 Jul 2024 16:59:51 +0200
Subject: [PATCH 2/3] src/style.scss: Fix bug responsiveness

The page was not responive for mobile phones. Use flex box to properly
have responsive content.

Signed-off-by: Louis Vigneras <louis.vigneras@code.gouv.fr>
---
 src/style.scss | 21 ++++++++++++---------
 1 file changed, 12 insertions(+), 9 deletions(-)

diff --git a/src/style.scss b/src/style.scss
index b798b24..f7cfcde 100644
--- a/src/style.scss
+++ b/src/style.scss
@@ -16,10 +16,12 @@ pre, code {
 
 body:not(.close) {
   main {
-    align-items: start;
-    display: grid;
-    grid-gap: 1rem;
-    grid-template-columns: $mobile-phone-width minmax(10px, 1fr);
+    display: flex;
+    flex-direction: row;
+
+    @media (max-width: $mobile-phone-width) {
+      overflow-x: hidden;
+    }
   }
 
   .sidebar {
@@ -29,15 +31,16 @@ body:not(.close) {
     overflow-y: scroll;
     position: sticky;
     top: 0;
+    width: $mobile-phone-width;
+    flex-shrink: 0;
 
     @media (max-width: $mobile-phone-width) {
-      height: 100%;
-      left: 0;
       position: fixed;
       top: 0;
-      z-index: 1000;
-      position: sticky;
-      top: 0;
+      left: 0;
+      width: 100vw;
+      height: 100vh;
+      z-index: 20;
     }
 
     .app-name, .sidebar-nav {

From c2424ce62b2a8e0dec18d08496206267de50f9e4 Mon Sep 17 00:00:00 2001
From: Louis Vigneras <louis.vigneras@code.gouv.fr>
Date: Fri, 5 Jul 2024 17:12:09 +0200
Subject: [PATCH 3/3] src/style.scss: Remove sidebar-toggle background color

Remove sidebar-toggle background color so that it does not hide content
of footer when scrolled all the way down.

Signed-off-by: Louis Vigneras <louis.vigneras@code.gouv.fr>
---
 src/style.scss | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/style.scss b/src/style.scss
index f7cfcde..0a72b76 100644
--- a/src/style.scss
+++ b/src/style.scss
@@ -98,7 +98,6 @@ body.close {
 }
 
 .sidebar-toggle {
-  background: var(--background-default-grey);
   bottom: 0;
   left: 0;
   padding: 10px;