input
This commit is contained in:
parent
e0afab1420
commit
51e740fba6
@ -28,7 +28,28 @@ const HomePage = () => {
|
|||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Header></Header>
|
<Header></Header>
|
||||||
<TableMeets events={ events } />
|
<section className={styles.muza__container}>
|
||||||
|
<div className={styles.muza__title}>МУЗА</div>
|
||||||
|
<div className={styles.muza__descr_container}>
|
||||||
|
<div className={styles.muza__descr}>Платформа для проведения well-being мероприятий</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
<section className={styles.meeting__container}>
|
||||||
|
<input className={styles.meeting__inputs} placeholder="Найти мероприятие"></input>
|
||||||
|
<div className={styles.container}>
|
||||||
|
<div className={styles.select__container}>
|
||||||
|
<select className={styles.select} name="time__meeting">
|
||||||
|
<option value="">Время мироприятия</option>
|
||||||
|
</select>
|
||||||
|
<select className={styles.select} name="type__meeting">
|
||||||
|
<option value="">Тип мероприятия</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
</>
|
</>
|
||||||
|
|
||||||
|
@ -1,6 +1,74 @@
|
|||||||
|
|
||||||
|
|
||||||
.title {
|
|
||||||
font-size: 100px;
|
.muza {
|
||||||
|
&__container {
|
||||||
|
height: 700px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__title {
|
||||||
|
margin-top: 150px;
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 143.016px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 700;
|
||||||
|
line-height: normal;
|
||||||
|
text-align: left;
|
||||||
|
display: flex;
|
||||||
|
width: 90%;
|
||||||
|
|
||||||
|
}
|
||||||
|
&__descr {
|
||||||
|
&_container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
margin-top: 50px;
|
||||||
|
margin-left: 70px;
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 46px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
text-align: left;
|
||||||
|
display: flex;
|
||||||
|
width: 60%;
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
.meeting {
|
||||||
|
&__container {
|
||||||
|
height: 1400px;
|
||||||
|
}
|
||||||
|
&__inputs {
|
||||||
|
width: 90%;
|
||||||
|
height: 46px;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid #000;
|
||||||
|
padding-left: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
|
||||||
|
}
|
||||||
|
.select {
|
||||||
|
margin-right: 50px;
|
||||||
|
height: 35px;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid var(--gray_stroke, #D0D2D8);
|
||||||
|
width: 200px;
|
||||||
|
&__container {
|
||||||
|
display: flex;
|
||||||
|
width: 93%;
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
}
|
@ -1,7 +1,7 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import styles from './style.module.scss';
|
import styles from './style.module.scss';
|
||||||
import logo from '../../img/homePage/downArrow.png';
|
import arrow from '../../img/homePage/downArrow.png';
|
||||||
import { style } from '@mui/system';
|
|
||||||
const TableMeets = ({ events }) => {
|
const TableMeets = ({ events }) => {
|
||||||
const [isOpenMap, setIsOpenMap] = useState({});
|
const [isOpenMap, setIsOpenMap] = useState({});
|
||||||
|
|
||||||
@ -21,7 +21,7 @@ const TableMeets = ({ events }) => {
|
|||||||
<span className={styles.date}>{event.date}</span>
|
<span className={styles.date}>{event.date}</span>
|
||||||
<span className={styles.time}>{event.time}</span>
|
<span className={styles.time}>{event.time}</span>
|
||||||
<span className={styles.title}>{event.title}</span>
|
<span className={styles.title}>{event.title}</span>
|
||||||
<div className={styles.meeting__button} onClick={() => toggleDropdown(event.id)}><img src={logo} ></img></div>
|
<div className={styles.meeting__button} onClick={() => toggleDropdown(event.id)}><img className={styles.meeting__arrow} src={arrow} ></img></div>
|
||||||
{isOpenMap[event.id] && (
|
{isOpenMap[event.id] && (
|
||||||
<div>
|
<div>
|
||||||
<span>{event.speaker}</span>
|
<span>{event.speaker}</span>
|
||||||
|
@ -0,0 +1,16 @@
|
|||||||
|
.meeting {
|
||||||
|
&__cards {
|
||||||
|
list-style-type: none;
|
||||||
|
width: 80%;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
&__container {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
&__arrow {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
1
src/Components/css/style.module.css
Normal file
1
src/Components/css/style.module.css
Normal file
@ -0,0 +1 @@
|
|||||||
|
.muza__container{height:700px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;width:100%}.muza__title{margin-top:150px;color:#000;font-family:Montserrat;font-size:143.016px;font-style:normal;font-weight:700;line-height:normal;text-align:left;display:-webkit-box;display:-ms-flexbox;display:flex;width:90%}.muza__descr{margin-top:50px;margin-left:70px;color:#000;font-family:Montserrat;font-size:46px;font-style:normal;font-weight:400;line-height:normal;text-align:left;display:-webkit-box;display:-ms-flexbox;display:flex;width:60%}.muza__descr_container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.meeting__container{height:1400px}.meeting__inputs{width:90%;height:46px;border-radius:10px;border:1px solid #000;padding-left:40px}.container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.select{margin-right:50px;height:35px;border-radius:10px;border:1px solid var(--gray_stroke, #D0D2D8);width:200px}.select__container{display:-webkit-box;display:-ms-flexbox;display:flex;width:93%;margin-top:30px}/*# sourceMappingURL=style.module.css.map */
|
1
src/Components/css/style.module.css.map
Normal file
1
src/Components/css/style.module.css.map
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"sources":["../HomePage/style.module.scss"],"names":[],"mappings":"AAII,iBACI,YAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,kBAAA,CACA,2BAAA,CAAA,4BAAA,CAAA,yBAAA,CAAA,qBAAA,CACA,UAAA,CAGJ,aACI,gBAAA,CACA,UAAA,CACA,sBAAA,CACA,mBAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,eAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,SAAA,CAGJ,aAKI,eAAA,CACA,gBAAA,CACA,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,eAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,SAAA,CAdA,uBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,oBAAA,CAAA,iBAAA,CAAA,wBAAA,CAiBT,oBACC,aAAA,CAED,iBACK,SAAA,CACA,WAAA,CACA,kBAAA,CACA,qBAAA,CACA,iBAAA,CAIR,WACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,uBAAA,CAAA,oBAAA,CAAA,sBAAA,CAGJ,QACI,iBAAA,CACA,WAAA,CACA,kBAAA,CACA,4CAAA,CACA,WAAA,CACA,mBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,SAAA,CACA,eAAA","file":"style.module.css"}
|
Loading…
x
Reference in New Issue
Block a user