Tochka
/
legacy
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor Header.jsx

This commit is contained in:
b1ek 2023-05-08 14:29:42 +10:00
parent 995d4349fc
commit fee5d43007
Signed by: blek
GPG Key ID: 14546221E3595D0C
1 changed files with 25 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
pairent_frontend_react/src/components/Header/Header.jsx
View File

@ -1,9 +1,9 @@
import React from 'react';
import {Link} from "react-router-dom";
import { Link } from "react-router-dom";
import styled from 'styled-components';
import SVGIcon from '../UI/Icon/SVGIcon';
import './styles/Header.css';
// import './styles/Header.css';
const HeaderElement = styled.header`
display: flex;
@ -38,7 +38,21 @@ const LocationButton = styled.button`
const PairentLogo = styled.h1`
user-select: none;
`
`;
const NavButton = styled.div`
& a:hover {
color: #0050A1;
transition: 0.3s ease;
}
`;
const Navbar = styled.nav`
display: flex;
align-items: center;
& ${NavButton} {
margin-right: 55px
}
`;
const Header = function () {
return (
@ -58,29 +72,29 @@ const Header = function () {
</LocationButton>
</Link>
</LogoSection>
<nav>
<div>
<Navbar>
<NavButton>
<Link to="/favorites">
<SVGIcon src='/images/icons/heart.svg' width='16' height='14' />
Избранное
</Link>
</div>
<div>
</NavButton>
<NavButton>
<Link to="/comparisons">
<SVGIcon src='/images/icons/stats.svg' width='16' height='14' />
Сравнения
</Link>
</div>
<div>
</NavButton>
<NavButton>
<Link to="/">
<SVGIcon src='/images/icons/chat-bubble.svg' width='16' height='14' />
Чаты
</Link>
</div>
</NavButton>
<Link to="/">
<SVGIcon src='/images/icons/user.svg' width='32' height='32' />
</Link>
</nav>
</Navbar>
</HeaderElement>
);
}