Update to carousel images.

public/index.html

@@ -48,18 +48,18 @@
     <div id="mainCarousel" class="carousel slide" data-ride="carousel">
         <div class="carousel-inner">
             <div class="carousel-item active">
-                <div class="text-center">
-                    <img src="./img/DolphinCroissant.png" />
+                <div class="image-vert text-center">
+                    <img class="img-fluid carousel-img" src="./img/friends.png" />
                 </div>
             </div>
             <div class="carousel-item">
-                <div class="text-center">
-                    <img src="./img/DolphinCroissant.png" />
+                <div class="image-vert text-center">
+                    <img class="img-fluid carousel-img" src="./img/repos.png" />
                 </div>
             </div>
             <div class="carousel-item">
-                <div class="text-center">
-                    <img src="./img/DolphinCroissant.png" />
+                <div class="image-vert text-center">
+                    <img class="img-fluid carousel-img" src="./img/DolphinCroissant.png" />
                 </div>
             </div>
         </div>
@@ -98,6 +98,7 @@
             </div>
             <img class="side-img img-fluid col" src="./img/graphExample.png" />
         </div>
+        <p>check</p>
     </div>
 </body>
 </html>

public/style.css

@@ -47,11 +47,27 @@
 
 #mainCarousel {
     height: 500px;
-    background-color: black;
+    background-color: #232323;
 }
 
 .carousel-item {
     height: 500px;
+    overflow: hidden;
+    vertical-align: middle;
+}
+
+.carousel-img {
+    width: 100%;
+    min-height: 300px;
+    display: inline-block;
+    top: 0%;
+    left: 0%;
+    position: absolute;
+}
+
+.img-vert {
+    display: inline-block;
+    height: 100%;
 }
 
 .error {
@@ -205,4 +221,12 @@ body {
         align-self: center;
         width: 80%;
     }
+
+    .carousel-img {
+        width: 100%;
+        min-height: 200px;
+        display: inline-block;
+        top: 10px;
+        position: relative;
+    }
 }