From 9e58b3aca89dc30a4fdb574bc5f79a7f7061fc8b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C3=93scar?= <welpo@users.noreply.github.com>
Date: Wed, 27 Nov 2024 15:55:51 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=92=84=20style:=20fix=20home=20banner=20l?=
 =?UTF-8?q?ayout=20for=20short=20intro=20(#438)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 sass/parts/_home-banner.scss | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/sass/parts/_home-banner.scss b/sass/parts/_home-banner.scss
index 79e17a645..ce6b9c137 100644
--- a/sass/parts/_home-banner.scss
+++ b/sass/parts/_home-banner.scss
@@ -1,7 +1,7 @@
 #banner-container-home {
     display: flex;
-    justify-content: center;
-    align-items: center;
+    justify-content: space-between;
+    align-items: flex-start;
     margin: 0.2rem auto;
     width: 100%;
 
@@ -11,6 +11,7 @@
     }
 
     #home-banner-text {
+        flex: 1;
         margin-block-end: 1.5rem;
         color: var(--primary-color);
         font-size: 1.875rem;
@@ -53,9 +54,9 @@
 
     #image-container-home {
         position: relative;
+        margin: auto 0;
         padding-inline-start: 2rem;
-        min-width: 11rem;
-        min-height: 11rem;
+        max-width: 11rem;
         overflow: hidden;
         text-align: center;
 
@@ -63,9 +64,8 @@
             border: none;
             aspect-ratio: 1 / 1;
             width: 100%;
-            max-width: 15rem;
-            height: auto;
-            max-height: 15rem;
+            height: 100%;
+            object-fit: cover;
 
             @media only screen and (max-width: 600px) {
                 max-width: 12rem;
@@ -75,6 +75,8 @@
 
         @media only screen and (max-width: 600px) {
             padding-inline-start: 0;
+            width: 100%;
+            max-width: none;
         }
     }
 }