From 524c8eb7dee3efa63472d1901dd0f0cd70b69295 Mon Sep 17 00:00:00 2001
From: Damian <damiansuaz@gmail.com>
Date: Thu, 1 Feb 2024 16:41:32 -0500
Subject: [PATCH] Update media query

wrapper, menu, center orientation and mobile width
---
 docs/index.css | 36 ++++++++++++++++++++++++++++--------
 1 file changed, 28 insertions(+), 8 deletions(-)

diff --git a/docs/index.css b/docs/index.css
index d87a5ae..354c621 100644
--- a/docs/index.css
+++ b/docs/index.css
@@ -1,17 +1,24 @@
 :root {
-  --border-img: rgba(120, 120, 120, .6);
+  --border-img: rgba(120, 120, 120, .6); }
 body {
 }
 header {
 }
 h1 {
-  text-align: center; }
-main {
+  text-align: center; 
 }
+.wrapper {
+    display: grid; }
+menu {  
+  list-style: none;
+  margin: 0;
+  padding: 0; }    
+main { }
 p {
   margin-inline: 2.5%; }
 .p-center {
-  text-align: center; }
+  text-align: center; 
+}
 footer {
   height: 10%;
   background: red;
@@ -19,7 +26,6 @@ footer {
 .center {
   width: fit-content;
   margin: 3em auto; }
-
 .center img {
   border: 2px solid var(--border-img);
   padding: 2em; }
@@ -27,7 +33,21 @@ footer {
   text-decoration: underline;
   font-weight: 600;}
 @media (orientation: landscape) {
-  body {
-    max-width: 80%;
-    margin-inline: 10%;}
+  .wrapper {
+    grid-template-columns: 20% 1fr;
+    grid-gap: 3rem;
+  }
+  menu {
+    border: 2px solid silver;
+    height: fit-content;
+    display: grid;
+    place-items: center;
   }
+  nav {  }
+}
+@media (width < 38rem) {
+    .center {
+    display: grid;
+    grid-gap: 1rem;
+  }
+}