Merge pull request #29 from Mbutler1991/mark-butler

Mark butler
Mbutler1991 · Dec 14, 2023 · 6492fd4 · 6492fd4
2 parents ce49978 + fd9c723
commit 6492fd4
Showing 1 changed file with 49 additions and 36 deletions.
diff --git a/index.html b/index.html
@@ -16,45 +16,58 @@
   <header>
 
   </header> 
-  <div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="false">
-  <div class="carousel-indicators">
-    <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
-    <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
-    <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
-  </div>
-  <div class="carousel-inner">
-    <div class="carousel-item active">
-      <img src="assets/images/more-food.jpg" class="d-block w-100" alt="more-food">
-      <div class="carousel-caption d-none d-md-block">
-        <h5>Placeholder Recipe Name</h5>
-        <p>Placeholder Recipe Description</p>
-      </div>
-    </div>
-    <div class="carousel-item">
-      <img src="assets/images/food.jpg" class="d-block w-100" alt="food">
-      <div class="carousel-caption d-none d-md-block">
-        <h5>Placeholder Recipe Name</h5>
-        <p>Placeholder Recipe Description</p>
-      </div>
-    </div>
-    <div class="carousel-item">
-      <img src="assets/images/cake.jpg" class="d-block w-100" alt="cake">
-      <div class="carousel-caption d-none d-md-block">
-        <h5>Placeholder Recipe Name</h5>
-        <p>Placeholder Recipe Description</p>
+  <div class="container mt-4">
+    <div class="row justify-content-center">
+      <div class="col-md-8">
+        <div id="carouselExampleCaptions" class="carousel slide position-relative" data-bs-ride="false">
+          <div class="carousel-indicators">
+            <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active"
+              aria-current="true" aria-label="Slide 1"></button>
+            <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1"
+              aria-label="Slide 2"></button>
+            <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2"
+              aria-label="Slide 3"></button>
+          </div>
+          <div class="carousel-inner">
+            <div class="carousel-item active">
+              <img src="assets/images/more-food.jpg"
+                class="d-block w-100" alt="more-food">
+              <div class="carousel-caption d-none d-md-block">
+                <h5>Placeholder Recipe Name</h5>
+                <p>Placeholder Recipe Description</p>
+              </div>
+            </div>
+            <div class="carousel-item">
+              <img src="assets/images/food.jpg" class="d-block w-100"
+                alt="food">
+              <div class="carousel-caption d-none d-md-block">
+                <h5>Placeholder Recipe Name</h5>
+                <p>Placeholder Recipe Description</p>
+              </div>
+            </div>
+            <div class="carousel-item">
+              <img src="assets/images/cake.jpg" class="d-block w-100"
+                alt="cake">
+              <div class="carousel-caption d-none d-md-block">
+                <h5>Placeholder Recipe Name</h5>
+                <p>Placeholder Recipe Description</p>
+              </div>
+            </div>
+          </div>
+          <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions"
+            data-bs-slide="prev">
+            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+            <span class="visually-hidden">Previous</span>
+          </button>
+          <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions"
+            data-bs-slide="next">
+            <span class="carousel-control-next-icon" aria-hidden="true"></span>
+            <span class="visually-hidden">Next</span>
+          </button>
+        </div>
       </div>
     </div>
   </div>
-  <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="prev">
-    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
-    <span class="visually-hidden">Previous</span>
-  </button>
-  <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="next">
-    <span class="carousel-control-next-icon" aria-hidden="true"></span>
-    <span class="visually-hidden">Next</span>
-  </button>
-</div>
-
   <footer>
     Mark
     Caylin