Vi na solução do professor, que os elementos do footer estão dispostos dentro da tag<section>, mas eu consegui um resultado muito semelhando sem usá-la, gostaria de saber se isso seria algum tipo de boa prática do React.
Também estou aberto a qualquer sugestão relativa ao código.
A seguir minha solução:
import "./Rodape.css"
export const Rodape = () => {
return (
<footer className="rodape" >
<div className="redes-sociais">
<img alt="Facebook" src="imagens/fb.png"/>
<img alt="Twitter" src="imagens/tw.png"/>
<img alt="Instagram" src="imagens/ig.png"/>
</div>
<img className="logo" alt="logo" src="imagens/logo.png"/>
<span>Desenvolvido por Alura.</span>
</footer>
)
}
CSS:
.rodape {
min-height: 200px;
color: white;
background-color: #6278f7;
display: flex;
flex-direction: row;
justify-content: space-evenly;
align-items: center;
}
.rodape .redes-sociais img{
margin: 0px 8px;
}
.rodape span {
font-size: 20px;
font-weight: 600;
}
