Merge branch 'main' of https://git.zetcraft.ru/CyberBloom/OgeetoCaseCyberGarden

src/Components/AddUsersPage/style.module.scss

@@ -287,7 +287,7 @@
             margin-left: 10%;
         }
         &_container {
-            height: 100%;
+            height: 96%;
             
             display: flex;
             align-items: start;

src/Components/Header/index.jsx

@@ -2,10 +2,12 @@
 import styles from './style.module.scss';
 import logo from '../../img/headerImg/header.png';
 import google from '../../img/headerImg/google.png';
-import avatar from '../../img/headerImg/avatar.png';
+
 import icon from '../../img/headerImg/Icon.png';
+import Menu from '../Menu'
 import { useNavigate } from "react-router-dom";
 
+
 import { useState } from 'react';
 
 const Header = () => {
@@ -23,7 +25,7 @@ const Header = () => {
             <div className={styles.header__container}>
             <header className={styles.header}>
                 <div className={styles.header__logo} onClick={handleHome} ><img onClick={handleHome} src={logo} alt="logo"></img></div>
-                <div className={styles.header_img_container}>  <img className={styles.header_img} src={icon}></img> <img className={styles.header_img} src={avatar}></img></div>
+                <div className={styles.header_img_container}>  <img className={styles.header_img} src={icon}></img> <Menu></Menu></div>
             </header>
         </div>
         ) :

src/Components/HomePage/index.jsx

@@ -9,6 +9,7 @@ import Questions from "../post/Questions";
 import { GetQuestions } from "../get/Questions";
 
 
+import muza from '../../img/homePage/muza.png';
 const APIURL = ''
 
 // const events = [
@@ -39,7 +40,9 @@ const HomePage = () => {
     <>
 
         <Header></Header>
+        <div className={styles.muza_img_container}><img src={muza} alt='muza' className={styles.muza_img}></img></div>
         <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>

src/Components/HomePage/style.module.scss

@@ -5,13 +5,19 @@
 }
 .muza {
     &__container {
-        height: 700px;
+        height: 780px;
         display: flex;
         align-items: center;
         flex-direction: column;
         width: 100%;
+        position: relative;
     }
-   
+   &_img {
+    position: absolute;
+    left: 0px;
+    top: 300px;
+    height: 480px;
+   }
     &__title {
         margin-top: 150px;
         color: #000;
@@ -23,6 +29,7 @@
         text-align: left;
         display: flex;
         width: 90%;
+        z-index: 10;
 
     }
     &__descr {
@@ -30,7 +37,7 @@
             display: flex;
             justify-content: flex-end;
         }
-        margin-top: 50px;
+        margin-top: 100px;
         margin-left: 70px;
         color: #000;
         font-family: Montserrat;
@@ -41,7 +48,7 @@
         text-align: left;
         display: flex;
         width: 60%;
-
+        z-index: 10;
     }
 }
 .meeting {

src/Components/Menu/index.jsx

@@ -0,0 +1,55 @@
+import * as React from 'react';
+import Button from '@mui/material/Button';
+import Menu from '@mui/material/Menu';
+import MenuItem from '@mui/material/MenuItem';
+import avatar from '../../img/headerImg/avatar.png'
+import { useNavigate } from "react-router-dom";;
+import styles from './style.module.scss';
+export default function BasicMenu() {
+  const [anchorEl, setAnchorEl] = React.useState(null);
+  const open = Boolean(anchorEl);
+  const handleClick = (event) => {
+    setAnchorEl(event.currentTarget);
+  };
+  const navigate = useNavigate();
+    const handleHome = () => {
+        navigate('/');
+        setAnchorEl(null);
+    }
+    const handleProfile = () => {
+        navigate('/profile');
+        setAnchorEl(null);
+    }
+    const handleAtchive = () => {
+        navigate('/achievements');
+        setAnchorEl(null);
+    }
+    const handleClose = () => {
+        setAnchorEl(null);
+    }
+  return (
+    <>
+      <img
+        src={avatar}
+        className={styles.header_img}
+        aria-controls={open ? 'basic-menu' : undefined}
+        aria-expanded={open ? 'true' : undefined}
+        onClick={handleClick}
+      >
+      </img>
+      <Menu
+        id="basic-menu"
+        anchorEl={anchorEl}
+        open={open}
+        onClose={handleClose}
+        MenuListProps={{
+          'aria-labelledby': 'basic-button',
+        }}
+      >
+        <MenuItem onClick={handleProfile}>Профиль</MenuItem>
+        <MenuItem onClick={handleAtchive}>Достижения</MenuItem>
+        <MenuItem onClick={handleHome}>Выйти</MenuItem>
+      </Menu>
+    </>
+  );
+}

src/Components/Menu/style.module.scss

@@ -0,0 +1,8 @@
+.header {
+    &_img {
+
+        width: 55px;
+        margin-right: 40px;
+        height: 55px;
+    }
+}