1
resposta

[Sugestão] Minha solução =)

import './Rodape.css'

const Rodape = () => {
    return (
        <footer>
            <img src="/imagens/fundo.png" alt="Rodape" className="rodape__imagem" />
            <div className="icones">
                <a href="https://www.facebook.com/pedrozo.eduardo" target='__blank'>
                    <img src="/imagens/fb.png" alt="Ícone do Facebook" /></a>
                <a href="https://instagram.com/edupedrozzo"><img src="/imagens/ig.png" alt="Ícone do Instagram" /></a>
            </div>

            <img src="/imagens/logo.png" alt="Logo do Organo" />

            <p>Desenvolvido por Eduardo Pedrozo</p>

        </footer>
    )
}

export default Rodape
footer {
    background-color: #6278f7;
    width: 100%;
    height: 213px;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.rodape__imagem {
    width: 100%;
    height: 213px;
    position: absolute;
}


.icones a {
    cursor: pointer;
    position: sticky;
}

.icones img {
    padding: 1em;
}

footer p {
    color: white;
    font-weight: 500;
    font-size: 1.25rem;
}
1 resposta

Olá Eduardo, tudo bem?

Muito obrigada por compartilhar a sua solução com a gente. :D

Seu código parece estar correto e bem organizado. Acredito que a sua solução para o rodapé da página ficou muito boa. Gostei da escolha das cores e do layout em geral. Parabéns pelo trabalho!

Um abraço e bons estudos.