Merge pull request #85 from MargoMarm/fix/Header

fix header
MargoMarm · Sep 25, 2023 · dc71dfc · dc71dfc
2 parents c36b04c + 8a97b40
commit dc71dfc
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 4 deletions.
diff --git a/src/components/MobMenu/MobMenu.jsx b/src/components/MobMenu/MobMenu.jsx
@@ -12,7 +12,7 @@ import {
   ContainerLink,
   Span,
   Svg,
-  SvgUser,
+  Link,
   Overlay,
 } from './MobMenu.styled';
 import { UserAvatar } from '../headersComp/UserNav/UserNav.styled';
@@ -46,11 +46,11 @@ const MobMenu = () => {
   return (
     <>
       <MenuBars to="#">
-        <ButtonMenu type="button">
+        <Link to={'/profile'}>
           <Svg>
             <use href={sprite + `#settings`}></use>
           </Svg>
-        </ButtonMenu>
+        </Link>
         <ButtonMenu type="button">
           {avatarURL ? (
             <UserAvatar>

diff --git a/src/components/MobMenu/MobMenu.styled.js b/src/components/MobMenu/MobMenu.styled.js
@@ -1,5 +1,14 @@
 import styled from '@emotion/styled';
 import { mq, colors, button, svgUser } from '../../utils';
+import { NavLink } from 'react-router-dom';
+
+export const Link = styled(NavLink)`
+  display: flex;
+  align-items: center;
+  ${mq.desktop} {
+    display: none;
+  }
+`;
 
 export const MenuBars = styled.div`
   display: flex;
@@ -74,7 +83,7 @@ export const NavbarToggle = styled.div`
 `;
 
 export const ContainerMenu = styled.div`
-position: relative;
+  position: relative;
 
   width: 100%;
   height: 100vh;