From b3e4ed6e4a86dbe48488511153496bc42e8f9d4d Mon Sep 17 00:00:00 2001 From: Matheus Date: Fri, 20 Jan 2023 21:50:17 -0300 Subject: [PATCH] =?UTF-8?q?feat:=20constru=C3=A7=C3=A3o=20do=20footer=20to?= =?UTF-8?q?p?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/svg/facebook.svg | 16 ++++++ src/assets/svg/instagram.svg | 18 +++++++ src/assets/svg/linkdin.svg | 18 +++++++ src/assets/svg/twitter.svg | 11 ++++ src/assets/svg/youtube.svg | 11 ++++ src/components/Footer/footer.module.scss | 68 ++++++++++++++++++++++++ src/components/Footer/footer.tsx | 48 +++++++++++++++++ src/components/Main/formschema.ts | 2 +- src/components/Main/mainFormik.tsx | 2 +- 9 files changed, 192 insertions(+), 2 deletions(-) create mode 100644 src/assets/svg/facebook.svg create mode 100644 src/assets/svg/instagram.svg create mode 100644 src/assets/svg/linkdin.svg create mode 100644 src/assets/svg/twitter.svg create mode 100644 src/assets/svg/youtube.svg diff --git a/src/assets/svg/facebook.svg b/src/assets/svg/facebook.svg new file mode 100644 index 0000000..31e1f49 --- /dev/null +++ b/src/assets/svg/facebook.svg @@ -0,0 +1,16 @@ + + + + + + + + + + + + + + + + diff --git a/src/assets/svg/instagram.svg b/src/assets/svg/instagram.svg new file mode 100644 index 0000000..0165d82 --- /dev/null +++ b/src/assets/svg/instagram.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/assets/svg/linkdin.svg b/src/assets/svg/linkdin.svg new file mode 100644 index 0000000..793ce16 --- /dev/null +++ b/src/assets/svg/linkdin.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/assets/svg/twitter.svg b/src/assets/svg/twitter.svg new file mode 100644 index 0000000..b0a1997 --- /dev/null +++ b/src/assets/svg/twitter.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/svg/youtube.svg b/src/assets/svg/youtube.svg new file mode 100644 index 0000000..4ccec95 --- /dev/null +++ b/src/assets/svg/youtube.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/components/Footer/footer.module.scss b/src/components/Footer/footer.module.scss index d9fc5e7..0a4df0b 100644 --- a/src/components/Footer/footer.module.scss +++ b/src/components/Footer/footer.module.scss @@ -63,4 +63,72 @@ } } } + .conteiner-footer-top{ + padding: 50px 100px; + display: flex; + justify-content: space-between; + + .footer-top-menu-list{ + display: flex; + justify-content: space-between; + flex-direction: row; + width: 65.462963%; + + .footer-top-div{ + width: 21.9236209%; + + .footer-top-title{ + font-family: 'Roboto'; + font-style: normal; + font-weight: 500; + font-size: 14px; + line-height: 16px; + text-transform: uppercase; + color: #303030; + + } + .footer-top-ul{ + list-style: none; + + .footer-top-li{ + margin-top: 12px; + font-family: 'Roboto'; + font-weight: 400; + font-size: 12px; + line-height: 14px; + text-transform: capitalize; + color: #303030; + } + .footer-top-bold{ + font-weight: 500; + } + .footer-top-underline{ + text-decoration: underline; + } + } + } + } + + .footer-top-rede{ + height: 63px; + .footer-top-rede-conteiner{ + margin-bottom: 10px; + height: 35px; + + .footer-top-rede-img{ + margin-left: 10px; + width: 35px; + height: 35px; + } + } + .footer-top-rede-span{ + margin-left: 10px; + font-family: 'Roboto'; + font-weight: 400; + font-size: 14px; + line-height: 16px; + color: #303030; + } + } + } } \ No newline at end of file diff --git a/src/components/Footer/footer.tsx b/src/components/Footer/footer.tsx index f49ac64..c587961 100644 --- a/src/components/Footer/footer.tsx +++ b/src/components/Footer/footer.tsx @@ -1,5 +1,12 @@ import React from 'react'; +import face from '../../assets/svg/facebook.svg' +import insta from '../../assets/svg/instagram.svg' +import linkd from '../../assets/svg/linkdin.svg' +import twitter from '../../assets/svg/twitter.svg' +import youtube from '../../assets/svg/youtube.svg' + + import styles from './footer.module.scss'; import { NewsLetter } from './footerNewsLetter'; @@ -7,6 +14,47 @@ const Footer = () => { return (
< NewsLetter /> +
+
+
+
Institucional
+
    +
  • Quem Somos
    • +
  • Política de Privacidade
    • +
  • Segurança
    • +
  • Seja um Revendedor
    • +
+
+
+
DÚVIDAS
+
    +
  • Entrega
    • +
  • Pagamento
    • +
  • Trocas e Devoluções
    • +
  • Dúvidas Frequentes
    • +
+
+
+
FALE CONOSCO
+
    +
  • Atendimento ao Consumidor
    • +
  • (11) 4159-9504
    • +
  • Atendimento Online
    • +
  • (11) 99433-8825
    • +
+
+
+
+
+ logo do facebook + logo do instagram + logo do likedin + logo do twitter + logo do youtube +
+ www.loremipsum.com +
+
) } diff --git a/src/components/Main/formschema.ts b/src/components/Main/formschema.ts index 060a3b1..2733019 100644 --- a/src/components/Main/formschema.ts +++ b/src/components/Main/formschema.ts @@ -1,4 +1,4 @@ -import { type } from "os"; + import * as Yup from "yup" export default Yup.object().shape({ diff --git a/src/components/Main/mainFormik.tsx b/src/components/Main/mainFormik.tsx index f28351e..ee547c6 100644 --- a/src/components/Main/mainFormik.tsx +++ b/src/components/Main/mainFormik.tsx @@ -4,7 +4,7 @@ import styles from './main.module.scss'; import formschema from './formschema'; -import {Formik, Form, Field, ErrorMessage, FormikHelpers} from 'formik'; +import {Formik, Form, Field, ErrorMessage} from 'formik'; interface IformikValues { nome: string;