Amélioration visuel véhicule

vehicles/static/vehicles/style.css

@@ -1,6 +1,28 @@
+     /* ===== Scrollbar CSS ===== */
+  /* Firefox */
+  * {
+    scrollbar-width: auto;
+    scrollbar-color: #ffffff #ffffff;
+  }
+
+  /* Chrome, Edge, and Safari */
+  *::-webkit-scrollbar {
+    width: 12px;
+  }
+
+  *::-webkit-scrollbar-track {
+    background: black;
+  }
+
+  *::-webkit-scrollbar-thumb {
+    background-color: #ffffff;
+    border-radius: 15px;
+    border: 3px solid #ffffff;
+  }
  :root{
     --main-text-color: white;
     --main-text-family: 'Source Sans Pro', sans-serif;
+    --main-child-container-height: 175px;
 }
  .main_container{
         width: 100%;
@@ -30,7 +52,7 @@
     gap: 0px;
     align-items: stretch;
   }
-  .child div{
+  .child_box div{
 
 
   }

vehicles/templates/vhc/vhc.html

@@ -19,7 +19,7 @@
 
         </div>
         <div class="child_box" style="height: 70%;">
-            <div style="width: 46%; padding: 2px;">
+            <div style="width: 46%; padding: 2px;height: var(--main-child-container-height);">
                 <b>Infos techniques</b>
                 {% for info in vhc.get_all_infos_tech %}
                 <div style="margin-top: 15px">
@@ -30,7 +30,7 @@
 
 
             </div>
-            <div style="width: 46%;padding: 2px;">
+            <div style="width: 46%;padding: 2px;height: var(--main-child-container-height);">
                 <b>Matériels manquants</b>
                  {% for info in vhc.get_all_infos_mat %}
                 <div style="margin-top: 15px">
@@ -39,17 +39,17 @@
                 </div>
                 {% endfor %}
             </div>
-            <div style="width: 350px; ">
+            <div style="width: 350px;height: var(--main-child-container-height); ">
                 <b>Péremptions</b>
                 <div class="child_box">
 
-                    <div style="width: 170px;">
+                    <div style="width: 170px;margin-top: 15px">
                         {% for info in vhc.get_all_infos_perempt_perma %}
                         <a href="/admin/vehicles/vehicles_infos/{{info.id}}" target="_blank">{{info.sDesc}}</a><br>
                         {% endfor %}
                     </div>
 
-                    <div style="width: 170px;">
+                    <div style="width: 170px;margin-top: 15px">
                         {% for info in vhc.get_all_infos_perempt %}
                         <a href="/admin/vehicles/vehicles_infos/{{info.id}}" target="_blank">{{info.sDesc}}</a> <br>
                         {% endfor %}