Pegue esse projeto no figma e estou compartilhando apenas o que vou desenvolver até o final :D Favor me der feedback se até o momento esta correto com base no que foi ensinado nesse módulo:
home.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Treine-aqui</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header class="cabecalho">
<img class="cabecalho_image" src="/Exercicios_Praticos/Project_Figma/Logo.svg" alt="Logo da empresa Treine-aqui">
<nav class="cabecalho_menu">
<a class="cabecalho_menu_link" href="/Exercicios_Praticos/Project_Figma/home.html">Home</a>
<a class="cabecalho_menu_link" href="/Exercicios_Praticos/Project_Figma/about.html">About</a>
<a class="cabecalho_menu_link" href="/Exercicios_Praticos/Project_Figma/training.html">Training</a>
</nav>
</header>
<main class="hero">
<section>
<h1>WORKOUTS MADE <span>EXCLUSIVE</span> FOR YOU</h1>
<p class="hero_texto">We create <strong>exclusive and unique workouts</strong> for you. <br>
Invest in your body and <strong>get much more performance</strong><br>
and quality of life</p>
<a class="hero_link" href="">Start now</a>
</section>
<img class="hero_conteudo_image" src="/Exercicios_Praticos/Project_Figma/fitness-jump.svg" alt="Imagem de uma pessoa treinando">
</main>
<footer class="rodape">
<p class="rodape_texto">send us a message @treine.me</p>
</footer>
</body>
</html>
style.css
:root{
--backgroud--1: #F9F9F9;
--primary--color: #69B99D;
--roxo--escuro: #1F1534;
--black: #000000;
--gray: #7D7987;
--agua: #89C5CC;
}
body{
color: black;
}
.cabecalho{
color: #1F1534;
}
.cabecalho_menu{
color: #1F1534;
}
.hero{
color: #000000;
}
.hero h1{
color: var(--black);
}
.hero h1 span{
color: #89C5CC;
}
.hero_texto{
color: #7D7987;
}
.hero_link{
background-color: #89C5CC;
color: #F9F9F9;
}
.rodape{
color: #000000;
}
