add second page

src/components/Auth/Auth.js

@@ -1,10 +1,15 @@
 import React from 'react';
 import style from './Auth.module.scss';
 
-const Auth = () => {
+const Auth = ({ setAuthed }) => {
   return (
     <div className={style.auth}>
-      <h2>THIS IS AUTH!!!</h2>
+      <div className={style.auth__container}>
+        <img src="https://www.google.com/gmail/about/static/images/logo-gmail.png?cache=1adba63" alt="" />
+        <button className={style.auth__btn} onClick={() => setAuthed(true)}>
+          Log in
+        </button>
+      </div>
     </div>
   );
 };

src/components/Auth/Auth.module.scss

@@ -1,7 +1,25 @@
 .auth {
-  & h2 {
-    font-size: 5em;
-    color: red;
-    text-align: center;
+  display: grid;
+  place-items: center;
+  height: 100vh;
+  background-color: #f2f2f2;
+
+  &__container {
+    display: flex;
+    flex-direction: column;
+  }
+
+  &__container > img {
+    object-fit: contain;
+    height: 200px;
+  }
+
+  &__btn {
+    width: 180px;
+    height: 40px;
+    border: 2px solid gray;
+    border-radius: 100px;
+    font-size: 1.6em;
+    margin: 0 auto;
   }
 }

src/components/Select/Select.module.scss

@@ -38,7 +38,17 @@
     display: none;
   }
 
+  [class$='-control'] {
+    border-color: #e8e8e8 !important;
+    box-shadow: 0 0 0 1px #e8e8e8;
+  }
+
   [class$='-value'] {
-    font-size: 1.4em;
+    font-size: 1.6em;
+  }
+
+  [class$='-option'] {
+    font-size: 1.6em;
+    color: gray;
   }
 }