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

feat: Adiciona Infocard do bot mobile

Browse Source
This commit is contained in:
Filipe Quintanilha Evangelista 2022-10-12 13:21:50 -03:00
parent 2b56671873
commit 340907520b
3 changed files with 15 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/images/bot-infocard-image-mobile.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 246 KiB

14
assets/styles/main.css
View File

@ -236,13 +236,15 @@ body{
}
@media screen and (min-width:1025px){
.main-banner-mobile{
.main-banner-mobile,
.bot-infocard-image-mobile{
display: none;
}
}
@media screen and (max-width:1024px) {
.main-banner-desktop{
.main-banner-desktop,
.bot-infocard-image-desktop{
display: none;
}
@ -313,5 +315,13 @@ body{
.bot-card-image-04{
width: 23%;
}
.bot-infocard{
flex-direction: column-reverse;
padding: 98px 0 87px;
}
.bot-infocard-text{
width: 84%;
}
}

5
index.html
View File

@ -144,11 +144,12 @@
</div>
<figure class="bot-infocard-figure">
<img class="bot-infocard-image" src="./assets/images/bot-infocard-image-desktop.png" alt="Imagem do Infocard do Bot">
<img class="bot-infocard-image bot-infocard-image-desktop" src="./assets/images/bot-infocard-image-desktop.png" alt="Imagem do Infocard do Bot Desktop">
<img class="bot-infocard-image bot-infocard-image-mobile" src="./assets/images/bot-infocard-image-mobile.png" alt="Imagem do Infocard do Bot">
</figure>
</article>
</main>
</body>