Fixed results with images and font size of result options

resources/less/metager/pages/resultpage/result.less

@@ -108,21 +108,40 @@
     .result-body {
         margin-top: 1px;
         max-width:100%;
-        display: flex;
+        &.with-image {
+            display: grid;
+            grid-template-columns: minmax(max-content, 160px) auto;
+            grid-column-gap: 8px;
+            grid-row-gap: 8px;
+            @media(max-width: 380px){
+                grid-template-columns: 1fr;
+                grid-template-rows: auto auto;
+            }
+            .result-image {
+                align-self: center;
+                justify-self: center;
+            }
+            .result-description {
+                align-self: center;
+            }
+        }
         text-align: justify;
         .result-image {
-            width: 180px;
-            padding-right: 10px;
-            margin-right: 10px;
-            & img {
+            
+            max-width: 160px;
+            > a{
                 display: block;
-                max-width: 160px;
-                max-height: 120px;
-                width: auto;
-                height: auto;
+                > img {
+                    display: block;
+                    max-width: 160px;
+                    max-height: 120px;
+                    width: auto;
+                    height: auto;
+                }
             }
         }
         .result-description {
+            align-self: center;
             margin-bottom: 3px;
             color: @result-description-color;
             font-size: .95em;;
@@ -238,7 +257,6 @@
     &>.result-options {
         max-width: 100%;
         &>.options {
-            font-size: .85em;
             border-top: 1px solid #ccc;
             width: 100%;
             text-align: right;

resources/views/layouts/result.blade.php

@@ -22,7 +22,7 @@
 			@endif
 		</div>
 	</div>
-	<div class="result-body">
+	<div class="result-body {{ (!empty($result->logo) || !empty($result->image) ? "with-image" : "")}}">
 		@if( isset($result->logo) )
 			<div class="result-logo">
 				<a href="{{ $result->link }}" target="{{ $metager->getNewtab() }}" rel="noopener">
@@ -33,7 +33,7 @@
 		@if( $result->image !== "" )
 			<div class="result-image">
 				<a href="{{ $result->link }}" target="{{ $metager->getNewtab() }}" rel="noopener">
-					<img src="{{ $metager->getImageProxyLink($result->image) }}" align="left" width="120px" height="60px" alt="" />
+					<img src="{{ $metager->getImageProxyLink($result->image) }}" alt="" />
 				</a>
 			</div>
 		@endif