1
resposta

[Projeto] Lista de Exercícios 5

Css

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

:root {--cor-primaria:rgba(37, 250, 18, 0.822);
    --cor-secundaria:hwb(187 5% 5% / 0.452);
    --cor-terciaria:hsla(175, 81%, 49%, 0.514);
    --cor-hover:#0e1681d8;
    --fonte-primaria: 'Krona One', sans-serif;
    --fonte-secundaria: 'Montserrat', sans-serif;
}
--fonte-primaria: 'Krona One', sans-serif;
    --fonte-secundaria: 'Montserrat', sans-serif;
}
.apresentacao{
    padding:  6% 15%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.apresentacao__conteudo{
    width: 615px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.apresentacao__conteudo{
    width: 615px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.apresentacao__conteudo__titulo{
    font-size: 36px;
    font-family: var(--fonte-primaria)
}

.apresentacao__conteudo__texto{
    font-size: 24px;
    font-family: var(--fonte-secundaria)
}
.apresentacao__links{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.apresentacao__links__subtitulo {
    font-family: var(--fonte-primaria)
    font-weight 400;
    font-size: 24px;

}

.apresentacao__links__link{
    display: flex;
    justify-content: center;
    gap: 16px;
    width: 378px;
    text-align: center;
    border-radius: 8px;
    font-size: 24px;
    font-weight: 600;
    padding: 21.5px 0;
    text-decoration: none;
    color: var(--cor-secundaria);
    border: 2px solid var(--cor-terciaria);
    font-family: var(--fonte-secundaria);
}



   .apresentacao__links__link:hover {
    background-color: var(--cor-hover);
    font-weight: 400;
    size: 60px;
   }
   .rodape {

    color: var(--cor-primaria);
    background-color: var(--cor-terciaria);
    padding: 24px;
    text-align: center;
    font-family: var()
    font-size 24px;
    font-weight: 400;
 }

    .cabecalho {
        padding: 2% 0% 0% 10%;
    }
    .cabecalho__menu {
        display: flex;
        gap: 80px;
    }


 .cabecalho__menu__link {

    font-size: 24px;
    font-family: var(--fonte-secundaria)
    font-weight 600;
    color: var(--cor-terciaria);
    text-decoration: none;
}

.curriculo {
    padding:  6% 15%;
    justify-content: space-between;
}

    
   

Home Sobre mim

1 resposta

Olá, Estanislau, como vai?

O código está bem estruturado, mas há alguns pequenos ajustes a serem feitos para garantir o bom funcionamento e a padronização do código.

  • Duplicação de propriedades: As variáveis --fonte-primaria e --fonte-secundaria estão declaradas duas vezes no :root. Você pode remover a repetição para manter o código mais organizado.
  • Fechamento incorreto da regra: root: Há um fechamento } extra logo após a segunda declaração das fontes, o que pode causar erros na interpretação do CSS.
  • Propriedades sem ponto e vírgula: No seletor .apresentacao__links__subtitulo, falta um ponto e vírgula após font-family: var(--fonte-primaria). O mesmo acontece no .rodape com font-family: var() (além disso, var() está incompleto, pois precisa de um valor válido dentro dos parênteses). E no .cabecalho__menu__link, onde font-family também precisa de ponto e vírgula no final.
  • Propriedade size: No .apresentacao__links__link:hover, a propriedade size: 60px; não é válida, corrija para font-size: 60px;.

Seu código está bem organizado e com esses ajustes, tudo deve funcionar corretamente.

Continue compartilhando seus exercícios.

Espero ter ajudado!

Siga firme nos seus estudos e conte com o fórum sempre que precisar!

Abraços :)