add lesson-52

parent ce16a05d
import './GuestForm.scss'
const GuestForm = () => {
return (
<form className='GuestForm'>
<input/>
</form>
)
}
export default GuestForm
\ No newline at end of file
.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
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
...@@ -3,6 +3,22 @@ ...@@ -3,6 +3,22 @@
height: 100vh; height: 100vh;
width: 100vw; width: 100vw;
display: flex; display: flex;
justify-content: space-evenly; flex-direction: column;
justify-content: center;
align-items: 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
import {useState} from "react" import {useState} from "react"
import List from "../components/List/List" import List from "../components/List/List"
import SendBtn from "../components/SendBtn/SendBtn"
import GuestForm from "../components/GuestForm/GuestForm"
import './App.scss' import './App.scss'
function App() { function App() {
...@@ -8,6 +10,7 @@ function App() { ...@@ -8,6 +10,7 @@ function App() {
return ( return (
<div className="App"> <div className="App">
<div className="Lists">
<List <List
title="Список основных гостей" title="Список основных гостей"
list={guestList} list={guestList}
...@@ -17,6 +20,12 @@ function App() { ...@@ -17,6 +20,12 @@ function App() {
list={inComeList} list={inComeList}
/> />
</div> </div>
<div className="Controllers">
<GuestForm/>
<SendBtn onClick={() => {}}/>
</div>
</div>
) )
} }
......
...@@ -5,10 +5,4 @@ ...@@ -5,10 +5,4 @@
::-webkit-scrollbar { ::-webkit-scrollbar {
display: none; display: none;
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment