la grille s'affiche en 7 colonnes même sur smartphone

src/agenda_culturel/static/style.scss

@@ -163,6 +163,27 @@ footer {
 }
 
 
+#calendar {
+    width: 100%;
+    overflow: scroll;
+    .grid {
+        grid-template-columns: repeat(auto-fit, minmax(0%, 1fr));
+        min-width: 992px;
+    }
+    .grid.week-in-month {
+        grid-template-columns: 2.5em repeat(auto-fit, minmax(0%, 1fr));
+        margin-bottom: .5em;
+    }
+    .entete-semaine {
+        text-orientation: upright;
+        writing-mode: sideways-lr;
+        background: rgba(0, 137, 137, 0.2);
+        padding: 1em 0;
+        h2 {
+            margin: 0;
+        }
+    }
+}
 
 @media only screen and (min-width: 992px) {
 
@@ -182,19 +203,6 @@ footer {
         flex: auto;
     }
 
-    .grid.week-in-month {
-        grid-template-columns: 2.5em repeat(auto-fit, minmax(0%, 1fr));
-        margin-bottom: .5em;
-      }
-    .entete-semaine {
-        text-orientation: upright;
-        writing-mode: sideways-lr;
-        background: rgba(0, 137, 137, 0.2);
-        padding: 1em 0;
-        h2 {
-            margin: 0;
-        }
-    }
 
 }
 

src/agenda_culturel/templates/agenda_culturel/page-week.html

@@ -52,12 +52,15 @@
             </div>
         </div>
     </header>
-    <div class="grid" id="calendar">
-    {% for d in calendar.calendar_days_list %}
-    {% include "agenda_culturel/day-inc.html" with day=d fixed_style=calendar.all_in_past filter=filter %}
-    {% endfor %}
+    <div id="calendar">
+        <div class="grid">
+        {% for d in calendar.calendar_days_list %}
+        {% include "agenda_culturel/day-inc.html" with day=d fixed_style=calendar.all_in_past filter=filter %}
+        {% endfor %}
+        </div>
     </div>
 
+
     <footer>
         {% if calendar.today_in_calendar %}
         <a role="button" href="{% url 'aujourdhui' %}?{{ filter.get_url }}">Aujourd'hui</a>