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

Adiciona mais responsividade ao site

Browse Source
This commit is contained in:
SamuelCondack 2022-10-12 22:54:30 -03:00
parent 34ef3c5663
commit 3a833a95d8
2 changed files with 130 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
index.html
View File

@ -95,8 +95,8 @@
<section class="end-footer">
<div class="footer-images">
<div><img src="assets/images/instagram-logo.svg" alt="instagram logo" class="footer-img"></div>
<div><img src="assets/images/facebook-logo.svg" alt="facebook logo"></div class="footer-img">
<div><img src="assets/images/youtube 2.svg" alt="youtube logo"></div class="footer-img">
<div><img src="assets/images/facebook-logo.svg" alt="facebook logo"class="footer-img"></div >
<div><img src="assets/images/youtube 2.svg" alt="youtube logo" class="footer-img"></div >
</div>
<p class="footer-p">Copyright © 2020 - Loja Comércio Eletrônico CNPJ: 000.000.000/0001-00
</p>

132
styles/style.css
View File

@ -150,7 +150,7 @@
justify-content: center;
align-items: center;
gap: 16px;
padding: 191px 72px 79px 72px;
padding: 191px 72px 0px 72px;
}
.second-card-p {
@ -230,7 +230,9 @@
}
.bottom-banner-img {
max-width: 1360px;
width: 100%;
padding: 0px 30px 0px 30px;
}
.end-footer {
@ -253,6 +255,97 @@
padding-bottom: 38px;
}
@media screen and (min-width: 3500px){
.header-logo {
width: 500px;
}
.first-content-p {
font-size: xx-large;
}
.first-content-h2 {
font-size: 70px;
}
.first-content-p {
font-size: 30px;
}
.block {
min-width: 500px;
min-height: 700px;
}
.row-image-desktop {
width: 2000px;
}
.bottom-banner-img {
min-width: 2000px;
}
}
@media screen and (min-width: 2500px) {
.header-logo {
min-height: 130px;
}
.first-content-h2 {
font-size: 50px;
}
.first-content-h1 {
padding-top: 10px;
font-size: 60px;
}
.first-content-p {
font-size: 26px;
}
.first-card-image {
width: 200px;
}
.first-card-p {
font-size: 30px;
}
.image-row-background {
min-height: 650px;
}
.row-image-desktop {
width: 700px;
}
.second-card-image {
width: 500px;
height: 200px;
}
.second-card-p {
font-size: 30px;
}
.second-content-h2 {
font-size: 44px;
}
.second-content-p {
font-size: 26px;
}
.footer-img {
min-height: 35px;
}
.footer-p {
font-size: 18px;
}
}
@media screen and (max-width: 1024px) {
.first-content-text {
max-width: 367px;
@ -313,17 +406,23 @@
.bottom-banner-desktop {
display: none;
}
.bottom-banner-img {
width: 60%;
}
.second-content {
padding: 50px 32px;
padding: 50px 32px 0px;
}
.bottom-banner {
display: none;
}
.bottom-banner-img {
padding: 0px;
}
.second-content2 {
display: none;
}
@ -352,8 +451,12 @@
}
@media screen and (max-width: 500px) {
.block {
width: 200px;
}
.row-image-mobile {
width: 70%;
width: 75%;
}
.image-row-background {
@ -365,10 +468,31 @@
}
.row-image-mobile2 {
width: 150%;
width: 160%;
}
.bottom-banner-img {
width: 100%;
}
}
@media screen and (max-width: 330px) {
.row-image-mobile {
width: 80%;
}
.row-image-mobile2 {
width: 170%;
}
}
@media screen and (max-width: 300px) {
.row-image-mobile {
width: 90%;
}
.row-image-mobile2 {
width: 185%;
}
}