Fix Library Grid Scaling issue.

Fix for #257
Now each column can adjust it's height, and keeps it's aspect ratio, based on the cover images.
Only downside is that if the images are not the same size, they may not line up on the bottom edge. But this looks much more natural

src/components/library/LibraryGrid.css

@@ -3,6 +3,7 @@
   opacity: 0.8;
   background-size: cover;
   cursor: pointer;
+  text-align: center;
 }
 
 .coverContainer:hover {

src/components/library/LibraryGrid.tsx

@@ -187,17 +187,23 @@ const LibraryGrid: React.FC<Props> = (props: Props) => {
                   <div
                     className={styles.coverContainer}
                     onClick={() => viewFunc(series)}
-                    style={{
-                      height: `calc(105vw / ${libraryColumns})`,
-                    }}
+                    // style={{
+                      // height: `calc(105vw / ${libraryColumns})`,
+                    // }}
                   >
                     <ExtensionImage
                       url={coverSource}
                       series={series}
                       alt={series.title}
-                      width="100%"
-                      height="100%"
-                      style={{ objectFit: 'cover' }}
+                      // width="100%"
+                      // height="100%"
+                      style={{
+						  objectFit: 'cover',
+						  width: '100%',
+						  height: '100%'
+						  // maxWidth: '100%',
+						  // maxHeight: '100%'						  
+					    }}
                     />
                     {renderUnreadBadge(series)}
                     {libraryView === LibraryView.GridCompact ? (

src/components/search/SearchGrid.css

@@ -2,6 +2,7 @@
   position: relative;
   opacity: 0.8;
   background-size: cover;
+  text-align: center;
 }
 
 .coverContainer:hover {

src/components/search/SearchGrid.tsx

@@ -67,7 +67,7 @@ const SearchGrid: React.FC<Props> = (props: Props) => {
             setShowingContextMenu(true);
           }}
           style={{
-            height: `calc(105vw / ${libraryColumns})`,
+            // height: `calc(105vw / ${libraryColumns})`,
             cursor: inLibrary ? 'not-allowed' : 'pointer',
           }}
         >
@@ -79,9 +79,15 @@ const SearchGrid: React.FC<Props> = (props: Props) => {
             url={series.remoteCoverUrl}
             series={series}
             alt={series.title}
-            width="100%"
-            height="100%"
-            style={{ objectFit: 'cover' }}
+            // width="100%"
+			// height="100%"
+             style={{
+				objectFit: 'cover',
+				width: '100%',
+				height: '100%'
+				// maxWidth: '100%',
+				// maxHeight: '100%'						  
+			}}
           />
           {inLibrary ? <Overlay opacity={0.5} color="#2B8A3E" /> : ''}
           <Title className={styles.seriesTitle} order={5} lineClamp={3} p={4}>