Make chart and controls responsive

vvasiloi · Sep 30, 2024 · 0e8042c · 0e8042c
1 parent 1df8ea4
commit 0e8042c
Showing 1 changed file with 3 additions and 3 deletions.
diff --git a/templates/components/MonthYieldChart.html.twig b/templates/components/MonthYieldChart.html.twig
@@ -1,18 +1,18 @@
 <div {{ attributes }}>
-    <div style="min-height: 480px; margin-bottom: 1.5rem;">
+    <div style="margin-bottom: 1.5rem;">
         {{ render_chart(chart) }}
     </div>
     <hr>
     <div class="row justify-content-center">
-        <div class="col-2">
+        <div class="col-12 col-sm-6 col-lg-4 col-xl-3">
             <select id="year" class="form-select" data-model="year">
                 {% for value, label in years %}
                     <option {% if value == year%}selected{% endif%} value="{{ value }}">{{ label }}</option>
                 {% endfor %}
             </select>
         </div>
 
-        <div class="col-2">
+        <div class="col-12 col-sm-6 col-lg-4 col-xl-3">
             <select id="month" class="form-select" data-model="month">
                 {% for value, label in months %}
                     <option {% if value == month%}selected{% endif%} value="{{ value }}">{{ label }}</option>