Boa tarde, eu copiei e colei o código do prof mas aparece este erro:
Ao inspecionar, vemos o seguinte:
o código:
import styled from 'styled-components'
const Opicoes = styled.ul`
display: flex;
`
const Opicao = styled.li`
font-size: 16px;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
height: 100%;
padding: 0 5px;
cursor: pointer;
min-width: 120px;
`
const textoOpcoes = ['CATEGORIAS', 'FAVORITOS', 'MINHA ESTANTE'] /*Matriz*/
function OpcoesHeader () {
return(
<Opicoes>
{/*Percorre ou varre a matriz que criamos*/}
{ textoOpcoes.map( (texto) => (
<Opicao><p>{texto}</p></Opicao>
) )}
{/* <li className='opcao'><p>CATEGORIAS</p> </li>
<li className='opcao'><p>MINHA ESTANTE</p> </li>
<li className='opcao'><p>FAVORITOS</p> </li> */}
</Opicoes>
)
}
export default OpcoesHeader
Pedria me ajudar a solucionar o erro por gentileza
