add lesson-52

src/components/GuestForm/GuestForm.tsx

+import './GuestForm.scss'
+
+const GuestForm = () => {
+  return (
+    <form className='GuestForm'>
+        <input/>
+    </form>
+  )
+}
+
+export default GuestForm
\ No newline at end of file

src/components/SendBtn/SendBtn.scss

+.SendBtn {
+    background-color: antiquewhite;
+    border: none;
+    border-radius: 10px;
+    height: 35px;
+    width: 150px;
+    color: rgb(168, 75, 75);
+    cursor: pointer;
+    transition: 1s;
+
+    &:hover {
+        width: 160px;
+        height: 38px;
+        transition: 1s;
+        font-size: 18px;
+    }
+}
\ No newline at end of file

src/components/SendBtn/SendBtn.tsx

+import './SendBtn.scss'
+
+type TProps = {
+    onClick: VoidFunction
+}
+
+const SendBtn = ({onClick}: TProps) => {
+  return (
+    <button className='SendBtn' onClick={onClick}>
+        Позвать гостей
+    </button>
+  )
+}
+
+export default SendBtn
\ No newline at end of file

src/containers/App.scss

@@ -3,6 +3,22 @@
     height: 100vh;
     width: 100vw;
     display: flex;
-    justify-content: space-evenly;
+    flex-direction: column;
+    justify-content: center;
     align-items: center;
+
+    & .Lists {
+        width: 90%;
+        height: 80%;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+    }
+
+    & .Controllers {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        width: 90%;
+    }
 }
\ No newline at end of file

src/containers/App.tsx

 import {useState} from "react"
 import List from "../components/List/List"
+import SendBtn from "../components/SendBtn/SendBtn"
+import GuestForm from "../components/GuestForm/GuestForm"
 import './App.scss'
 
 function App() {
@@ -8,14 +10,21 @@ function App() {
 
   return (
     <div className="App">
-      <List 
-        title="Список основных гостей"
-        list={guestList}
-      />
-      <List 
-        title="Список приглашенных гостей"
-        list={inComeList}  
-      />
+      <div className="Lists">
+        <List 
+          title="Список основных гостей"
+          list={guestList}
+        />
+        <List 
+          title="Список приглашенных гостей"
+          list={inComeList}  
+        />
+      </div>
+
+      <div className="Controllers">
+        <GuestForm/>
+        <SendBtn onClick={() => {}}/>
+      </div>
     </div>
   )
 }

src/index.scss

@@ -5,10 +5,4 @@
 
 ::-webkit-scrollbar {
     display: none;
-
-
-
-
-
-    
 }
\ No newline at end of file