estava tudo ok, com os botões, não sei se mexi em algo sem querer e não lembro
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
estava tudo ok, com os botões, não sei se mexi em algo sem querer e não lembro
Poderia enviar o seu codigo ? para podermos achar onde está o erro
Olá! Sou Igor Martins, desenvolvedor Front-end com especialidade em React, HTML e CSS. Ajudo pequenos negócios e designers a colocarem em prática boas ideias. Vamos conversar?
Desenvolvido Por Igor Martins.
CSS:
@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat&display=swap'); @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: #22D4FD; --cor-hover: #272727;
Instagram
Linkedin
--fonte-primaria: 'Krona One', sans-serif;
--font-secundaria: 'Montserrat', sans-serif;
}
*{ margin: 0; padding: 0; } .body{
box-sizing: border-box;
background-color: #000000;
color: #F6F6F6;
}
.cabecalho {padding: 2% 0% 0% 15%;
}
.cabecalho__menu { display: flex; gap: 80px;
}
.cabecalho__menu__link { font-family: var(--font-secundaria); font-size: 1.5rem; font-weight: 600; color: var(--cor-terciaria); }
.apresentacao{ padding: 4%; display: flex; align-items: center; justify-content: space-between; gap: 82px; } .apresentacao__conteudo{ width: 50%; } .apresentacao__conteudo__titulo { font-size: 2.25rem; font-family: var(--fonte-primaria); }
.titulo-destaque{ color: #22D4FD; }
.apresentacao__conteudo__texto { font-size: 1.5rem; font-family: var(--font-secundaria); }
.apresentacao__links{ display: flex; flex-direction: column; justify-content: space-between; align-items: center; gap: 32px; }
.apresentacao__links__subtitulo { font-family: var(--fonte-primaria); font-weight: 400; font-size: 1.5rem; }
.apresentacao__links__navegacao {
display: flex;
justify-content: center;
gap: 16px;
border: 2px solid var(--cor-terciaria);
width: 50%;
text-align: center;
border-radius: 8px;
font-size: 1.5rem;
font-weight: 600;
padding: 21.5px 0;
text-decoration: none;
color: var(--cor-secundaria);
font-family: var(--font-secundaria)
} .apresentacao__links__link:hover { background-color: var(--cor-hover); }
.apresentacao__imagem{
width: 50%;
}
.rodape { padding: 24px; color: var(--cor-primaria); background-color: var(--cor-terciaria); text-align: center; font-family: var(--font-secundaria); font-size: 1.5rem; font-weight: 400; }
@media (max-width: 950px) {
.cabecalho {
padding: 8%;
} .cabecalho__menu{
justify-content: center;
}
.apresentacao {
flex-direction: column-reverse;
padding: 5%;
}
.apresentacao__conteudo{
width: auto;
}
}