RodrigoJorge/challenge-landing-page-Rodrigo-Jorge
1
0
Fork 0
forked from M3-Academy/challenge-landing-page
Code Issues Pull Requests Packages Projects Releases Wiki Activity

RodrigoJorge #1

Merged
RodrigoJorge merged 13 commits from RodrigoJorge into main 2022-10-13 00:50:18 +00:00
Conversation 0 Commits 13 Files Changed 21 +57 -5
6 changed files with 57 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit de18437fd7 - Show all commits

BIN
imagens/Group (1).png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.9 KiB

BIN
imagens/Group.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 939 B

BIN
imagens/fxemoji_threenetworkedcomputers.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.6 KiB

BIN
imagens/shopping-bag (1) 1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

16
index.html
View File

@ -5,6 +5,9 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter&display=swap" rel="stylesheet">
<title>Desafio 1 - Landing Page</title>
</head>
<body>
@ -12,9 +15,18 @@
<img class="imagemCabecalho" src="imagens/Logo-M3Academy 1.svg" alt="Imagem m3 Academy">
</header>
<main>
<div class="corpoPt1">
<figure>
<img class="imagemCorpoPt1" src="imagens/Rectangle 9.png" alt="imagem de computador">
</div>
<figcaption class="corpoPt1">
<h2>Lorem Ipsum</h2>
<h1>Dolor sit amet</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit. Nulla suscipit magna dui. </p>
</figcaption>
</figure>
<figure class="corpoPt2">
<img class="imagem2" src="imagens/fxemoji_threenetworkedcomputers.png" alt="Imagem de tres computadores">
</figure>
</main>
</body>
</html>

46
style.css
View File

@ -1,19 +1,59 @@
body{
margin: 0;
padding: 0;
border: 0;
font-family: inter;
}
main figure{
margin-block-start: 0;
margin-block-end: 0;
margin-inline-start: 0;
margin-inline-end: 0;
}
.cabecalho {
background-color: #000000;
text-align: center;
height: 90%;
width: 100%;
}
.imagemCabecalho {
width: 12%;
height: 42%;
padding-top: 2.5%;
padding-bottom: 2.5%;
padding-top: 1.4%;
padding-bottom: 1.4%;
}
.imagemCorpoPt1{
width: 100%;
height: 100%;
}
.corpoPt1{
display: flex;
flex-direction: column;
align-items: center;
margin: 0;
}
.corpoPt1 h2{
margin-block-start: 0;
margin-block-end: 0;
margin-top: 73px;
line-height: 39px;
font-size: 32px;
text-transform: uppercase;
}
.corpoPt1 h1{
margin-block-start: 0;
margin-block-end: 0;
font-weight: 500;
line-height: 58px;
font-size: 48px;
text-transform: uppercase;
}
.corpoPt1 p{
margin-top: 28px;
width: 65%;
font-size: 16px;
}
.corpoPt2{
margin-top: 73px;
text-align: center;
}