From 574fe255f1d52af0aaee02e611cd6002304b943e Mon Sep 17 00:00:00 2001 From: Thiago Bronisio <86695254+ThiagoBronisio@users.noreply.github.com> Date: Sat, 7 Jan 2023 18:42:37 -0300 Subject: [PATCH] =?UTF-8?q?feat:=20refatora=C3=A7=C3=A3o=20de=20componente?= =?UTF-8?q?s?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 66 ++++++++++++ package.json | 1 + .../Footer/FooterSelosDev/FooterSelosDev.tsx | 20 ++-- .../assets}/american-express.svg | 0 .../Footer/FooterSelosDev/assets}/boleto.svg | 0 .../Footer/FooterSelosDev/assets}/elo.svg | 0 .../Footer/FooterSelosDev/assets}/hiper.svg | 0 .../Footer/FooterSelosDev/assets}/m3.svg | 0 .../Footer/FooterSelosDev/assets}/master.svg | 0 .../Footer/FooterSelosDev/assets}/paypal.svg | 0 .../Footer/FooterSelosDev/assets}/visa.svg | 0 .../FooterSelosDev/assets}/vtex-dev.svg | 0 .../Footer/FooterSelosDev/assets}/vtex.svg | 0 .../Footer/LinksFooter/Links/Link.tsx | 15 +++ .../Footer/LinksFooter/LinksFooter.tsx | 94 +++++++++--------- .../Footer/LinksFooter/NetWorks/NetWork.tsx | 25 +++++ .../Footer/LinksFooter/Titles/Title.tsx | 28 ++++++ .../Footer/LinksFooter/assets}/facebook.svg | 0 .../Footer/LinksFooter/assets}/instagram.svg | 0 .../Footer/LinksFooter/assets}/linkedlin.svg | 0 .../Footer/LinksFooter/assets}/titleLinks.svg | 0 .../Footer/LinksFooter/assets}/twitter.svg | 0 .../Footer/LinksFooter/assets}/youtube.svg | 0 .../Footer/Newsletter/Newsletter.tsx | 2 +- src/components/Header/Header.module.scss | 56 ++++++++++- src/components/Header/Header.tsx | 14 +-- .../InputMenuMobile/InputMenuMobile.tsx | 6 +- .../inputMenuMobile.module.scss | 2 +- .../Header/MenuHamburguer/MenuHamburguer.tsx | 4 +- .../img => components/Header/assets}/cart.svg | 0 .../Header/assets}/close.svg | 0 .../Header/assets}/hamburguer.svg | 0 .../Header/assets}/logo-m3.png | Bin .../Header/assets}/search.svg | 0 src/global.scss | 13 --- src/index.tsx | 1 + src/variables.scss | 13 +++ 37 files changed, 273 insertions(+), 87 deletions(-) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/american-express.svg (100%) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/boleto.svg (100%) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/elo.svg (100%) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/hiper.svg (100%) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/m3.svg (100%) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/master.svg (100%) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/paypal.svg (100%) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/visa.svg (100%) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/vtex-dev.svg (100%) rename src/{assets/img => components/Footer/FooterSelosDev/assets}/vtex.svg (100%) create mode 100644 src/components/Footer/LinksFooter/Links/Link.tsx create mode 100644 src/components/Footer/LinksFooter/NetWorks/NetWork.tsx create mode 100644 src/components/Footer/LinksFooter/Titles/Title.tsx rename src/{assets/img => components/Footer/LinksFooter/assets}/facebook.svg (100%) rename src/{assets/img => components/Footer/LinksFooter/assets}/instagram.svg (100%) rename src/{assets/img => components/Footer/LinksFooter/assets}/linkedlin.svg (100%) rename src/{assets/img => components/Footer/LinksFooter/assets}/titleLinks.svg (100%) rename src/{assets/img => components/Footer/LinksFooter/assets}/twitter.svg (100%) rename src/{assets/img => components/Footer/LinksFooter/assets}/youtube.svg (100%) rename src/{assets/img => components/Header/assets}/cart.svg (100%) rename src/{assets/img => components/Header/assets}/close.svg (100%) rename src/{assets/img => components/Header/assets}/hamburguer.svg (100%) rename src/{assets/img => components/Header/assets}/logo-m3.png (100%) rename src/{assets/img => components/Header/assets}/search.svg (100%) create mode 100644 src/variables.scss diff --git a/package-lock.json b/package-lock.json index 69342a3..14ee22f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,6 +19,7 @@ "node-sass": "^7.0.3", "react": "^18.2.0", "react-dom": "^18.2.0", + "react-modal": "^3.16.1", "react-scripts": "5.0.1", "typescript": "^4.9.4", "web-vitals": "^2.1.4", @@ -7816,6 +7817,11 @@ "url": "https://github.com/sindresorhus/execa?sponsor=1" } }, + "node_modules/exenv": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz", + "integrity": "sha512-Z+ktTxTwv9ILfgKCk32OX3n/doe+OcLTRtqK9pcL+JsP3J1/VW8Uvl4ZjLlKqeW4rzK4oesDOGMEMRIZqtP4Iw==" + }, "node_modules/exit": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/exit/-/exit-0.1.2.tgz", @@ -15077,6 +15083,29 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, + "node_modules/react-lifecycles-compat": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", + "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" + }, + "node_modules/react-modal": { + "version": "3.16.1", + "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.16.1.tgz", + "integrity": "sha512-VStHgI3BVcGo7OXczvnJN7yT2TWHJPDXZWyI/a0ssFNhGZWsPmB8cF0z33ewDXq4VfYMO1vXgiv/g8Nj9NDyWg==", + "dependencies": { + "exenv": "^1.2.0", + "prop-types": "^15.7.2", + "react-lifecycles-compat": "^3.0.0", + "warning": "^4.0.3" + }, + "engines": { + "node": ">=8" + }, + "peerDependencies": { + "react": "^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18", + "react-dom": "^0.14.0 || ^15.0.0 || ^16 || ^17 || ^18" + } + }, "node_modules/react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", @@ -17528,6 +17557,14 @@ "makeerror": "1.0.12" } }, + "node_modules/warning": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", + "dependencies": { + "loose-envify": "^1.0.0" + } + }, "node_modules/watchpack": { "version": "2.4.0", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz", @@ -24042,6 +24079,11 @@ "strip-final-newline": "^2.0.0" } }, + "exenv": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz", + "integrity": "sha512-Z+ktTxTwv9ILfgKCk32OX3n/doe+OcLTRtqK9pcL+JsP3J1/VW8Uvl4ZjLlKqeW4rzK4oesDOGMEMRIZqtP4Iw==" + }, "exit": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/exit/-/exit-0.1.2.tgz", @@ -29161,6 +29203,22 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==" }, + "react-lifecycles-compat": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", + "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" + }, + "react-modal": { + "version": "3.16.1", + "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.16.1.tgz", + "integrity": "sha512-VStHgI3BVcGo7OXczvnJN7yT2TWHJPDXZWyI/a0ssFNhGZWsPmB8cF0z33ewDXq4VfYMO1vXgiv/g8Nj9NDyWg==", + "requires": { + "exenv": "^1.2.0", + "prop-types": "^15.7.2", + "react-lifecycles-compat": "^3.0.0", + "warning": "^4.0.3" + } + }, "react-refresh": { "version": "0.11.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz", @@ -31008,6 +31066,14 @@ "makeerror": "1.0.12" } }, + "warning": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/warning/-/warning-4.0.3.tgz", + "integrity": "sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==", + "requires": { + "loose-envify": "^1.0.0" + } + }, "watchpack": { "version": "2.4.0", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.4.0.tgz", diff --git a/package.json b/package.json index 07ce9c2..f025231 100644 --- a/package.json +++ b/package.json @@ -14,6 +14,7 @@ "node-sass": "^7.0.3", "react": "^18.2.0", "react-dom": "^18.2.0", + "react-modal": "^3.16.1", "react-scripts": "5.0.1", "typescript": "^4.9.4", "web-vitals": "^2.1.4", diff --git a/src/components/Footer/FooterSelosDev/FooterSelosDev.tsx b/src/components/Footer/FooterSelosDev/FooterSelosDev.tsx index 18d8671..60647f6 100644 --- a/src/components/Footer/FooterSelosDev/FooterSelosDev.tsx +++ b/src/components/Footer/FooterSelosDev/FooterSelosDev.tsx @@ -1,17 +1,17 @@ import React from "react" import styleSelosDev from "./FooterSelosDev.module.scss" -import masterCard from "../../../assets/img/master.svg" -import visaCard from "../../../assets/img/visa.svg" -import americanCard from "../../../assets/img/american-express.svg" -import eloCard from "../../../assets/img/elo.svg" -import hiperCard from "../../../assets/img/hiper.svg" -import paypalCard from "../../../assets/img/paypal.svg" -import boletoCard from "../../../assets/img/boleto.svg" -import vtexCertifiedCard from "../../../assets/img/vtex.svg" +import masterCard from "./assets/master.svg" +import visaCard from "./assets/visa.svg" +import americanCard from "./assets/american-express.svg" +import eloCard from "./assets/elo.svg" +import hiperCard from "./assets/hiper.svg" +import paypalCard from "./assets/paypal.svg" +import boletoCard from "./assets/boleto.svg" +import vtexCertifiedCard from "./assets/vtex.svg" -import vtexDev from "../../../assets/img/vtex-dev.svg" -import m3 from "../../../assets/img/m3.svg" +import vtexDev from "./assets/vtex-dev.svg" +import m3 from "./assets/m3.svg" export const FooterSelosDev = () => { diff --git a/src/assets/img/american-express.svg b/src/components/Footer/FooterSelosDev/assets/american-express.svg similarity index 100% rename from src/assets/img/american-express.svg rename to src/components/Footer/FooterSelosDev/assets/american-express.svg diff --git a/src/assets/img/boleto.svg b/src/components/Footer/FooterSelosDev/assets/boleto.svg similarity index 100% rename from src/assets/img/boleto.svg rename to src/components/Footer/FooterSelosDev/assets/boleto.svg diff --git a/src/assets/img/elo.svg b/src/components/Footer/FooterSelosDev/assets/elo.svg similarity index 100% rename from src/assets/img/elo.svg rename to src/components/Footer/FooterSelosDev/assets/elo.svg diff --git a/src/assets/img/hiper.svg b/src/components/Footer/FooterSelosDev/assets/hiper.svg similarity index 100% rename from src/assets/img/hiper.svg rename to src/components/Footer/FooterSelosDev/assets/hiper.svg diff --git a/src/assets/img/m3.svg b/src/components/Footer/FooterSelosDev/assets/m3.svg similarity index 100% rename from src/assets/img/m3.svg rename to src/components/Footer/FooterSelosDev/assets/m3.svg diff --git a/src/assets/img/master.svg b/src/components/Footer/FooterSelosDev/assets/master.svg similarity index 100% rename from src/assets/img/master.svg rename to src/components/Footer/FooterSelosDev/assets/master.svg diff --git a/src/assets/img/paypal.svg b/src/components/Footer/FooterSelosDev/assets/paypal.svg similarity index 100% rename from src/assets/img/paypal.svg rename to src/components/Footer/FooterSelosDev/assets/paypal.svg diff --git a/src/assets/img/visa.svg b/src/components/Footer/FooterSelosDev/assets/visa.svg similarity index 100% rename from src/assets/img/visa.svg rename to src/components/Footer/FooterSelosDev/assets/visa.svg diff --git a/src/assets/img/vtex-dev.svg b/src/components/Footer/FooterSelosDev/assets/vtex-dev.svg similarity index 100% rename from src/assets/img/vtex-dev.svg rename to src/components/Footer/FooterSelosDev/assets/vtex-dev.svg diff --git a/src/assets/img/vtex.svg b/src/components/Footer/FooterSelosDev/assets/vtex.svg similarity index 100% rename from src/assets/img/vtex.svg rename to src/components/Footer/FooterSelosDev/assets/vtex.svg diff --git a/src/components/Footer/LinksFooter/Links/Link.tsx b/src/components/Footer/LinksFooter/Links/Link.tsx new file mode 100644 index 0000000..594d4d8 --- /dev/null +++ b/src/components/Footer/LinksFooter/Links/Link.tsx @@ -0,0 +1,15 @@ +import React from "react"; + +interface linkProps { + text: string; + href: string; +} + +export const Link = (props: linkProps) => { + + const { href, text } = props; + + return