commit
This commit is contained in:
Vsevo;od
parent
a08d4d3cdf
commit
d344619507
72
package-lock.json
generated
72
package-lock.json
generated
@ -14,7 +14,9 @@
|
|||||||
"@mui/icons-material": "^5.15.1",
|
"@mui/icons-material": "^5.15.1",
|
||||||
"@mui/material": "^5.15.1",
|
"@mui/material": "^5.15.1",
|
||||||
"@mui/styled-engine-sc": "^6.0.0-alpha.9",
|
"@mui/styled-engine-sc": "^6.0.0-alpha.9",
|
||||||
|
"@mui/x-date-pickers": "^6.18.6",
|
||||||
"axios": "^1.6.2",
|
"axios": "^1.6.2",
|
||||||
|
"dayjs": "^1.11.10",
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
"react-router-dom": "^6.21.1",
|
"react-router-dom": "^6.21.1",
|
||||||
@ -1370,6 +1372,71 @@
|
|||||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
|
||||||
"integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
|
"integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w=="
|
||||||
},
|
},
|
||||||
|
"node_modules/@mui/x-date-pickers": {
|
||||||
|
"version": "6.18.6",
|
||||||
|
"resolved": "https://registry.npmjs.org/@mui/x-date-pickers/-/x-date-pickers-6.18.6.tgz",
|
||||||
|
"integrity": "sha512-pqOrGPUDVY/1xXrM1hofqwgquno/SB9aG9CVS1m2Rs8hKF1VWRC+jYlEa1Qk08xKmvkia5g7NsdV/BBb+tHUZw==",
|
||||||
|
"dependencies": {
|
||||||
|
"@babel/runtime": "^7.23.2",
|
||||||
|
"@mui/base": "^5.0.0-beta.22",
|
||||||
|
"@mui/utils": "^5.14.16",
|
||||||
|
"@types/react-transition-group": "^4.4.8",
|
||||||
|
"clsx": "^2.0.0",
|
||||||
|
"prop-types": "^15.8.1",
|
||||||
|
"react-transition-group": "^4.4.5"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=14.0.0"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"type": "opencollective",
|
||||||
|
"url": "https://opencollective.com/mui"
|
||||||
|
},
|
||||||
|
"peerDependencies": {
|
||||||
|
"@emotion/react": "^11.9.0",
|
||||||
|
"@emotion/styled": "^11.8.1",
|
||||||
|
"@mui/material": "^5.8.6",
|
||||||
|
"@mui/system": "^5.8.0",
|
||||||
|
"date-fns": "^2.25.0",
|
||||||
|
"date-fns-jalali": "^2.13.0-0",
|
||||||
|
"dayjs": "^1.10.7",
|
||||||
|
"luxon": "^3.0.2",
|
||||||
|
"moment": "^2.29.4",
|
||||||
|
"moment-hijri": "^2.1.2",
|
||||||
|
"moment-jalaali": "^0.7.4 || ^0.8.0 || ^0.9.0 || ^0.10.0",
|
||||||
|
"react": "^17.0.0 || ^18.0.0",
|
||||||
|
"react-dom": "^17.0.0 || ^18.0.0"
|
||||||
|
},
|
||||||
|
"peerDependenciesMeta": {
|
||||||
|
"@emotion/react": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"@emotion/styled": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"date-fns": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"date-fns-jalali": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"dayjs": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"luxon": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"moment": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"moment-hijri": {
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"moment-jalaali": {
|
||||||
|
"optional": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"node_modules/@nodelib/fs.scandir": {
|
"node_modules/@nodelib/fs.scandir": {
|
||||||
"version": "2.1.5",
|
"version": "2.1.5",
|
||||||
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
|
"resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
|
||||||
@ -2210,6 +2277,11 @@
|
|||||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
|
||||||
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
|
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
|
||||||
},
|
},
|
||||||
|
"node_modules/dayjs": {
|
||||||
|
"version": "1.11.10",
|
||||||
|
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.10.tgz",
|
||||||
|
"integrity": "sha512-vjAczensTgRcqDERK0SR2XMwsF/tSvnvlv6VcF2GIhg6Sx4yOIt/irsr1RDJsKiIyBzJDpCoXiWWq28MqH2cnQ=="
|
||||||
|
},
|
||||||
"node_modules/debug": {
|
"node_modules/debug": {
|
||||||
"version": "4.3.4",
|
"version": "4.3.4",
|
||||||
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
|
"resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
|
||||||
|
|||||||
@ -16,7 +16,9 @@
|
|||||||
"@mui/icons-material": "^5.15.1",
|
"@mui/icons-material": "^5.15.1",
|
||||||
"@mui/material": "^5.15.1",
|
"@mui/material": "^5.15.1",
|
||||||
"@mui/styled-engine-sc": "^6.0.0-alpha.9",
|
"@mui/styled-engine-sc": "^6.0.0-alpha.9",
|
||||||
|
"@mui/x-date-pickers": "^6.18.6",
|
||||||
"axios": "^1.6.2",
|
"axios": "^1.6.2",
|
||||||
|
"dayjs": "^1.11.10",
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.2.0",
|
"react-dom": "^18.2.0",
|
||||||
"react-router-dom": "^6.21.1",
|
"react-router-dom": "^6.21.1",
|
||||||
|
|||||||
@ -6,12 +6,12 @@ import './App.css'
|
|||||||
// import FetchUtils from './components/fetchUtils/FetchUtils.jsx'
|
// import FetchUtils from './components/fetchUtils/FetchUtils.jsx'
|
||||||
|
|
||||||
// import TableMeets from './components/fetchUtils/TableMeets.jsx'
|
// import TableMeets from './components/fetchUtils/TableMeets.jsx'
|
||||||
|
import AddUsers from './Components/AddUsersPage/index.jsx'
|
||||||
import { BrowserRouter, Routes, Route } from "react-router-dom";
|
import { BrowserRouter, Routes, Route } from "react-router-dom";
|
||||||
import BeingPage from "./Components/BeingPage/index.jsx";
|
|
||||||
import HomePage from "./Components/HomePage/index.jsx";
|
import HomePage from "./Components/HomePage/index.jsx";
|
||||||
import MeetPage from "./Components/MeetPage/index.jsx";
|
import MeetPage from "./Components/MeetPage/index.jsx";
|
||||||
import MeetAuthPage from "./Components/MeetAuthPage/index.jsx";
|
import MeetAuthPage from "./Components/MeetAuthPage/index.jsx";
|
||||||
|
import ProfilePage from './Components/profilePage/index.jsx';
|
||||||
|
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
@ -22,10 +22,11 @@ function App() {
|
|||||||
|
|
||||||
<BrowserRouter>
|
<BrowserRouter>
|
||||||
<Routes>
|
<Routes>
|
||||||
<Route path="/being" element={<BeingPage />}/>
|
<Route path="/addUser" element={<AddUsers />}/>
|
||||||
<Route path="/" element={<HomePage />}/>
|
<Route path="/" element={<HomePage />}/>
|
||||||
<Route path="/firstMeet" element={<MeetPage />}/>
|
<Route path="/firstMeet" element={<MeetPage />}/>
|
||||||
<Route path="/firstMeetAuth" element={<MeetAuthPage />}/>
|
<Route path="/firstMeetAuth" element={<MeetAuthPage />}/>
|
||||||
|
<Route path='/profile' element={<ProfilePage />}/>
|
||||||
</Routes>
|
</Routes>
|
||||||
</BrowserRouter>
|
</BrowserRouter>
|
||||||
</>
|
</>
|
||||||
|
|||||||
52
src/Components/AddUsersPage/index.jsx
Normal file
52
src/Components/AddUsersPage/index.jsx
Normal file
@ -0,0 +1,52 @@
|
|||||||
|
import styles from './style.module.scss';
|
||||||
|
import avatar from '../../img/profilePage/avatar.png';
|
||||||
|
import Header from '../Header';
|
||||||
|
|
||||||
|
const AddUsers = () => {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Header></Header>
|
||||||
|
|
||||||
|
|
||||||
|
<section className={styles.addUsers__container}>
|
||||||
|
<input className={styles.addUsers__search} type='text' placeholder='Найти мероприятие'></input>
|
||||||
|
<div className={styles.select__container}>
|
||||||
|
<select className={styles.select} name="time__meeting">
|
||||||
|
<option value="">роль пользователя</option>
|
||||||
|
</select>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div className={styles.addUser__container}>
|
||||||
|
<div className={styles.addUser__cards_container}>
|
||||||
|
<div className={styles.addUser__card_container}>
|
||||||
|
<div className={styles.round}>+</div>
|
||||||
|
<div className={styles.addUser__card_text}>Добавить пользователя</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.profile__user_container}>
|
||||||
|
<div className={styles.profile__user_img_container}>
|
||||||
|
<img src={avatar} className={styles.profile__user_img}></img>
|
||||||
|
<div className={styles.profile__user_role}>Участник</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.profile__user_info_container}>
|
||||||
|
<div className={styles.profile__user_fullName}><span>К</span>ирсанов Дмитрий </div>
|
||||||
|
<div className={styles.profile__user_spaciality}>Junior PHP разработчик</div>
|
||||||
|
<div className={styles.profile__user_socialMedia}>TG: @dkir</div>
|
||||||
|
<div className={styles.profile__user_email}>gmail@gmail.com</div>
|
||||||
|
<div className={styles.profile__user_progress_container}>
|
||||||
|
<span>0</span>
|
||||||
|
<span className={styles.profile__user_progress_line}></span>
|
||||||
|
<span>1</span>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</>
|
||||||
|
|
||||||
|
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default AddUsers;
|
||||||
171
src/Components/AddUsersPage/style.module.scss
Normal file
171
src/Components/AddUsersPage/style.module.scss
Normal file
@ -0,0 +1,171 @@
|
|||||||
|
.select {
|
||||||
|
margin-right: 50px;
|
||||||
|
height: 35px;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid var(--gray_stroke, #D0D2D8);
|
||||||
|
width: 200px;
|
||||||
|
padding-left: 10px;
|
||||||
|
option {
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
&__container {
|
||||||
|
display: flex;
|
||||||
|
width: 93%;
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.addUsers {
|
||||||
|
|
||||||
|
|
||||||
|
&__search {
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid var(--gray_stroke, #D0D2D8);
|
||||||
|
height: 70px;
|
||||||
|
width: 100%;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 22px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
padding-left: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.profile {
|
||||||
|
&__container {
|
||||||
|
margin-top: 200px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
}
|
||||||
|
&__user {
|
||||||
|
&_img {
|
||||||
|
&_container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-right: 50px;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&_container {
|
||||||
|
display: flex;
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
&_info_container {
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 20px;
|
||||||
|
display: flex;
|
||||||
|
text-align: left;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
&_fullName {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 36px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: normal;
|
||||||
|
span {
|
||||||
|
color: #FD0;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
&_spaciality {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 32px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
margin-top: 25px;
|
||||||
|
}
|
||||||
|
&_socialMedia {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 20px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
margin-top: 25px;
|
||||||
|
}
|
||||||
|
&_email {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 20px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
margin-top: 25px;
|
||||||
|
}
|
||||||
|
&_role {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 24px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: normal;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
&_progress {
|
||||||
|
&_container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
&_line {
|
||||||
|
height: 2px;
|
||||||
|
width: 140%;
|
||||||
|
background: linear-gradient(90deg, #ffdd00,#d0d2d8);
|
||||||
|
padding: 0 30px 0 30px;
|
||||||
|
margin: 0 10px 0 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.addUser {
|
||||||
|
|
||||||
|
|
||||||
|
&__cards_container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 120px;
|
||||||
|
}
|
||||||
|
&__card {
|
||||||
|
|
||||||
|
|
||||||
|
&_container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 48%;
|
||||||
|
border-radius: 10px;
|
||||||
|
border: 1px solid var(--gray_stroke, #D0D2D8);
|
||||||
|
}
|
||||||
|
&_text {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 24px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
margin-top: 34px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.round {
|
||||||
|
border-radius: 80%;
|
||||||
|
height: 50px;
|
||||||
|
border: 1px solid var(--yellow, #FD0);
|
||||||
|
background: var(--yellow, #FD0);
|
||||||
|
width: 50px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 36px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
}
|
||||||
1
src/Components/BeingPage/style.module.css
Normal file
1
src/Components/BeingPage/style.module.css
Normal file
@ -0,0 +1 @@
|
|||||||
|
/*# sourceMappingURL=style.module.css.map */
|
||||||
1
src/Components/BeingPage/style.module.css.map
Normal file
1
src/Components/BeingPage/style.module.css.map
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"sources":[],"names":[],"mappings":"","file":"style.module.css"}
|
||||||
16
src/Components/Calendar/index.jsx
Normal file
16
src/Components/Calendar/index.jsx
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import * as React from 'react';
|
||||||
|
import dayjs from 'dayjs';
|
||||||
|
import { DemoContainer, DemoItem } from '@mui/x-date-pickers/internals/demo';
|
||||||
|
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs';
|
||||||
|
import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
|
||||||
|
import { DateCalendar } from '@mui/x-date-pickers/DateCalendar';
|
||||||
|
|
||||||
|
export default function DateCalendarFormProps() {
|
||||||
|
return (
|
||||||
|
<LocalizationProvider dateAdapter={AdapterDayjs}>
|
||||||
|
<DemoContainer components={['DateCalendar']}>
|
||||||
|
<DateCalendar defaultValue={dayjs('2023-12-24')} readOnly />
|
||||||
|
</DemoContainer>
|
||||||
|
</LocalizationProvider>
|
||||||
|
);
|
||||||
|
}
|
||||||
73
src/Components/Card/style.module.css
Normal file
73
src/Components/Card/style.module.css
Normal file
@ -0,0 +1,73 @@
|
|||||||
|
.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;
|
||||||
|
}/*# sourceMappingURL=style.module.css.map */
|
||||||
1
src/Components/Card/style.module.css.map
Normal file
1
src/Components/Card/style.module.css.map
Normal file
@ -0,0 +1 @@
|
|||||||
|
{"version":3,"sources":["style.module.scss","style.module.css"],"names":[],"mappings":"AAAA;EACI,YAAA;EACA,aAAA;EACA,cAAA;EACA,iBAAA;ACCJ;;ADEA;EACI,aAAA;EACA,2BAAA;EACA,uBAAA;ACCJ;;ADEA;EACI,gBAAA;ACCJ;;ADEA;EACI,6BAAA;EAEJ,UAAA;EACA,uBAAA;EACA,eAAA;EACA,kBAAA;EACA,gBAAA;EACA,mBAAA;ACAA;;ADGA;EACI,YAAA;EACA,aAAA;EACA,cAAA;EACJ,mBAAA;EACA,mBAAA;ACAA;;ADGA;EACI,WAAA;EAEA,uBAAA;EACA,eAAA;EACA,kBAAA;EACA,gBAAA;EACA,mBAAA;ACDJ;;ADGA;EAEA,aAAA;EACA,uBAAA;EACA,uBAAA;EACA,mBAAA;EACA,cAAA;EACA,kBAAA;EACA,gBAAA;EACA,mBAAA;EACA,mBAAA;EACA,mBAAA;EACA,YAAA;EACA,aAAA;ACDA;;ADIA;EACI,oBAAA;EACJ,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,SAAA;EACA,mBAAA;EACA,wCAAA;ACDA;;ADGA;EACI,aAAA;EACA,8BAAA;ACAJ","file":"style.module.css"}
|
||||||
74
src/Components/profilePage/index.jsx
Normal file
74
src/Components/profilePage/index.jsx
Normal file
@ -0,0 +1,74 @@
|
|||||||
|
import Header from "../Header";
|
||||||
|
import styles from "./style.module.scss"
|
||||||
|
import Calendar from "../Calendar";
|
||||||
|
import avatar from '../../img/profilePage/avatar.png';
|
||||||
|
import gift from '../../img/profilePage/gift.png';
|
||||||
|
import Home from '../Home/Home';
|
||||||
|
const ProfilePage = () => {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Header></Header>
|
||||||
|
<section className={styles.profile__container}>
|
||||||
|
<div className={styles.profile__user_container}>
|
||||||
|
<div className={styles.profile__user_img_container}>
|
||||||
|
<img src={avatar} className={styles.profile__user_img}></img>
|
||||||
|
<div className={styles.profile__user_role}>Участник</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.profile__user_info_container}>
|
||||||
|
<div className={styles.profile__user_fullName}><span>К</span>ирсанов Дмитрий </div>
|
||||||
|
<div className={styles.profile__user_spaciality}>Junior PHP разработчик</div>
|
||||||
|
<div className={styles.profile__user_socialMedia}>TG: @dkir</div>
|
||||||
|
<div className={styles.profile__user_email}>gmail@gmail.com</div>
|
||||||
|
<div className={styles.profile__user_progress_container}>
|
||||||
|
<span>0</span>
|
||||||
|
<span className={styles.profile__user_progress_line}></span>
|
||||||
|
<span>1</span>
|
||||||
|
<img src={gift} className={styles.profile__user_progress_img}></img>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.calendar__container}>
|
||||||
|
<Calendar></Calendar>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section className={styles.myMeets}>
|
||||||
|
<div className={styles.myMeets__title}>Ваши мероприятия</div>
|
||||||
|
<div 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>
|
||||||
|
<div className={styles.NewContainer}>
|
||||||
|
<div className={styles.search_container}>
|
||||||
|
<div className={styles.search__descr}>100 мероприятий</div>
|
||||||
|
<select className={styles.select} name="type__meeting">
|
||||||
|
<option value="">Тип мероприятия</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.cards__container}>
|
||||||
|
<div className={styles.card}></div>
|
||||||
|
</div>
|
||||||
|
<Home></Home>
|
||||||
|
{/* <FetchUtils></FetchUtils> */}
|
||||||
|
{/* <PostForm /> */}
|
||||||
|
{/* <EditForm /> */}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
export default ProfilePage;
|
||||||
154
src/Components/profilePage/style.module.scss
Normal file
154
src/Components/profilePage/style.module.scss
Normal file
@ -0,0 +1,154 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.profile {
|
||||||
|
|
||||||
|
&__container {
|
||||||
|
margin-top: 200px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
&__user {
|
||||||
|
&_img {
|
||||||
|
&_container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-right: 50px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&_container {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
&_info_container {
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 20px;
|
||||||
|
display: flex;
|
||||||
|
text-align: left;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
&_fullName {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 36px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: normal;
|
||||||
|
span {
|
||||||
|
color: #FD0;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
&_spaciality {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 32px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
margin-top: 25px;
|
||||||
|
}
|
||||||
|
&_socialMedia {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 20px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
margin-top: 25px;
|
||||||
|
}
|
||||||
|
&_email {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 20px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
margin-top: 25px;
|
||||||
|
}
|
||||||
|
&_role {
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 24px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: normal;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
&_progress {
|
||||||
|
&_container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
&_line {
|
||||||
|
height: 2px;
|
||||||
|
width: 140%;
|
||||||
|
background: linear-gradient(90deg, #ffdd00,#d0d2d8);
|
||||||
|
padding: 0 30px 0 30px;
|
||||||
|
margin: 0 10px 0 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.meeting {
|
||||||
|
&__container {
|
||||||
|
height: 1400px;
|
||||||
|
margin-top: 60px;
|
||||||
|
}
|
||||||
|
&__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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.NewContainer {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
margin-top: 30px;
|
||||||
|
}
|
||||||
|
.search_container {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.search__descr {
|
||||||
|
margin-right: 25px;
|
||||||
|
}
|
||||||
|
.myMeets {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-content: start;
|
||||||
|
text-align: left;
|
||||||
|
justify-content: start;
|
||||||
|
&__title {
|
||||||
|
margin-top: 150px;
|
||||||
|
color: #000;
|
||||||
|
font-family: Montserrat;
|
||||||
|
font-size: 52px;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
BIN
src/img/profilePage/avatar.png
Normal file
BIN
src/img/profilePage/avatar.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 60 KiB |
BIN
src/img/profilePage/gift.png
Normal file
BIN
src/img/profilePage/gift.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 316 B |
Loading…
x
Reference in New Issue
Block a user