From ce958a16eee6e9de866eb16ea52a46f1595cc451 Mon Sep 17 00:00:00 2001 From: guiprj Date: Wed, 12 Oct 2022 21:43:25 -0300 Subject: [PATCH] feat(home): tratando responsividade do footer --- src/index.html | 190 ++++++++++++++++++++++++++----------------------- src/style.css | 25 +++++-- 2 files changed, 119 insertions(+), 96 deletions(-) diff --git a/src/index.html b/src/index.html index c238de5..42ac2e7 100644 --- a/src/index.html +++ b/src/index.html @@ -7,7 +7,10 @@ - + M3 Academy Landing Page @@ -15,54 +18,58 @@
-
- Imagem com um notebook -
- -
- Imagem com um notebook -
- + +
+ Imagem com um notebook +
+ + +
+ Imagem com um notebook +
+

Lorem ipsum

DOLOR SIT AMET

@@ -413,7 +420,7 @@ sed augue.

- +
-
@@ -438,50 +444,56 @@
- - - - - - - - - - - + + + + + + + + + + + + + + + + +

diff --git a/src/style.css b/src/style.css index d5b2a41..986fdad 100644 --- a/src/style.css +++ b/src/style.css @@ -252,7 +252,7 @@ section.two h2 { } .content-footer { - width: 50%; + width: 100%; display: flex; flex-direction: column; justify-content: center; @@ -264,11 +264,12 @@ section.two h2 { display: flex; justify-content: center; align-items: center; + margin: 11px; } -.content-logosRedessociais svg { - margin: 1%; - width: 3%; +.content-logosRedessociais a { + margin: 10px; + width: 2%; } .copy { @@ -281,12 +282,18 @@ section.two h2 { .copy p { color: #fff; font-size: 11px; + text-align: center; } @media only screen and (max-width: 414px){ .imagePrincipal, .content-imageSecondFooter { display: none; } + + .content-logosRedessociais a { + margin: 5px; + width: 5%; + } } @media only screen and (min-width: 415px){ @@ -301,11 +308,15 @@ section.two h2 { @media only screen and (max-width: 1024px){ h1 { - font-size: 2rem; + font-size: 1.8rem; } h2 { - font-size: 1.4rem; + font-size: 1.1rem; + } + + p { + font-size: 0.8rem; } .imagePrincipal-mobile { @@ -337,7 +348,7 @@ section.two h2 { section.one p, section.two p { text-align: center; - font-size: 1.1rem; + font-size: 0.8rem; } .content-imageSecond {