added 1 img per row capability

dzluke · Mar 26, 2024 · 6f2c531 · 6f2c531
1 parent 8a71f67
commit 6f2c531
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 29 deletions.
diff --git a/index.html b/index.html
@@ -147,55 +147,60 @@ <h4 class="card-title">Video 6</h4>
 <section id="image">
     <div class="container mt-3">
         <h1 class="text-center">Images</h1>
+
+        <!-- One image per row -->
         <div class="row">
-            <div class="col-lg-6 mt-4">
-                <div class="card">
-                    <image class="card-img-top" src="images/add_dim1.png" alt="Card image" style="width:100%"></image>
-                    <div class="card-body">
-                        <h4 class="card-title">Image 1</h4>
-                        <p class="card-text">Adding values to the first dimension of each tensor at a specific layer.</p>
-                        <div class="text-center">
-                        </div>
+            <div class="col-lg-12 mt-4">
+                <image class="card-img-top" src="images/inversion.png" alt="Card image" style="width:100%"></image>
+                <div class="card-body">
+                    <h4 class="card-title">Image 1</h4>
+                    <p class="card-text">Adding values to the first dimension of each tensor at a specific layer.</p>
+                    <div class="text-center">
                     </div>
                 </div>
             </div>
+        </div>
 
-            <div class="col-lg-6 mt-4">
-                <div class="card portfolioContent">
-                    <image class="card-img-top" src="images/inversion.png" alt="Card image" style="width:100%"></image>
-                    <div class="card-body">
-                        <h4 class="card-title">Image 2</h4>
-                        <p class="card-text">Inverting values based on a given value at a specific layer.</p>
-                        <div class="text-center">
-                        </div>
+        <div class="row">
+            <div class="col-lg-12 mt-4">
+                <image class="card-img-top" src="images/dilation4_normalize4_orb .png" alt="Card image" style="width:100%"></image>
+                <div class="card-body">
+                    <h4 class="card-title">Image 1</h4>
+                    <p class="card-text">Adding values to the first dimension of each tensor at a specific layer.</p>
+                    <div class="text-center">
                     </div>
                 </div>
             </div>
         </div>
+
         <div class="row">
-            <div class="col-lg-6 mt-4">
-                <div class="card portfolioContent">
-                    <image class="card-img-top" src="images/dilation4_normalize4_orb .png" alt="Card image" style="width:100%"></image>
-                    <div class="card-body">
-                        <h4 class="card-title">Image 3</h4>
-                        <p class="card-text">Dialating tensors then normalizing at a specific layer.</p>
-                        <div class="text-center">
-                        </div>
+            <div class="col-lg-12 mt-4">
+                <image class="card-img-top" src="images/erosion4_normalize4_orb.png" alt="Card image" style="width:100%"></image>
+                <div class="card-body">
+                    <h4 class="card-title">Image 1</h4>
+                    <p class="card-text">Adding values to the first dimension of each tensor at a specific layer.</p>
+                    <div class="text-center">
                     </div>
                 </div>
             </div>
+        </div>
+
+        <!-- two images per row -->
+        <div class="row">
             <div class="col-lg-6 mt-4">
-                <div class="card portfolioContent">
-                    <image class="card-img-top" src="images/erosion4_normalize4_orb.png" alt="Card image" style="width:100%"></image>
+                <div class="card">
+                    <image class="card-img-top" src="images/add_dim1.png" alt="Card image" style="width:100%"></image>
                     <div class="card-body">
-                        <h4 class="card-title">Image 4</h4>
-                        <p class="card-text">Erosion of tensors then normalizing at a specific layer.</p>
+                        <h4 class="card-title">Image 1</h4>
+                        <p class="card-text">Adding values to the first dimension of each tensor at a specific layer.</p>
                         <div class="text-center">
                         </div>
                     </div>
                 </div>
-            </div>
+            </div>>
         </div>
+
+
         <div class="row">
             <div class="col-lg-6 mt-4">
                 <div class="card portfolioContent">
@@ -220,6 +225,7 @@ <h4 class="card-title">Image 6</h4>
                 </div>
             </div>
         </div>
+
         <div class="row">
             <div class="col-lg-6 mt-4">
                 <div class="card portfolioContent">
@@ -244,6 +250,7 @@ <h4 class="card-title">Image 8</h4>
                 </div>
             </div>
         </div>
+
         <div class="row">
             <div class="col-lg-6 mt-4">
                 <div class="card portfolioContent">
@@ -268,6 +275,7 @@ <h4 class="card-title">Image 10</h4>
                 </div>
             </div>
         </div>
+
     </div>
 </section>
 

diff --git a/style.css b/style.css
@@ -44,3 +44,6 @@
 .card-title {
     text-align: center;
 }
+.card-text {
+    text-align: center;
+}