better grid view

frontend/src/Home/Home.scss

@@ -3,7 +3,7 @@
 .viewComponent {
     position: absolute;
     max-width: 100%;
-    width: 50rem;
+    width: 80%;
     left: 0;
     right: 0;
     top: -$pt-navbar-height;
@@ -24,7 +24,7 @@
     .bp3-navbar {
         transition: 0.3s;
 
-        > * {
+        >* {
             // keeps the breadcrumbs from taking all the space
             max-width: 65%;
         }
@@ -50,4 +50,4 @@
     .bp3-navbar {
         transition: 0.3s;
     }
-}
+}

frontend/src/Photos/Photos.scss

@@ -23,17 +23,25 @@
         }
 
         .photoCard {
+            display: flex;
+            justify-content: center;
+            align-items: center;
             transition: 0.3s;
             user-select: none;
             height: 15rem;
-            width: 10.5rem;
+            width: 20rem;
             margin: 1rem;
             padding: 0rem;
             overflow: hidden;
 
             img {
+                min-height: 100%;
+                min-width: 100%;
+                max-width: 100%;
+                max-height: 100%;
+                width: auto;
                 height: auto;
-                width: 100%;
+                object-fit: cover;
             }
         }
     }