From 04583743dd279a009dbb4afd4c6e743b9fbb02cf Mon Sep 17 00:00:00 2001
From: madarsbiss <madars.biss@gmail.com>
Date: Wed, 21 Jul 2021 13:12:39 +0300
Subject: [PATCH] add resp layout

---
 pages/index.js         |  2 +-
 styles/Home.module.css | 10 ++++++++--
 styles/globals.css     | 11 ++++++-----
 3 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/pages/index.js b/pages/index.js
index a6ab545..a4d33cb 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -11,7 +11,7 @@ export default function Home() {
     const res = await fetch("/api/data", {
       method: "POST",
       headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ input, systemUsed }),
+      body: JSON.stringify({ input }),
     });
     const data = await res.json();
 
diff --git a/styles/Home.module.css b/styles/Home.module.css
index 1d7c6dc..aea86bc 100644
--- a/styles/Home.module.css
+++ b/styles/Home.module.css
@@ -1,6 +1,5 @@
 .wrapper {
   max-width: 1200px;
-  /* margin: 0px auto; */
   text-align: center;
   background: rgba(255, 255, 255, 0.95);
   box-shadow: 0 8px 32px 0 rgba(83, 89, 179, 0.37);
@@ -9,6 +8,7 @@
   border-radius: 30px;
   display: grid;
   grid-template-columns: 1fr 2fr;
+  margin: 0 20px;
 }
 
 .weatherWrapper {
@@ -63,7 +63,6 @@
 .searchInput {
   margin-bottom: 20px;
   height: 40px;
-  /* border: 2px solid rgb(34, 34, 34); */
   border: none;
   padding: 0 10px;
   color: #303030;
@@ -73,3 +72,10 @@
   font-family: "Varela Round", sans-serif;
   font-size: 18px;
 }
+
+@media only screen and (max-width: 950px) {
+  .wrapper {
+    display: grid;
+    grid-template-columns: 1fr;
+  }
+}
diff --git a/styles/globals.css b/styles/globals.css
index de15f9b..92effd2 100644
--- a/styles/globals.css
+++ b/styles/globals.css
@@ -8,8 +8,6 @@
 
 html,
 body {
-  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
-    Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
   background-image: radial-gradient(
     circle 993px at 0.5% 50.5%,
     rgba(137, 171, 245, 0.37) 0%,
@@ -23,7 +21,10 @@ body {
   align-items: center;
 }
 
-a {
-  color: inherit;
-  text-decoration: none;
+@media only screen and (max-width: 950px) {
+  html,
+  body {
+    min-height: 100vh;
+    display: block;
+  }
 }