From 3203a0d133942f78972cb7c7e55891bd6e11a0c3 Mon Sep 17 00:00:00 2001
From: mahcodes <mhmdali102@bk.ru>
Date: Tue, 7 May 2024 14:32:58 +0300
Subject: [PATCH] fix: left align logo and text on small screens

---
 styles/main.css | 52 +++++++++++++++++++++++++++----------------------
 1 file changed, 29 insertions(+), 23 deletions(-)

diff --git a/styles/main.css b/styles/main.css
index a60e9563..1421c2c2 100644
--- a/styles/main.css
+++ b/styles/main.css
@@ -843,29 +843,6 @@ main.content {
   color: var(--color-charcoal);
 }
 
-/* Same as --width-content */
-@media (max-width: 960px) {
-  .wide-only {
-    display: none;
-  }
-
-  .navbar .content {
-    flex-direction: column;
-    justify-content: center;
-  }
-
-  .navbar .content > *:first-child {
-    margin-bottom: var(--gap-2);
-  }
-
-  .hero {
-    padding-top: 0;
-  }
-  .community-socials {
-    flex-direction: column;
-  }
-}
-
 .community-socials {
   padding-top: 2rem;
   list-style-type: none;
@@ -901,3 +878,32 @@ main.content {
   padding: 0.35rem;
   transition: transform ease-in-out 150ms;
 }
+
+/* Same as --width-content */
+@media (max-width: 960px) {
+  .wide-only {
+    display: none;
+  }
+
+  .navbar .content {
+    flex-direction: column;
+    justify-content: center;
+  }
+
+  .navbar .content > *:first-child {
+    margin-bottom: var(--gap-2);
+  }
+
+  .hero {
+    padding-top: 0;
+  }
+
+  .community-socials {
+    flex-direction: column;
+    align-items: start;
+  }
+
+  .community-socials a {
+    flex-direction: row;
+  }
+}