From 1f11e8480ef33427f5e3f74a8660a584817fa695 Mon Sep 17 00:00:00 2001
From: welpo <welpo@users.noreply.github.com>
Date: Sun, 5 Feb 2023 02:06:54 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20fix:=20improve=20responsiveness?=
 =?UTF-8?q?=20of=20home=20banner?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 sass/parts/_cards.scss       | 38 ++++++++++++++++++------------------
 sass/parts/_home-banner.scss | 36 +++++++++++++++++++++-------------
 2 files changed, 41 insertions(+), 33 deletions(-)

diff --git a/sass/parts/_cards.scss b/sass/parts/_cards.scss
index a112546..16a3883 100644
--- a/sass/parts/_cards.scss
+++ b/sass/parts/_cards.scss
@@ -37,39 +37,39 @@
     overflow: hidden;
 }
 
-@media all and (max-width:720px) {
+@media all and (max-width: 720px) {
     .cards {
         gap: 18px;
     }
 }
 
-.bloglist-table-row{
-    padding:2%;
-    background-color:var(--navbar-color);
+.bloglist-table-row {
+    padding: 2%;
+    background-color: var(--navbar-color);
     border-radius: 5px;
     transition: 300ms;
     width: 28%;
-    margin-right:1%;
-    margin-top:3%;
+    margin-right: 1%;
+    margin-top: 1%;
 }
-.bloglist-container{
-    display:flex;
+.bloglist-container {
+    display: flex;
     flex-wrap: wrap;
 }
-.bloglist-table-row:hover{
+.bloglist-table-row:hover {
     box-shadow: 10px 10px 0px var(--border-color);
 }
-.bloglist-links{
-    text-decoration:none;
+.bloglist-links {
+    text-decoration: none;
 }
-.bloglist-table-row-data{
-    padding:10px;
+.bloglist-table-row-data {
+    padding: 10px;
 }
-.bloglist-table-row-date{
-    font-size:12px;
+.bloglist-table-row-date {
+    font-size: 12px;
 }
-@media only screen and (max-width:600px) {
-    .bloglist-table-row{
-      width:100%;
+@media only screen and (max-width: 600px) {
+    .bloglist-table-row {
+        width: 100%;
     }
-  }
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/sass/parts/_home-banner.scss b/sass/parts/_home-banner.scss
index b40b37c..ac1f7bc 100644
--- a/sass/parts/_home-banner.scss
+++ b/sass/parts/_home-banner.scss
@@ -11,27 +11,32 @@
     width: 22%;
     overflow: hidden;
     border-radius: 10px;
+    text-align: center;
 }
 
 #home-banner-text {
     width: 78%;
-        margin-bottom: 30px;
-        font-size: 1.875rem;
-        line-height: 3rem;
-        color: var(--accent-color);
-    }
-    
-    #banner-home-subtitle {
-        width: 95%;
+    margin-bottom: 30px;
+    font-size: 1.875rem;
+    line-height: 3rem;
+    color: var(--accent-color);
+}
+
+#banner-home-subtitle {
+    width: 95%;
     padding-right: 5%;
     font-size: 1rem;
-        font-weight: 250;
-        line-height: 1.75rem;
-        color: var(--text-color);
+    font-weight: 250;
+    line-height: 1.75rem;
+    color: var(--text-color);
 }
+
 .banner-home-img {
     border-radius: 50%;
-    max-height: 80%;
+    max-width: 15rem;
+    max-height: 15rem;
+    width: 100%;
+    height: auto;
     border: none;
 }
 
@@ -41,13 +46,16 @@
         margin: 0 auto;
     }
 
+    .banner-home-img {
+        max-width: 12rem;
+        max-height: 12rem;
+    }
+
     .image-container-home {
         width: 95%;
-        height: 50vh;
     }
 
     #home-banner-text {
         width: 95%;
-
     }
 }
\ No newline at end of file