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

development #5

Merged
Gustavo_Rallenson_Goncalves_Da_Silva merged 13 commits from development into main 2022-10-13 00:31:35 +00:00
Conversation 0 Commits 13 Files Changed 21 +74
6 changed files with 74 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 2eccfccc0c - Show all commits

32
assets/Css/Styles.css
View File

@ -114,6 +114,33 @@ background: #000000;
display: block;
width: 100%;
}
.BottomCards{
display: grid;
grid-template-columns: 22% 22% 22% 22%;
padding: 126px 0 108px;
gap: 16px;
justify-content: center;
align-items: center;
}
.bottomcard{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background: #FFFFFF;
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.23);
padding: 32px 0 0;
}
.BottomImage{
margin-bottom: 14px;
}
.imgdescripton{
padding: 0px 32px 65px;
text-align: center;
font-size: 16px;
line-height: 24px;
}
@media screen and (max-width: 1023px) {
@ -150,6 +177,11 @@ background: #000000;
gap:24px;
justify-items: center;
}
.BottomCards {
grid-template-columns: 1fr;
padding: 80px 22px 100px;
}
.wrapper{
gap: 14px;
grid-template-columns: none;

BIN
assets/Image/Group.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
assets/Image/coin 2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.0 KiB

BIN
assets/Image/laptop 1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
assets/Image/money (1) 2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

42
index.html
View File

@ -70,6 +70,48 @@
</figure>
</div>
</div>
<div class="BottomCards">
<figure class="bottomcard" >
<img class="BottomImage" src="/assets/Image/money (1) 2.png" alt="icone de Money">
<figcaption class="imgdescripton">
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.
</figcaption>
</figure>
<figure class="bottomcard">
<img class="BottomImage" src="/assets/Image/coin 2.png" alt="icone de Dinheiro">
<figcaption class="imgdescripton">
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.
</figcaption>
</figure>
<figure class="bottomcard">
<img class="BottomImage" src="/assets/Image/laptop 1.png" alt="icone de Laptop">
<figcaption class="imgdescripton">
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.
</figcaption>
</figure>
<figure class="bottomcard">
<img class="BottomImage" src="/assets/Image/Group.png" alt="icone de Celular">
<figcaption class="imgdescripton">
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.
</figcaption>
</figure>
</div>
</main>
<footer></footer>
</body>