Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

lista de exercicios?

@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:wght@400;600&display=swap');

:root { --cor-primaria: #000000; --cor-secundaria: #f6f6f6; --cor-terciaria: #24DFDd; --cor-hover: #272727;

--fonte-principal: "Montserrat", sans-serif;
--fonte-secundaria: "Krona One", sans-serif;

}

  • { margin: 0; padding: 0; }

body{ /* height: 80vh; */ box-sizing: border-box; background-color: var(--cor-primaria); color: var(--cor-secundaria); }

strong{ color: var(--cor-terciaria); }

.apresentacao { margin: 10% 15%; display: flex; align-items: center; justify-content: space-between; }

.apresentacao__conteudo { width: 50%; display: flex; flex-direction: column; gap: 40px; }

.apresentacao__conteudo__titulo { font-size: 2.25rem; font-family: var(--fonte-principal); }

.apresentacao__conteudo__texto { font-size: 1.5rem; font-family: var(--fonte-secundaria); }

.apresentacao__links { display: flex; justify-content: space-between; flex-direction: column; align-items: center; gap: 32px; }

.apresentacao__links__subtitulo { font-family: var(--fonte-principal); font-size: 1.5rem; font-weight: 400; }

.apresentacao__links__navegacao { /* background-color: #22D4FD; */ display: flex; justify-content: center; align-items: center; gap: 16px; border: 2px solid var(--cor-terciaria); width: 50%; text-align: center; border-radius: 16px; font-size: 1.5rem; font-weight: 600; padding: 21.5px 0; text-decoration: none; color: var(--cor-secundaria); font-family: var(--fonte-secundaria); }

.apresentacao__links__link:hover { background-color: var(--cor-hover); }

.rodape { color: var(--cor-primaria); background-color: var(--cor-terciaria); padding: 24px; text-align: center; font-family: var(--fonte-secundaria); font-size: 1.5rem; font-weight: 400; }

.cabecalho { padding: 2% 0 0 15%; }

.cabecalho__menu { display: flex; gap: 80px; }

.cabecalho__menu__link { font-family: var(--fonte-secundaria); font-size: 1.5rem; font-weight: 600; color: var(--cor-terciaria); text-decoration: none;

}

.apresentacao__imagem { width: 50%; }

1 resposta
solução!

Oii Pedro, tudo bem?

Seu código CSS tá bem estruturado e organizado. Você tá usando variáveis CSS para definir cores e fontes, o que é uma prática recomendada para manter seu código mais limpo e fácil de manter.

Lembre-se de que, além de compartilhar aqui no fórum, você também pode marcar a Alura nas redes sociais para que mais pessoas possam ver seu trabalho.

A Alura tem perfis em várias redes sociais, você pode encontrá-los aqui.

Um abraço e bons estudos.