forked from M3-Academy/challenge-landing-page
feat(style): added 3 laptop img
This commit is contained in:
parent
fe0728fee9
commit
71f45d7666
@ -43,7 +43,6 @@
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<div class="block">
|
<div class="block">
|
||||||
<img class="block-img" src="assets/shopping-bag (1) 1.png" alt="Icone de uma sacola de compras.">
|
<img class="block-img" src="assets/shopping-bag (1) 1.png" alt="Icone de uma sacola de compras.">
|
||||||
<p class="block-text">
|
<p class="block-text">
|
||||||
@ -60,43 +59,52 @@
|
|||||||
</section>
|
</section>
|
||||||
</article>
|
</article>
|
||||||
|
|
||||||
|
<section class="blocks2">
|
||||||
|
<div class="blocks-wrapper">
|
||||||
|
<div class="img-square">
|
||||||
|
<img class="block-img2" src="assets/img/Rectangle 13.png" alt="Imagem de um laptop">
|
||||||
|
</div>
|
||||||
|
<div class="img-square">
|
||||||
|
<img class="block-img2" src="assets/img/Rectangle 16.png" alt="Imagem de um laptop">
|
||||||
|
</div>
|
||||||
|
<div class="img-square">
|
||||||
|
<img class="block-img2" src="assets/img/Rectangle 17.png" alt="Imagem de um laptop">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="blocks">
|
||||||
|
<div class="block">
|
||||||
|
<img class="block-img" src="assets/money (1) 2.png" alt="Icone de dinheiro.">
|
||||||
|
<p class="block-text">
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="block">
|
||||||
|
<img class="block-img" src="assets/coin 1.png" alt="Icone de dinheiro.">
|
||||||
|
<p class="block-text">
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="block">
|
||||||
|
<img class="block-img" src="assets/laptop 1.png" alt="Icone de um laptop.">
|
||||||
|
<p class="block-text">
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="block">
|
||||||
|
<img class="block-img" src="assets/Group.png" alt="Icone de um celular.">
|
||||||
|
<p class="block-text">
|
||||||
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<!--
|
<!--
|
||||||
|
|
||||||
<div class="img-square">
|
|
||||||
<img src="assets/img/Rectangle 13.png" alt="Imagem de um laptop">
|
|
||||||
</div>
|
|
||||||
<div class="img-square">
|
|
||||||
<img src="assets/img/Rectangle 16.png" alt="Imagem de um laptop">
|
|
||||||
</div>
|
|
||||||
<div class="img-square">
|
|
||||||
<img src="assets/img/Rectangle 17.png" alt="Imagem de um laptop">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<section class="block">
|
|
||||||
<img src="assets/money (1) 2.png" alt="Icone de dinheiro.">
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
<section class="block">
|
|
||||||
<img src="assets/coin 1.png" alt="Icone de dinheiro.">
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
<section class="block">
|
|
||||||
<img src="assets/laptop 1.png" alt="Icone de um laptop.">
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
<section class="block">
|
|
||||||
<img src="assets/Group.png" alt="Icone de um celular.">
|
|
||||||
<p>
|
|
||||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<article>
|
<article>
|
||||||
<h1>Lorem ipsum dolor sit amet</h1>
|
<h1>Lorem ipsum dolor sit amet</h1>
|
||||||
<p>
|
<p>
|
||||||
|
@ -79,6 +79,7 @@ article {
|
|||||||
grid-template-columns: repeat(3, max-content);
|
grid-template-columns: repeat(3, max-content);
|
||||||
gap: 20px;
|
gap: 20px;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
padding-bottom: 80px;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -102,6 +103,24 @@ article {
|
|||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.blocks2 {
|
||||||
|
margin-bottom: 190px;
|
||||||
|
background: #E0E0E0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blocks-wrapper {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
gap: 40px;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 0px 72px 0px 72px;
|
||||||
|
position: relative;
|
||||||
|
top: 62px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.block-img2 {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user