diff --git a/src/Components/Card/index.jsx b/src/Components/Card/index.jsx
new file mode 100644
index 0000000..eb46431
--- /dev/null
+++ b/src/Components/Card/index.jsx
@@ -0,0 +1,24 @@
+import './style.module.scss';
+
+
+
+
+const Card = () => {
+
+
+
+ return (
+ <>
+
+
+
+
Психология
+
Предстоящее
+
+
Интерактивная лекция «Управление инжиниринговыми проектами на базе вуза»
+
22 декабря, с 10:00 до 22:00 по Московскому времени
+
+ >
+ )
+}
+export default Card;
\ No newline at end of file
diff --git a/src/Components/Card/style.module.scss b/src/Components/Card/style.module.scss
new file mode 100644
index 0000000..78e51ed
--- /dev/null
+++ b/src/Components/Card/style.module.scss
@@ -0,0 +1,74 @@
+.event_card {
+ width: 292px;
+ height: 626px;
+ flex-shrink: 0;
+ margin-top: 100px;
+}
+
+.wrapp {
+ display: flex;
+ justify-content: flex-start;
+ /* max-width: 1521px; */
+}
+
+:root {
+ text-align: left;
+}
+
+.event-card_date {
+ color: var(--gray_text, #888);
+
+/* title */
+font-family: Montserrat;
+font-size: 22px;
+font-style: normal;
+font-weight: 400;
+line-height: normal;
+}
+
+.event-card__photo {
+ width: 292px;
+ height: 340px;
+ flex-shrink: 0;
+background: #D9D9D9;
+margin-bottom: 26px;
+}
+
+.event-card_title {
+ color: #000;
+
+ font-family: Montserrat;
+ font-size: 24px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+}
+.feautures {
+
+display: flex;
+justify-content: center;
+font-family: Montserrat;
+align-items: center;
+font-size: 8px;
+font-style: normal;
+font-weight: 400;
+line-height: normal;
+border-radius: 10px;
+background: #E7FFD2;
+height: 15px;
+padding: 10px;
+}
+
+.tagged {
+ display: inline-flex;
+padding: 10px;
+justify-content: center;
+align-items: center;
+gap: 10px;
+border-radius: 10px;
+border: 1px solid var(--gray_text, #888);
+}
+.taggs {
+ display: flex;
+ justify-content: space-between;
+}
\ No newline at end of file
diff --git a/src/Components/MeetPage/index.jsx b/src/Components/MeetPage/index.jsx
index 08a37b4..8d9ee36 100644
--- a/src/Components/MeetPage/index.jsx
+++ b/src/Components/MeetPage/index.jsx
@@ -2,6 +2,11 @@ import Header from "../Header";
import styles from './style.module.scss';
import clock from '../../img/MeetPage/Clock.png';
import globe from '../../img/MeetPage/Globe.png';
+import avatar from '../../img/MeetPage/avatar.png';
+import { style } from "@mui/system";
+import Card from "../Card";
+import Grid from '@mui/material/Grid';
+import Box from '@mui/material/Box';
const MeetPage = () => {
@@ -19,6 +24,48 @@ const MeetPage = () => {
+
+
+ Отзывы
+ Оставьте первый отзыв
+
+
+
+ О мероприятии
+ Известным спикером будут продемонстрированы основные механизмы психологического воздействия в политике, а также особенности восприятия общественно-политической информации. Слушатели смогут узнать, как следует противостоять манипулятивному воздействию, фейковой информации, а также порассуждать о том, возможно ли существование мира без обмана.
+
+
+ Специалист
+
+
+
+
Иванов Иван Иванович
+
Психолог, таролог
+
+7 (888) 888 - 88 - 88
+
exampl@ya.ru
+
+
+
+
+ Еще мероприятия
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
>
)
diff --git a/src/Components/MeetPage/style.module.scss b/src/Components/MeetPage/style.module.scss
index 8ec6ddd..bc1a9bf 100644
--- a/src/Components/MeetPage/style.module.scss
+++ b/src/Components/MeetPage/style.module.scss
@@ -1,12 +1,12 @@
.meets {
-
+ margin-top: 150px;
width: 100%;
display: flex;
justify-content: space-between;
&__img {
- width: 40%;
- height: 400px;
- background-color: gray;
+ width: 44%;
+ height: 300px;
+ background-color: #D9D9D9;
}
&__mainInfo {
&_container {
@@ -33,6 +33,12 @@
height: 35px;
justify-content: center;
align-items: center;
+ color: var(--gray_text, #888);
+ font-family: Montserrat;
+ font-size: 15px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
}
&_status {
margin-top: 40px;
@@ -45,8 +51,170 @@
display: flex;
}
&_status_img {
+ height: 26px;
+ width: 30px;
margin-right: 12px;
}
}
+ &__otziv {
+ position: relative;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 300px;
+ width: 44%;
+ border: 1px solid var(--gray_stroke, #D0D2D8);
+ margin-top: 50px;
+ color: #000;
+ font-family: Montserrat;
+ font-size: 14px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+ &_title {
+ color: #000;
+ font-family: Montserrat;
+ font-size: 25px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+ position: absolute;
+ left: 10px;
+ top: 4px;
+ }
+ &_container {
+ display: flex;
+ justify-content: flex-end;
+ }
+ }
+
+}
+.aboutMeet {
+ display: flex;
+ flex-direction: column;
+ &__title {
+ display: flex;
+ color: #000;
+ font-family: Montserrat;
+ font-size: 56px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+ }
+ &__descr {
+ margin-top: 60px;
+ display: flex;
+ text-align: left;
+ color: rgba(0, 0, 0, 0.90);
+ font-family: Inter;
+ font-size: 24px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: 110%; /* 27.6px */
+ }
+
+}
+.expert {
+
+ display: flex;
+ flex-direction: column;
+ margin-top: 200px;
+ &__title {
+ display: flex;
+ color: #000;
+ font-family: Montserrat;
+ font-size: 56px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+ }
+ &__img {
+ border-radius: 10000px;
+ }
+
+
+}
+.expert {
+
+
+ &__container {
+ margin-top: 60px;
+ display: flex;
+
+ }
+ &__img {
+ width: 200px;
+ height: 200px;
+ &_container {
+ margin-right: 50px;
+ }
+
+ }
+ &__descr {
+
+
+
+ &_container {
+ display: flex;
+ flex-direction: column;
+ text-align: left;
+
+ justify-content: center;
+ }
+ &_fullname {
+ color: #000;
+ font-family: Montserrat;
+ font-size: 36px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+ }
+ &_speciality {
+ color: #000;
+ font-family: Montserrat;
+ font-size: 32px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+ margin-top: 6px;
+ }
+ &_phone {
+ color: #000;
+ font-family: Montserrat;
+ font-size: 22px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+ margin-top: 16px;
+ }
+ &_email {
+ color: #2C41FF;
+ font-family: Montserrat;
+ font-size: 22px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+ margin-top: 16px;
+ }
+ }
+}
+.someMeetings {
+
+ display: flex;
+ flex-direction: column;
+ margin-top: 200px;
+ &__title {
+ display: flex;
+ color: #000;
+ font-family: Montserrat;
+ font-size: 56px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: normal;
+ }
+
+}
+.cards_container {
+ display: flex;
}
\ No newline at end of file
diff --git a/src/Components/css/style.module.css b/src/Components/css/style.module.css
index 6de163b..a62fc6c 100644
--- a/src/Components/css/style.module.css
+++ b/src/Components/css/style.module.css
@@ -1 +1 @@
-.meets{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.meets__img{width:40%;height:400px;background-color:gray}.meets__mainInfo_container{width:50%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:start;align-content:start}.meets__mainInfo_descr{color:#000;font-family:Montserrat;font-size:30px;font-style:normal;font-weight:600;line-height:normal;text-align:left}.meets__mainInfo_type{display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:25px;border-radius:10px;border:1px solid var(--gray_text, #888);width:110px;height:35px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.meets__mainInfo_status{margin-top:40px;display:-webkit-box;display:-ms-flexbox;display:flex}.meets__mainInfo_time{margin-top:40px;display:-webkit-box;display:-ms-flexbox;display:flex}.meets__mainInfo_status_img{margin-right:12px}/*# sourceMappingURL=style.module.css.map */
\ No newline at end of file
+.meets{margin-top:150px;width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.meets__img{width:44%;height:300px;background-color:#d9d9d9}.meets__mainInfo_container{width:50%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:start;align-content:start}.meets__mainInfo_descr{color:#000;font-family:Montserrat;font-size:30px;font-style:normal;font-weight:600;line-height:normal;text-align:left}.meets__mainInfo_type{display:-webkit-box;display:-ms-flexbox;display:flex;margin-top:25px;border-radius:10px;border:1px solid var(--gray_text, #888);width:110px;height:35px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--gray_text, #888);font-family:Montserrat;font-size:15px;font-style:normal;font-weight:400;line-height:normal}.meets__mainInfo_status{margin-top:40px;display:-webkit-box;display:-ms-flexbox;display:flex}.meets__mainInfo_time{margin-top:40px;display:-webkit-box;display:-ms-flexbox;display:flex}.meets__mainInfo_status_img{height:26px;width:30px;margin-right:12px}.meets__otziv{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:300px;width:44%;border:1px solid var(--gray_stroke, #D0D2D8);margin-top:50px;color:#000;font-family:Montserrat;font-size:14px;font-style:normal;font-weight:400;line-height:normal}.meets__otziv_title{color:#000;font-family:Montserrat;font-size:25px;font-style:normal;font-weight:400;line-height:normal;position:absolute;left:10px;top:4px}.meets__otziv_container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end}.aboutMeet{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.aboutMeet__title{display:-webkit-box;display:-ms-flexbox;display:flex;color:#000;font-family:Montserrat;font-size:56px;font-style:normal;font-weight:400;line-height:normal}.aboutMeet__descr{margin-top:60px;display:-webkit-box;display:-ms-flexbox;display:flex;text-align:left;color:rgba(0,0,0,.9);font-family:Inter;font-size:24px;font-style:normal;font-weight:400;line-height:110%}.expert{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-top:200px}.expert__title{display:-webkit-box;display:-ms-flexbox;display:flex;color:#000;font-family:Montserrat;font-size:56px;font-style:normal;font-weight:400;line-height:normal}.expert__img{border-radius:10000px}.expert__container{margin-top:60px;display:-webkit-box;display:-ms-flexbox;display:flex}.expert__img{width:200px;height:200px}.expert__img_container{margin-right:50px}.expert__descr_container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;text-align:left;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.expert__descr_fullname{color:#000;font-family:Montserrat;font-size:36px;font-style:normal;font-weight:400;line-height:normal}.expert__descr_speciality{color:#000;font-family:Montserrat;font-size:32px;font-style:normal;font-weight:400;line-height:normal;margin-top:6px}.expert__descr_phone{color:#000;font-family:Montserrat;font-size:22px;font-style:normal;font-weight:400;line-height:normal;margin-top:16px}.expert__descr_email{color:#2c41ff;font-family:Montserrat;font-size:22px;font-style:normal;font-weight:400;line-height:normal;margin-top:16px}.someMeetings{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-top:200px}.someMeetings__title{display:-webkit-box;display:-ms-flexbox;display:flex;color:#000;font-family:Montserrat;font-size:56px;font-style:normal;font-weight:400;line-height:normal}.cards_container{display:-webkit-box;display:-ms-flexbox;display:flex}/*# sourceMappingURL=style.module.css.map */
\ No newline at end of file
diff --git a/src/Components/css/style.module.css.map b/src/Components/css/style.module.css.map
index 8890c5e..8b91c79 100644
--- a/src/Components/css/style.module.css.map
+++ b/src/Components/css/style.module.css.map
@@ -1 +1 @@
-{"version":3,"sources":["../MeetPage/style.module.scss"],"names":[],"mappings":"AAAA,OAEI,UAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,6BAAA,CACA,YACI,SAAA,CACA,YAAA,CACA,qBAAA,CAGA,2BACI,SAAA,CACA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,2BAAA,CAAA,4BAAA,CAAA,yBAAA,CAAA,qBAAA,CACA,wBAAA,CAAA,mBAAA,CAEJ,uBACI,UAAA,CACA,sBAAA,CACA,cAAA,CACA,iBAAA,CACA,eAAA,CACA,kBAAA,CACA,eAAA,CAEJ,sBACI,mBAAA,CAAA,mBAAA,CAAA,YAAA,CACA,eAAA,CACA,kBAAA,CACA,uCAAA,CACA,WAAA,CACA,WAAA,CACA,uBAAA,CAAA,oBAAA,CAAA,sBAAA,CACA,wBAAA,CAAA,qBAAA,CAAA,kBAAA,CAEJ,wBACI,eAAA,CAEA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CAEJ,sBACI,eAAA,CAEA,mBAAA,CAAA,mBAAA,CAAA,YAAA,CAEJ,4BACI,iBAAA","file":"style.module.css"}
\ No newline at end of file
+{"version":3,"sources":["../MeetPage/style.module.scss"],"names":[],"mappings":"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","file":"style.module.css"}
\ No newline at end of file
diff --git a/src/components/Home/Home.jsx b/src/components/Home/Home.jsx
index 625456b..c1a6797 100644
--- a/src/components/Home/Home.jsx
+++ b/src/components/Home/Home.jsx
@@ -2,54 +2,36 @@ import React from 'react';
// import Header from '../Header';
import './style.css'
import styled from 'styled-components';
+import Grid from '@mui/material/Grid';
+import Card from '../Card';
+import Box from '@mui/material/Box';
-const Taged = styled.div({
- borderRadius: 10,
- backgroundColor: 'gray',
-
-})
+
const Home = () => {
return (
-
- {/*
*/}
-
-
-
-
Психология
-
Предстоящее
-
-
Интерактивная лекция «Управление инжиниринговыми проектами на базе вуза»
-
22 декабря, с 10:00 до 22:00 по Московскому времени
-
-
-
-
-
Психология
-
Предстоящее
-
-
Интерактивная лекция «Управление инжиниринговыми проектами на базе вуза»
-
22 декабря, с 10:00 до 22:00 по Московскому времени
-
-
-
-
-
Психология
-
Предстоящее
-
-
Интерактивная лекция «Управление инжиниринговыми проектами на базе вуза»
-
22 декабря, с 10:00 до 22:00 по Московскому времени
-
-
-
-
-
Психология
-
Предстоящее
-
-
Интерактивная лекция «Управление инжиниринговыми проектами на базе вуза»
-
22 декабря, с 10:00 до 22:00 по Московскому времени
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
);
}
diff --git a/src/components/Home/style.css b/src/components/Home/style.css
index abe2b11..dcc6912 100644
--- a/src/components/Home/style.css
+++ b/src/components/Home/style.css
@@ -3,7 +3,7 @@
height: 626px;
flex-shrink: 0;
margin-top: 100px;
- margin-right: 31px;
+ margin-left: 50px;
}
.wrapp {
diff --git a/src/img/MeetPage/avatar.png b/src/img/MeetPage/avatar.png
new file mode 100644
index 0000000..ee01eb9
Binary files /dev/null and b/src/img/MeetPage/avatar.png differ