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

feat: adiciona banner desktop

Browse Source
This commit is contained in:
Yan Pecanha Garriga 2022-10-11 18:50:54 -03:00
parent c2957e055f
commit 25fc89dc22
2 changed files with 154 additions and 141 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
assets/styles.css/main.css
View File

@ -24,7 +24,7 @@ body {
.top-infocard { .top-infocard {
display: flex; display: flex;
justify-content: center; justify-content: center;
padding: 73px 0 0; padding: 3.80vw 0 0;
} }
.top-infocard-text { .top-infocard-text {
@ -63,20 +63,20 @@ body {
} }
.top-infocard-image { .top-infocard-image {
padding: 73px 0 89px 0; padding: 3.80vw 0 4.63vw 0;
} }
.top-card-image { .top-card-image {
display: block; display: block;
margin-bottom: 26px; margin-bottom: 1.40vw;
} }
.top-cards { .top-cards {
background: #FFFFFF; background: #FFFFFF;
grid-template-columns: repeat(3, max-content); grid-template-columns: repeat(3, max-content);
padding: 90px 0 80px; padding: 3.125vw 0 4.166vw;
display: grid; display: grid;
gap: 20px; gap: 1.09vw;
justify-content: center; justify-content: center;
} }
@ -180,6 +180,11 @@ body {
line-height: 24px; line-height: 24px;
} }
.bottom-banner-image {
width: 100%;
padding: 2.6vw 14.583vw 6.04vw;
}
@media screen and (max-width: 414px) { @media screen and (max-width: 414px) {
.main-banner-desktop { .main-banner-desktop {
display: none; display: none;

18
index.html
View File

@ -1,7 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="pt-BR"> <html lang="pt-BR">
<head> <head>
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
@ -14,9 +14,9 @@
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./assets/styles.css/main.css" /> <link rel="stylesheet" href="./assets/styles.css/main.css" />
</head> </head>
<body> <body>
<header class="page-header"> <header class="page-header">
<a href="/"> <a href="/">
<img class="header-logo" src="./assets/images/Logo-M3Academy 1.png" alt="Logo M3-Academy" /> <img class="header-logo" src="./assets/images/Logo-M3Academy 1.png" alt="Logo M3-Academy" />
@ -154,7 +154,15 @@
</p> </p>
</div> </div>
</section> </section>
</main>
</body>
<div class="bottom-banner">
<img class="bottom-banner-image" src="./assets/images/bottom-banner-desktop.png" alt="banner de baixo" />
</div>
<footer>
</footer>
</main>
</body>
</html> </html>