.rodape {
text-align: center;
margin: 8em 5em;
}
.rodape__logo{
margin-bottom: 2em;
}
.rodape__lista {
display: flex;
justify-content: center;
list-style-type: none;
gap: 1em
}
.lista__link a {
color: var(--branco-prinicpal);
font-size: 16px;
text-decoration: none;
padding: 0 0.5em;
}
.rodape__texto {
margin: 1.5em 0 2em 0;
color: var(--cinza-secundario);
font-size: 14px;
padding: 0 20em;
}
Olá Raffael!
Pelo que você descreveu, parece que você já está no caminho certo para estilizar o footer. Vamos revisar alguns pontos para garantir que tudo esteja conforme o esperado:
Centralização da Logo: Parece que a logo já está centralizada com text-align: center; na classe .rodape.
Lista Flexível: Você já transformou a lista em um flex-container com display: flex; e justify-content: center;, o que é ótimo para alinhar os links horizontalmente.
Estilização dos Links: Certifique-se de que a cor dos links está correta. Você está usando color: var(--branco-principal);, então verifique se a variável está definida corretamente no seu CSS.
Margens e Padding: As margens e o padding parecem estar bem definidos. Se precisar ajustar o espaçamento, você pode modificar os valores de margin e padding conforme necessário.
Verificação no Figma: Sempre é bom comparar com o design no Figma para garantir que as cores, fontes e espaçamentos estejam corretos.
Se ainda houver algo que não esteja aparecendo como esperado, verifique se todos os arquivos CSS estão sendo carregados corretamente no HTML. Às vezes, um link quebrado pode impedir que as estilizações sejam aplicadas.
Espero ter ajudado e bons estudos!