Merge pull request #106 from amogusussy/Better_Image_Formatting

Better image formatting

misc/header.php

@@ -5,7 +5,7 @@
         <meta charset="UTF-8"/>
         <meta name="description" content="A privacy respecting meta search engine."/>
         <meta name="referrer" content="no-referrer"/>
-        <link rel="stylesheet" type="text/css" href="static/css/styles_min.css"/>
+        <link rel="stylesheet" type="text/css" href="static/css/styles.css"/>
         <link title="LibreX search" type="application/opensearchdescription+xml" href="/opensearch.xml?method=POST" rel="search"/>
         <link rel="stylesheet" type="text/css" href="<?php
                 echo "static/css/";

static/css/styles.css

@@ -255,8 +255,8 @@ a:hover,
 }
 
 .image-result-container {
-    display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
+    display: flex;
+    flex-wrap: wrap;
     grid-gap: 1.5rem;
     justify-items: center;
     margin-left: 9%;
@@ -265,11 +265,20 @@ a:hover,
     margin-bottom: 50px;
 }
 
-.image-result-container img {
-    border: 2px solid var(--button-bg);
-    margin: 10px;
+a[title] {
+    flex-grow: 1;
+    height: 12rem;
 }
 
+.image-result-container img {
+    margin: 0px;
+    height: 100%;
+    width: 100%;
+    object-fit: cover;
+    vertical-align: bottom;
+}
+
+
 .git-container {
     right: 0;
 }