diff --git a/src/components/footer/footer.module.scss b/src/components/footer/footer.module.scss index ebcad54..7d007cd 100644 --- a/src/components/footer/footer.module.scss +++ b/src/components/footer/footer.module.scss @@ -64,6 +64,10 @@ justify-content: center; align-items: center; + @media (max-width: 375px) { + gap: 11px; + } + .Pci { @media (min-width: 280px) and (max-width: 1150px) { height: 28px; diff --git a/src/components/info-agencia/info-agencia.module.scss b/src/components/info-agencia/info-agencia.module.scss index c923f24..d870e6b 100644 --- a/src/components/info-agencia/info-agencia.module.scss +++ b/src/components/info-agencia/info-agencia.module.scss @@ -1,48 +1,93 @@ -.infoAgenciaContainer { +.infoAgencia { width: 100%; - height: 239px; display: flex; -} + align-items: center; -.infoAgenciaUl { - display: flex; - gap: 121px; - padding: 50px 100px; -} + .infoAgenciaContainer { + width: 100%; + max-width: 100%; -.socialIcons { - width: 35px; - height: 35px; -} + .infoAgenciaMainContainer { + display: flex; + justify-content: space-between; + margin: 50px 100px; + height: 139px; -.ulStyle { - display: flex; - flex-direction: column; - gap: 12px; - width: 155px; - list-style: none; - padding: 0; - margin: 0; - font-style: normal; - font-weight: 400; - font-size: 12px; - color: #303030; -} + @media (min-width: 2500px) { + height: 197px; + } -.infoAgenciaName { - font-style: normal; - font-weight: 500; - font-size: 14px; - color: #303030; -} + .institucionalInfosContainer { + width: 703px; + display: flex; + gap: 121px; -.socialMediaContainer { - display: flex; - flex-direction: column; - padding: 50px; -} + @media (min-width: 2500px) { + gap: 293px; + width: 1531px; + } -.socialMediaIconsContainer { - display: flex; - gap: 10px; + .institucionalInfosUl { + display: flex; + flex-direction: column; + gap: 12px; + width: 155px; + list-style: none; + padding: 0; + margin: 0; + font-style: normal; + font-weight: 400; + font-size: 12px; + color: #303030; + + @media (min-width: 2500px) { + font-size: 24px; + width: 315px; + gap: 10px; + } + } + .infoAgenciaName { + font-style: normal; + font-weight: 500; + font-size: 14px; + color: #303030; + + @media (min-width: 2500px) { + font-size: 28px; + } + } + } + } + .socialMedia { + display: flex; + flex-direction: column; + + & span { + font-family: "Roboto"; + font-style: normal; + font-weight: 400; + font-size: 14px; + color: #303030; + + @media (min-width: 2500px) { + font-size: 28px; + } + } + + .socialMediaIconsContainer { + display: flex; + gap: 10px; + + .socialIcons { + width: 35px; + height: 35px; + + @media (min-width: 2500px) { + width: 70px; + height: 70px; + } + } + } + } + } } diff --git a/src/components/info-agencia/info-agencia.tsx b/src/components/info-agencia/info-agencia.tsx index be9315e..7b07615 100644 --- a/src/components/info-agencia/info-agencia.tsx +++ b/src/components/info-agencia/info-agencia.tsx @@ -8,57 +8,58 @@ import youtube from "./assets/youtube.png"; export function InfoAgencia() { return ( -
-
- - - -
-
-
- - {" "} - - - - {" "} - - - - {" "} - - - - {" "} - - - - {" "} - - +
+
+
+
+
    +
  • INSTITUCIONAL
  • +
  • Quem somos
  • +
  • Política de Privacidade
  • +
  • Segurança
  • +
  • Seja um Revendedor
  • +
+
    +
  • DÚVIDAS
  • +
  • Entrega
  • +
  • Pagamento
  • +
  • Trocas e Devoluções
  • +
  • Dúvidas Frequentes
  • +
+
    +
  • INSTITUCIONAL
  • +
  • Atendimento ao Consumidor
  • +
  • Política de privacidade
  • +
  • Segurança
  • +
  • Seja um revendedor
  • +
+
+
- www.loremipsum.com - {/*
- -
*/}
); diff --git a/src/components/main/main-content.tsx b/src/components/main/main-content.tsx index 7b4e66d..36083e2 100644 --- a/src/components/main/main-content.tsx +++ b/src/components/main/main-content.tsx @@ -31,7 +31,7 @@ export function MainContent() { }, { name: "Contato", content: }, ]; - const [content, setContent] = useState(arr[2].content); + const [content, setContent] = useState(arr[0].content); return (