fix: alignment of non-image description paragraphs

compilerla · Jul 9, 2024 · 2835117 · 2835117
1 parent 8cf1504
commit 2835117
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 2 deletions.
diff --git a/src/our-work.html b/src/our-work.html
@@ -95,7 +95,7 @@ <h2 class="mb-4">Featured work</h2>
         <div class="col">
           <div class="card h-100 text-dark border-0">
             <div class="card-body px-lg-5 mx-lg-3 py-lg-5 my-lg-5 pt-3 mt-3 pb-5 pb-3 px-4 px-2">
-              <div class="min-h-70">
+              <div class="min-h-40">
                 {% 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 %}
@@ -106,6 +106,8 @@ <h2 class="mb-4">Featured work</h2>
                 </div>
                 {% endif %}
                 <h3 class="card-title fw-boldest pb-4 mb-0 pb-lg-2 mb-lg-5 pt-2 pt-lg-0 mt-4">{{ featured_work.title }}</h3>
+              </div>
+              <div class="min-h-35">
                 <p class="card-text pb-2 mb-5">{{ featured_work.description }}</p>
               </div>
 
@@ -150,7 +152,7 @@ <h4 class="pill fs-8 p-0 mb-3 text-dark fw-boldest">Outcome</h4>
         <div class="col">
           <div class="card h-100 text-dark border-0">
             <div class="card-body px-lg-5 mx-lg-3 py-lg-5 my-lg-5 pt-3 mt-3 pb-5 pb-3 px-4 px-2">
-              <div class="min-h-70">
+              <div class="min-h-40">
                 {% 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 %}
@@ -161,6 +163,8 @@ <h4 class="pill fs-8 p-0 mb-3 text-dark fw-boldest">Outcome</h4>
                 </div>
                 {% endif %}
                 <h3 class="card-title fw-boldest pb-4 mb-0 pb-lg-2 mb-lg-5 pt-2 pt-lg-0 mt-4">{{ featured_work.title }}</h3>
+              </div>
+              <div class="min-h-35">
                 <p class="card-text pb-2 mb-5">{{ featured_work.description }}</p>
               </div>
 

diff --git a/src/styles/base.css b/src/styles/base.css
@@ -460,6 +460,14 @@ header {
     margin: 0;
 }
 
+.min-h-35 {
+    min-height: 35%;
+}
+
+.min-h-40 {
+    min-height: 40%;
+}
+
 .min-h-70 {
     min-height: 70%;
 }