Minor css changes to docs page for a more responsive layout

aliofye · Jan 12, 2025 · 32f25ed · 32f25ed
1 parent b4ab24c
commit 32f25ed
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 10 deletions.
diff --git a/packages/web/src/global.css b/packages/web/src/global.css
@@ -183,12 +183,12 @@ input:focus {
     padding-right: 30vw;
     padding-left: 30vw;
   }
+}
 
-  /* Large Devices, Wide Screens */
-  @media only screen and (min-width: 1200px) {
-    .content {
-      padding-right: 30vw;
-      padding-left: 30vw;
-    }
+/* Large Devices, Wide Screens */
+@media only screen and (min-width: 1200px) {
+  .content {
+    padding-right: 30vw;
+    padding-left: 30vw;
   }
 }
diff --git a/packages/web/src/pages/Docs/Docs.module.css b/packages/web/src/pages/Docs/Docs.module.css
@@ -1,18 +1,16 @@
 .scrollContainer {
   overflow-x: hidden;
   display: flex;
-  flex-direction: column;
-  align-items: center;
+  flex-direction: row;
   justify-content: center;
 
   max-width: 100%;
 
   text-align: center;
 }
+
 .logoContainer {
   align-content: center;
-  width: 100vw;
-  height: 100vh;
   padding: 2em;
 }
 
@@ -78,6 +76,10 @@
 }
 
 @media screen and (max-width: 768px) {
+  .scrollContainer {
+    flex-direction: column;
+  }
+
   .docsContainer {
     width: 80vw;
   }