forked from M3-Academy/desafio-react-e-typescript
Entrega do Desafio #1
@ -40,7 +40,7 @@ header {
|
||||
@media (max-width: 376px) {
|
||||
width: 91.484%;
|
||||
}
|
||||
.Icon__Content {
|
||||
.Header__Button {
|
||||
background: transparent;
|
||||
border: 0;
|
||||
padding: 0;
|
||||
@ -216,7 +216,7 @@ header {
|
||||
left: 16px;
|
||||
}
|
||||
}
|
||||
.closed {
|
||||
.Closed {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
@media (max-width: 1025px) {
|
||||
|
@ -6,13 +6,12 @@ import Icon__Menu from "../../assets/imgs/IconMenu.svg";
|
||||
|
||||
const Header = () => {
|
||||
|
||||
|
||||
const [menuIsVisible, setMenuIsVisible]= useState(false);
|
||||
|
||||
return (
|
||||
<header>
|
||||
<ul className="Header__Top">
|
||||
<button className="Icon__Content" onClick={() => setMenuIsVisible(true)}>
|
||||
<button className="Header__Button" onClick={() => setMenuIsVisible(true)} aria-label="abrir menu">
|
||||
<img src={Icon__Menu} alt="ícone de menu" className="Icon__Menu" />
|
||||
</button>
|
||||
<HeaderContentTop menuIsVisible={menuIsVisible} setMenuIsVisible={setMenuIsVisible}/>
|
||||
|
@ -32,9 +32,9 @@ const HeaderContentTop = ({menuIsVisible,setMenuIsVisible}: HeaderContentProps)
|
||||
<ul className="Menu__Header__Top">
|
||||
<li className={`List__Login ${menuIsVisible && 'opened'}`} onClick={() => setMenuIsVisible(false)}>
|
||||
<a href="/">Entrar</a>
|
||||
<button className="Icon__Content closed" onClick={() => setMenuIsVisible(false)}>
|
||||
<img src={Icon__Menu__Closed} alt="ícone do menu pra fechar" className="Icon__Menu__Closed"/>
|
||||
</button>
|
||||
<button className="Header__Button Closed" onClick={() => setMenuIsVisible(false)} aria-label="fechar menu">
|
||||
<img src={Icon__Menu__Closed} alt="ícone do menu pra fechar" className="Icon__Menu__Closed"/>
|
||||
</button>
|
||||
</li>
|
||||
<li className="List__Cart">
|
||||
<a href="/" className="cart__content--link">
|
||||
|
Loading…
x
Reference in New Issue
Block a user