diff --git a/src/components/Footer/FooterBottom/FooterBottom.tsx b/src/components/Footer/FooterBottom/FooterBottom.tsx index db20885..8ed8d50 100644 --- a/src/components/Footer/FooterBottom/FooterBottom.tsx +++ b/src/components/Footer/FooterBottom/FooterBottom.tsx @@ -65,19 +65,23 @@ export default function FooterBottom() { diff --git a/src/components/Footer/FooterBottom/footerBottom.module.scss b/src/components/Footer/FooterBottom/footerBottom.module.scss index 69ce8b8..c3f0ffc 100644 --- a/src/components/Footer/FooterBottom/footerBottom.module.scss +++ b/src/components/Footer/FooterBottom/footerBottom.module.scss @@ -36,6 +36,7 @@ width: 100%; img { width: 36px; + height: 20px; } } } @@ -58,6 +59,7 @@ .vtexIcon { width: 54.61px; + height: 34px; } } } @@ -80,6 +82,12 @@ line-height: 12px; } + li a { + height: 16px; + display: flex; + align-items: center; + } + .logoVtexFooter { width: 44.92px; height: 16px; @@ -163,34 +171,35 @@ grid-area: address; width: 100%; max-width: 258px; - max-height: 12px; - line-height: 12px; - - p { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - } } .footerPayments { grid-area: payments; max-width: 344px; width: auto; + } + .containerDevelop { + grid-area: develop; + } + } +} + +@media screen and (max-width: 430px) { + .containerFooterBottom { + .footerPayments { .footerPaymentsWrapper { div { gap: 11px; img { - width: 30.27px; - height: 16.97px; + width: 30px; + height: 17px; } } } .divider { - height: 20.36px; - margin: 0 10px; + height: 20px; } .footerPaymentsWrapperVtex { @@ -202,10 +211,6 @@ } } } - - .containerDevelop { - grid-area: develop; - } } } diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx index e6b534b..87b360d 100644 --- a/src/components/Header/Header.tsx +++ b/src/components/Header/Header.tsx @@ -16,11 +16,15 @@ export default function Header() { <>
-
+
+ - diff --git a/src/components/Header/header.module.scss b/src/components/Header/header.module.scss index b47946b..3a671a7 100644 --- a/src/components/Header/header.module.scss +++ b/src/components/Header/header.module.scss @@ -8,6 +8,7 @@ .menuToggle { display: none; + background: transparent; } .logo { @@ -51,7 +52,7 @@ button { background: transparent; - height: auto; + height: 18px; padding-right: 16px; img { @@ -108,7 +109,7 @@ button { background: transparent; - height: auto; + height: 35.5px; padding-right: 11px; img { diff --git a/src/index.tsx b/src/index.tsx index 9f87c9c..ce8d748 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,6 +1,6 @@ import React from "react"; import ReactDOM from "react-dom/client"; -import "./global.scss"; +import "./styles/global.scss"; import Home from "./pages/Home"; const root = ReactDOM.createRoot( diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index 24da6f2..c485728 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -29,19 +29,21 @@ function Home() {
diff --git a/src/pages/home.module.scss b/src/pages/home.module.scss index f5c2bd2..dfe941a 100644 --- a/src/pages/home.module.scss +++ b/src/pages/home.module.scss @@ -3,8 +3,8 @@ .floatElementsFooter { position: fixed; - right: 20px; - bottom: 21px; + right: 16px; + bottom: 28px; width: 2.6562%; @@ -14,15 +14,13 @@ .whatsappIcon, .topoSiteIcon { width: 100%; + background: transparent; + cursor: pointer; } .topoSiteIcon { - button { - background: transparent; - cursor: pointer; - img { - width: 100%; - } + img { + width: 100%; } } } @@ -35,12 +33,3 @@ } } } - -@media screen and (max-width: 540px) { - .containerHome { - .floatElementsFooter { - right: 16px; - bottom: 16px; - } - } -} diff --git a/src/global.scss b/src/styles/global.scss similarity index 93% rename from src/global.scss rename to src/styles/global.scss index d6779d1..f677956 100644 --- a/src/global.scss +++ b/src/styles/global.scss @@ -30,7 +30,3 @@ code { a { color: inherit; } - -.active { - display: block; -}