Fix response bug in all requirement link

MinBZK · Nov 18, 2024 · 0e5e1bd · 0e5e1bd
1 parent ef409d5
commit 0e5e1bd
Showing 1 changed file with 12 additions and 8 deletions.
diff --git a/amt/site/templates/algorithms/details_base.html.j2 b/amt/site/templates/algorithms/details_base.html.j2
@@ -61,7 +61,10 @@
         <!-- Requirements Widget -->
         <div class="rvo-layout-grid-container">
             <div class="rvo-layout-grid rvo-layout-gap--sm rvo-layout-grid-columns--two rvo-layout-grid-layout--1fr">
-                <div class="rvo-card rvo-card--padding-md" style="height: 225px">
+                <div class="rvo-card rvo-card--padding-md"
+                     style="min-height: 225px;
+                            display: flex;
+                            flex-direction: column">
                     <div class="rvo-layout-row"
                          style="display: flex;
                                 justify-content: space-between">
@@ -105,18 +108,20 @@
                             {% endif %}
                         {% endfor %}
                     </ul>
-                    <a class="margin-top-large rvo-link rvo-link--normal rvo-link--with-icon rvo-layout-margin-vertical--sm"
+                    <a class="rvo-link rvo-link--normal rvo-link--with-icon"
                        href="/algorithm/{{ algorithm_id }}/details/system_card/requirements"
-                       style="bottom: 0;
-                              position: absolute">
+                       style="margin-top: auto">
                         <span class="utrecht-icon rvo-icon rvo-icon-pijl-naar-rechts rvo-icon--md rvo-icon--hemelblauw rvo-link__icon--before"
                               role="img"
                               aria-label="Home"></span>
                         {% trans %}Go to all requirements{% endtrans %}
                     </a>
                 </div>
                 <!-- Instrument Widget -->
-                <div class="rvo-card rvo-card--padding-md" style="height: 225px">
+                <div class="rvo-card rvo-card--padding-md"
+                     style="min-height: 225px;
+                            display: flex;
+                            flex-direction: column">
                     <div class="rvo-layout-row"
                          style="display: flex;
                                 justify-content: space-between">
@@ -157,10 +162,9 @@
                             {% endif %}
                         {% endfor %}
                     </ul>
-                    <a class="margin-top-large rvo-link rvo-link--normal rvo-link--with-icon rvo-layout-margin-vertical--sm"
+                    <a class="rvo-link rvo-link--normal rvo-link--with-icon"
                        href="/algorithm/{{ algorithm_id }}/details/system_card/instruments"
-                       style="bottom: 0;
-                              position: absolute">
+                       style="margin-top: auto">
                         <span class="utrecht-icon rvo-icon rvo-icon-pijl-naar-rechts rvo-icon--md rvo-icon--hemelblauw rvo-link__icon--before"
                               role="img"
                               aria-label="Home"></span>