style: correct the vertical spacing for cards on larger screens

96px above tags, 24px under tags, 120px to fill out the bottom of the card
compilerla · Jun 28, 2024 · f40f584 · f40f584
1 parent 0cfaba4
commit f40f584
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/src/our-work.html b/src/our-work.html
@@ -83,7 +83,7 @@ <h2 class="mb-4">Featured work</h2>
         {% for featured_work in site.data.featured_work limit: 2 %}
         <div class="col">
           <div class="card h-100 text-dark">
-            <div class="card-body p-4 m-2 p-lg-5 m-lg-3">
+            <div class="card-body p-4 m-2 px-lg-5 mx-lg-3 pt-lg-5 mt-lg-5 pb-lg-4 mb-6">
               {% if featured_work.tags %}
               <div class="row row-cols-1 row-cols-lg-auto g-2 g-lg-1">
                 {% for tag in featured_work.tags %}

diff --git a/src/styles/base.css b/src/styles/base.css
@@ -460,6 +460,10 @@ header {
     margin: 0;
 }
 
+.mb-6 {
+    margin-bottom: calc(96rem / 16) !important;
+}
+
 @media screen and (min-width: 992px) {
     .w-md-50 {
         width: 50% !important;