Refacto navigation bar (#1024)

MTES-MCT · Oct 23, 2024 · cbe5185 · cbe5185
1 parent b12cf3e
commit cbe5185
Show file tree

Hide file tree

Showing 37 changed files with 187 additions and 170 deletions.
diff --git a/templates/accessRequest.html.twig b/templates/accessRequest.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{'accessRequest.meta.title'|trans}} - {{ parent() }}

diff --git a/templates/accessibility_statement.html.twig b/templates/accessibility_statement.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     Accessibilité : non conforme - {{ parent() }}

diff --git a/templates/bundles/TwigBundle/Exception/error.html.twig b/templates/bundles/TwigBundle/Exception/error.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{ 'error.status_code.title'|trans }} - {{ parent() }}

diff --git a/templates/bundles/TwigBundle/Exception/error403.html.twig b/templates/bundles/TwigBundle/Exception/error403.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{ 'error.403.title'|trans }} - {{ parent() }}

diff --git a/templates/bundles/TwigBundle/Exception/error404.html.twig b/templates/bundles/TwigBundle/Exception/error404.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{ 'error.404.title'|trans }} - {{ parent() }}

diff --git a/templates/common/header.html.twig b/templates/common/header.html.twig
@@ -14,7 +14,7 @@
                         </div>
                     </div>
                     <div class="fr-header__service">
-                        <a href="{{ path('app_landing') }}" title="{{ 'common.site_name'|trans }}">
+                        <a href="{{ app.user ? path('app_regulations_list') : path('app_landing') }}" title="{{ 'common.site_name'|trans }}">
                             <p class="fr-header__service-title">
                                 {{ 'common.site_name'|trans }}
                                 <span class="fr-badge fr-badge--new">bêta</span>
@@ -26,11 +26,6 @@
                 <div class="fr-header__tools" data-testid="user-links">
                     <div class="fr-header__tools-links">
                         <ul class="fr-btns-group">
-                            <li>
-                                <a class="fr-btn fr-icon-file-text-line" href="{{ path('app_regulations_list') }}">
-                                    {{ 'regulation.list.title'|trans }}
-                                </a>
-                            </li>
                             {% if app.user %}
                                 <li>
                                     <a class="fr-btn fr-icon-edit-line" href="{{ path('app_feedback') }}">

diff --git a/templates/ecodesign_statement.html.twig b/templates/ecodesign_statement.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% set title = "Déclaration d'écoconception" %}
 

diff --git a/templates/feedback.html.twig b/templates/feedback.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{'feedback.meta.title'|trans}} - {{ parent() }}

diff --git a/templates/forgot-password.html.twig b/templates/forgot-password.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{ 'forgot_password.title'|trans }} - {{ parent() }}

diff --git a/templates/index.html.twig b/templates/index.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{ parent() }}

diff --git a/templates/landing_authorities.html.twig b/templates/landing_authorities.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{ 'landing.authorities.metatitle'|trans }} - {{ parent() }}

diff --git a/templates/landing_digital_services.html.twig b/templates/landing_digital_services.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{ 'landing.digital_services.metatitle'|trans }} - {{ parent() }}

diff --git a/templates/landing_road_users.html.twig b/templates/landing_road_users.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{ 'landing.road_users.metatitle'|trans }} - {{ parent() }}

diff --git a/templates/layouts/_base.html.twig b/templates/layouts/_base.html.twig
diff --git a/templates/layouts/app.html.twig b/templates/layouts/app.html.twig
diff --git a/templates/layouts/layout.html.twig b/templates/layouts/layout.html.twig
@@ -0,0 +1,122 @@
+<!doctype html>
+<html lang="fr">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    {% set _nonce = csp_nonce('script') %}
+    {% set _nonce = csp_nonce('style') %}
+    <meta name="csp-nonce" content="{{ _nonce }}">
+
+    <link rel="apple-touch-icon" href="{{ asset('build/dsfr/favicon/apple-touch-icon.png') }}"><!-- 180×180 -->
+    <link rel="icon" href="{{ asset('build/dsfr/favicon/favicon.svg') }}" type="image/svg+xml">
+    <link rel="shortcut icon" href="{{ asset('build/dsfr/favicon/favicon.ico') }}" type="image/x-icon"><!-- 32×32 -->
+    <link rel="manifest" href="{{ asset('build/dsfr/favicon/manifest.webmanifest') }}" crossorigin="use-credentials">
+
+    <title>{% block title %}{{ 'common.title'|trans }}{% endblock %}</title>
+
+    {% block stylesheets %}
+        {{ encore_entry_link_tags('app') }}
+    {% endblock %}
+
+    {% block javascripts %}
+        {{ encore_entry_script_tags('app') }}
+        <script type="module" src="{{ asset('build/dsfr/dsfr.module.min.js') }}" defer></script>
+        <script type="text/javascript" nomodule src="{{ asset('build/dsfr/dsfr.nomodule.min.js') }}" defer></script>
+    {% endblock %}
+  </head>
+  <body>
+
+    {% set skipLinks = [
+        {href: '#header-navigation', label: 'public.skiplinks.menu'|trans},
+    ] %}
+
+    {% include 'common/skiplinks.html.twig' with { skipLinks: [
+        {href: '#content', label: 'common.skiplinks.content'|trans},
+        ...(skipLinks|default([])),
+        {href: '#footer', label: 'common.skiplinks.footer'|trans},
+    ]} only %}
+
+    {% embed 'common/header.html.twig' %}
+        {% block navigation %}
+            <nav class="fr-nav" id="header-navigation" role="navigation" aria-label="Menu principal">
+                <ul class="fr-nav__list">
+                    {% if not app.user %}
+                        <li class="fr-nav__item">
+                            <a class="fr-nav__link" href="{{ path('app_landing') }}" {% if 'app_landing' == app.current_route %}aria-current="page"{% endif %}>
+                                {{ 'landing.menu.button.home'|trans }}
+                            </a>
+                        </li>
+                        <li>
+                            <a class="fr-nav__link" href="{{ path('app_landing_authorities') }}" {% if 'app_landing_authorities' == app.current_route %}aria-current="page"{% endif %}>
+                                {{ 'landing.menu.button.authorities'|trans }}
+                            </a>
+                        </li>
+                        <li class="fr-nav__item">
+                            <a class="fr-nav__link" href="{{ path('app_landing_digital_services') }}" {% if 'app_landing_digital_services' == app.current_route %}aria-current="page"{% endif %}>
+                                {{ 'landing.menu.button.digital_services'|trans }}
+                            </a>
+                        </li>
+                        <li class="fr-nav__item">
+                            <a class="fr-nav__link" href="{{ path('app_landing_road_users') }}" {% if 'app_landing_road_users' == app.current_route %}aria-current="page"{% endif %}>
+                                {{ 'landing.menu.button.road_users'|trans }}
+                            </a>
+                        </li>
+                        <li class="fr-nav__item">
+                            <a class="fr-nav__link" href="{{ path('app_regulations_list') }}" {% if 'app_regulations_list' == app.current_route %}aria-current="page"{% endif %}>
+                                {{ 'landing.menu.button.restrictions'|trans }}
+                            </a>
+                        </li>
+                        <li class="fr-nav__item">
+                            <a class="fr-nav__link" href="{{ path('app_carto') }}" {% if 'app_carto' == app.current_route %}aria-current="page"{% endif %}>
+                                {{ 'landing.menu.button.map'|trans }}
+                            </a>
+                        </li>
+                        <li class="fr-nav__item">
+                            <a class="fr-nav__link" href="/blog/fr/" target="_blank">
+                                {{ 'common.blog'|trans }}
+                            </a>
+                        </li>
+                    {% else %}
+                        <li class="fr-nav__item">
+                            <a class="fr-nav__link" href="{{ path('app_regulations_list') }}" {% if 'app_regulations_list' == app.current_route %}aria-current="page"{% endif %}>
+                                {{ 'landing.menu.button.restrictions'|trans }}
+                            </a>
+                        </li>
+                        <li class="fr-nav__item">
+                            <a class="fr-nav__link" href="{{ path('app_carto') }}" {% if 'app_carto' == app.current_route %}aria-current="page"{% endif %}>
+                                {{ 'landing.menu.button.map'|trans }}
+                            </a>
+                        </li>
+                    {% endif %}
+                </ul>
+            </nav>
+        {% endblock %}
+    {% endembed %}
+
+    <main class="{% block page_class %}{% endblock page_class %}">
+        <noscript>
+            <section class="fr-container fr-mt-3w">
+                <div class="fr-alert fr-alert--info">
+                    {{ 'common.javascript_required'|trans|raw }}
+                </div>
+            </section>
+        </noscript>
+        {% for label, messages in app.flashes %}
+            {% if loop.first %}<div class="fr-container fr-pt-4w">{% endif %}
+            {% for message in messages %}
+                <div class="fr-alert fr-alert--{{ label }}">
+                    {{ message|raw }}
+                </div>
+            {% endfor %}
+            {% if loop.last %}</div>{% endif %}
+        {% endfor %}
+
+        <div {% if not definesContentSkiplink|default(false) %}id="content"{% endif %}>
+            {% block body %}{% endblock %}
+        </div>
+    </main>
+    {% include 'common/footer.html.twig' %}
+
+    {% block body_end %}{% endblock %}
+  </body>
+</html>
diff --git a/templates/layouts/public.html.twig b/templates/layouts/public.html.twig
diff --git a/templates/legal.html.twig b/templates/legal.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% set title = 'legal.title'|trans %}
 
@@ -49,7 +49,7 @@
 
             Les pictogrammes sont issus du [système de design de l'Etat](https://www.systeme-de-design.gouv.fr/elements-d-interface/fondamentaux-techniques/pictogramme) publié sous licence [MIT](https://opensource.org/license/mit/).
 
-            Les icones sont issues : 
+            Les icones sont issues :
             * du [système de design de l'Etat](https://www.systeme-de-design.gouv.fr/elements-d-interface/fondamentaux-techniques/icone) publié sous licence [MIT](https://opensource.org/license/mit/),
             * de [Remix Icon](https://remixicon.com/) publié sous licence [Apache 2.0](https://www.apache.org/licenses/LICENSE-2.0).
 

diff --git a/templates/login.html.twig b/templates/login.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{ 'login.meta.title'|trans }} - {{ parent() }}

diff --git a/templates/map/map.html.twig b/templates/map/map.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/public.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{'map.meta.title'|trans}} - {{ parent() }}
@@ -40,7 +40,7 @@
                                 }) }}
                                 {{ form_widget(form.measureTypes) }}
                             </fieldset>
-                            
+
                             <h4 class="fr-h6 fr-my-2w">{{ 'map.filters.title.type.regulation'|trans }}</h4>
                             {{ form_row(form.displayPermanentRegulations, {group_class: 'fr-checkbox-group'}) }}
                             {{ form_row(form.displayTemporaryRegulations, {group_class: 'fr-checkbox-group'}) }}

diff --git a/templates/my_area/index.html.twig b/templates/my_area/index.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{'user.myarea'|trans}} - {{ parent() }}

diff --git a/templates/my_area/organization/user/form.html.twig b/templates/my_area/organization/user/form.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 {% set metaTitle = user is defined ? user.fullName : 'user.form.add'|trans %}
 {% block title %}
     {{ metaTitle }} - {{ parent() }}

diff --git a/templates/my_area/organization/user/index.html.twig b/templates/my_area/organization/user/index.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{'user.list.title'|trans }} - {{ parent() }}

diff --git a/templates/my_area/organization/visa_model/form.html.twig b/templates/my_area/organization/visa_model/form.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 {% set metaTitle = visaModel is defined ? visaModel.name : 'visa.add.title'|trans %}
 {% block title %}
     {{ metaTitle }} - {{ parent() }}

diff --git a/templates/my_area/organization/visa_model/index.html.twig b/templates/my_area/organization/visa_model/index.html.twig
@@ -1,4 +1,4 @@
-{% extends 'layouts/app.html.twig' %}
+{% extends 'layouts/layout.html.twig' %}
 
 {% block title %}
     {{'visa.list.title'|trans }} - {{ parent() }}