amélioration du focus sur le jour d'hui

Fix #71

src/agenda_culturel/static/style.scss

@@ -171,10 +171,14 @@ footer {
 #calendar {
     width: 100%;
     overflow: auto;
+    scroll-snap-type: both mandatory;
 
     .grid {
         grid-template-columns: repeat(auto-fit, minmax(0%, 1fr));
         min-width: 1500px;
+        article {
+            scroll-snap-align: start;
+        }
 
     }
     .grid.week-in-month {

src/agenda_culturel/templates/agenda_culturel/day-inc.html

@@ -8,6 +8,17 @@
 {% with "date-"|add:daytag as daytag %}
 
 <article class="day{{ day|calendar_classes:fixed_style }}" id="{{ daytag }}">
+    {% if day.is_today %}
+    <script>
+        document.addEventListener("DOMContentLoaded", function(e) {
+            agenda = document.getElementById("calendar");
+            todayArticle = document.getElementById("today").parentElement;
+            left = todayArticle.offsetLeft;
+            top = todayArticle.offsetTop;
+            agenda.scrollTo({top: top, left: left});
+        });
+    </script>
+    {% endif %}
     <header{% if day.is_today %} id="today"{% endif %}>
     <{% if headers %}{{ headers }}{% else %}h2{% endif %}><a href="{{ day.date | url_day }}?{{ filter.get_url }}">{{ day.date | date:"l j" }}</a></{% if headers %}{{ headers }}{% else %}h2{% endif %}>
     </header>

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

@@ -34,11 +34,11 @@ Semaine du {{ calendar.calendar_days_list.0.date }}
         <div class="title"><h1>Semaine du {{ calendar.calendar_days_list.0.date }}</h1></div>
         <div class="navigation">
             <div>
-            <a role="button" href="{% url 'week_view' calendar.previous_week.year calendar.previous_week|week %}?{{ filter.get_url }}#today">
+            <a role="button" href="{% url 'week_view' calendar.previous_week.year calendar.previous_week|week %}?{{ filter.get_url }}">
                 {% picto_from_name "chevron-left" %} précédente</a>
             </div>
             <div class="right">
-            <a role="button" href="{% url 'week_view' calendar.next_week.year calendar.next_week|week %}?{{ filter.get_url }}#today">suivante 
+            <a role="button" href="{% url 'week_view' calendar.next_week.year calendar.next_week|week %}?{{ filter.get_url }}">suivante 
                 {% picto_from_name "chevron-right" %}
             </a>
             </div>
@@ -61,9 +61,9 @@ Semaine du {{ calendar.calendar_days_list.0.date }}
         {% if calendar.today_in_calendar %}
         <a role="button" href="{% url 'aujourdhui' %}?{{ filter.get_url }}">Aujourd'hui</a>
         {% endif %}
-        <a role="button" href="{% url 'month_view' calendar.firstdate.year calendar.firstdate.month %}?{{ filter.get_url }}#week-{{ calendar.calendar_days_list.0.date.isocalendar.1 }}">{{ calendar.firstdate | date:"F o" }}</a>
+        <a role="button" href="{% url 'month_view' calendar.firstdate.year calendar.firstdate.month %}?{{ filter.get_url }}">{{ calendar.firstdate | date:"F o" }}</a>
         {% if calendar.firstdate.month != calendar.lastdate.month %}
-            <a role="button" href="{% url 'month_view' calendar.lastdate.year calendar.lastdate.month %}?{{ filter.get_url }}#week-{{ calendar.calendar_days_list.0.date.isocalendar.1 }}">{{ calendar.lastdate | date:"F o" }}</a>
+            <a role="button" href="{% url 'month_view' calendar.lastdate.year calendar.lastdate.month %}?{{ filter.get_url }}">{{ calendar.lastdate | date:"F o" }}</a>
             {% endif %}
         </footer>
 </article>

src/agenda_culturel/templates/agenda_culturel/page.html

@@ -34,8 +34,8 @@
             <ul class="menu">
                 <li><a href="{% url 'event_search' %}">Rechercher {% picto_from_name "search" %}</a></li>
                 <li><a href="{% url 'aujourdhui' %}">Aujourd'hui</a></li>
-                <li><a href="{% url 'cette_semaine' %}#today">Cette semaine</a></li>
+                <li><a href="{% url 'cette_semaine' %}">Cette semaine</a></li>
-                <li><a href="{% url 'ce_mois_ci' %}#today">Ce mois-ci</a></li>
+                <li><a href="{% url 'ce_mois_ci' %}">Ce mois-ci</a></li>
             </ul>
         </div>
         <nav class="container-fluid">