Merge pull request #3333 from MTES-MCT/feature/3331-grey-closed-signa…

…lement [BO - Signalement] Pleine largeur pour le fond gris sur les signalements refusés et clôturés
MTES-MCT · Nov 25, 2024 · 3272476 · 3272476
2 parents 9356ea5 + 1c25417
commit 3272476
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 19 deletions.
diff --git a/assets/styles/histologe.scss b/assets/styles/histologe.scss
@@ -40,7 +40,11 @@ html, body {
     margin: 0;
 }
 img.huechange { filter: hue-rotate(120deg); }
-.signalement-invalid::before {
+
+main#container-horizontal:has(.signalement-invalid) {
+    background: rgba(0, 0, 0, 0.1);
+}
+main#container-vertical .signalement-invalid::before {
     content: '';
     position: absolute;
     line-height: 100vh;
@@ -50,6 +54,9 @@ img.huechange { filter: hue-rotate(120deg); }
     height: 100%;
     background: rgba(0, 0, 0, 0.1);
 }
+.fr-background--white.signalement-invalid {
+    background-color: inherit;
+}
 
 pre {
     overflow: auto !important;

diff --git a/templates/back/base_bo.html.twig b/templates/back/base_bo.html.twig
@@ -5,27 +5,30 @@
 {% block body %}
     {% if platform.feature_enable_menu_horizontale %}
         {% include 'back/nav_bo.html.twig' %}
-        <main class="{{ app.request.get('_route') in ['back_cartographie', 'back_signalement_index', 'back_dashboard'] ? 'fr-container-fluid' : container_class }}">
-            <div class="fr-grid-row">
-                <div class="fr-col-12" id="content">
+        <main id="container-horizontal">
+            <div class="{{ app.request.get('_route') in ['back_cartographie', 'back_signalement_index', 'back_dashboard'] ? 'fr-container-fluid' : container_class }}">
+                <div class="fr-grid-row">
+                    <div class="fr-col-12" id="content">
     {% else %}
-                    <main class="fr-container-fluid">
-                        <div class="fr-grid-row">
-                            {% include 'back/nav_bo.html.twig' %}
-                            <div class="fr-col-12 fr-col-md-9 fr-col-lg-10 overflow-x-hidden" id="content">
+        <main id="container-vertical">
+            <div class="fr-container-fluid">
+                <div class="fr-grid-row">
+                    {% include 'back/nav_bo.html.twig' %}
+                    <div class="fr-col-12 fr-col-md-9 fr-col-lg-10 overflow-x-hidden" id="content">
     {% endif %}
-                    {% for label, messages in app.flashes %}
-                        {% for message in messages %}
-                            <div role="alert" class="fr-alert fr-alert--{{ label }} fr-alert--sm">
-                                {% if label is same as('error error-raw')  %}
-                                    <p>{{ message|raw }}</p>
-                                {% else %}
-                                    <p>{{ message }}</p>
-                                {% endif %}
-                            </div>
+                        {% for label, messages in app.flashes %}
+                            {% for message in messages %}
+                                <div role="alert" class="fr-alert fr-alert--{{ label }} fr-alert--sm">
+                                    {% if label is same as('error error-raw')  %}
+                                        <p>{{ message|raw }}</p>
+                                    {% else %}
+                                        <p>{{ message }}</p>
+                                    {% endif %}
+                                </div>
+                            {% endfor %}
                         {% endfor %}
-                    {% endfor %}
-                    {% block content %}{% endblock %}
+                        {% block content %}{% endblock %}
+                    </div>
                 </div>
             </div>
         </main>