From 4a929edc493067669b123b60de9ec3a909b067fd Mon Sep 17 00:00:00 2001
From: devartes <anacavalcante731@gmail.com>
Date: Wed, 11 Jan 2023 15:43:43 -0300
Subject: [PATCH] refactor(footer): trocando imagens de lugar e usando
 componente Icon no Footer Bottom

---
 src/components/Footer/FooterBottom.tsx        | 50 +++++++++++--------
 .../Footer/assets/icons}/Boleto.svg           |  0
 .../Footer/assets/icons}/Diners.svg           |  0
 .../Footer/assets/icons}/Elo.svg              |  0
 .../Footer/assets/icons}/Hiper.svg            |  0
 .../Footer/assets/icons}/Master.svg           |  0
 .../Footer/assets/icons}/Pagseguro.svg        |  0
 .../Footer/assets/icons}/Visa.svg             |  0
 .../Footer/assets/icons}/m3.svg               |  0
 .../Footer/assets/icons}/vtex-pci-200.svg     |  0
 .../Footer/assets/icons}/vtex.svg             |  0
 11 files changed, 29 insertions(+), 21 deletions(-)
 rename src/{assets/imgs => components/Footer/assets/icons}/Boleto.svg (100%)
 rename src/{assets/imgs => components/Footer/assets/icons}/Diners.svg (100%)
 rename src/{assets/imgs => components/Footer/assets/icons}/Elo.svg (100%)
 rename src/{assets/imgs => components/Footer/assets/icons}/Hiper.svg (100%)
 rename src/{assets/imgs => components/Footer/assets/icons}/Master.svg (100%)
 rename src/{assets/imgs => components/Footer/assets/icons}/Pagseguro.svg (100%)
 rename src/{assets/imgs => components/Footer/assets/icons}/Visa.svg (100%)
 rename src/{assets/imgs => components/Footer/assets/icons}/m3.svg (100%)
 rename src/{assets/imgs => components/Footer/assets/icons}/vtex-pci-200.svg (100%)
 rename src/{assets/imgs => components/Footer/assets/icons}/vtex.svg (100%)

diff --git a/src/components/Footer/FooterBottom.tsx b/src/components/Footer/FooterBottom.tsx
index a5b33c0..85542b7 100644
--- a/src/components/Footer/FooterBottom.tsx
+++ b/src/components/Footer/FooterBottom.tsx
@@ -1,14 +1,15 @@
-import MasterCard from "../../assets/imgs/Master.svg";
-import Visa from "../../assets/imgs/Visa.svg";
-import Diners from "../../assets/imgs/Diners.svg";
-import Elo from "../../assets/imgs/Elo.svg";
-import HiperCard from "../../assets/imgs/Hiper.svg";
-import Pagseguro from "../../assets/imgs/Pagseguro.svg";
-import Boleto from "../../assets/imgs/Boleto.svg";
-import VtexPci from "../../assets/imgs/vtex-pci-200.svg";
-import M3 from "../../assets/imgs/m3.svg";
-import Vtex from "../../assets/imgs/vtex.svg"
+import MasterCard from "../../components/Footer/assets/icons/Master.svg";
+import Visa from "../../components/Footer/assets/icons/Visa.svg";
+import Diners from "../../components/Footer/assets/icons/Diners.svg";
+import Elo from "../../components/Footer/assets/icons/Elo.svg";
+import HiperCard from "../../components/Footer/assets/icons/Hiper.svg";
+import Pagseguro from "../../components/Footer/assets/icons/Pagseguro.svg";
+import Boleto from "../../components/Footer/assets/icons/Boleto.svg";
+import VtexPci from "../../components/Footer/assets/icons/vtex-pci-200.svg";
+import M3 from "../../components/Footer/assets/icons/m3.svg";
+import Vtex from "../../components/Footer/assets/icons/vtex.svg";
 import styles from "./Footer.module.scss";
+import { Icon } from "../ImageList/ImageList";
 
 const FooterBottom = () => {
   return (
@@ -18,19 +19,26 @@ const FooterBottom = () => {
         tempor
       </span>
       <ul className={styles["Metodos__de__Pagamento"]}>
-        <li className={styles["MasterCard"]}><img src={MasterCard} alt="ícone do cartão master card"/></li>
-        <li className={styles["Visa"]}><img src={Visa} alt="ícone do cartão visa"/></li>
-        <li className={styles["Diners"]}><img src={Diners} alt="ícone do cartão diners"/></li>
-        <li className={styles["Elo"]}><img src={Elo} alt="ícone do cartão elo"/></li>
-        <li className={styles["HiperCard"]}><img src={HiperCard} alt="ícone do cartão hipercard"/></li>
-        <li className={styles["Pagseguro"]}><img src={Pagseguro} alt="ícone do meio de pagamento pagseguro"/></li>
-        <li className={styles["Boleto"]}><img src={Boleto} alt="ícone do meio de pagamento boleto"/></li>
-        <li className={styles["Line"]}><span></span></li>
-        <li className={styles["VtexPci"]}><img src={VtexPci} alt="ícone do vtex pci"/></li>
+        <Icon src={MasterCard} className={styles["MasterCard"]} alt="ícone do cartão master card"/>
+        <Icon src={Visa} className={styles["Visa"]} alt="ícone do cartão visa"/>
+        <Icon src={Diners} className={styles["Diners"]} alt="ícone do cartão diners"/>
+        <Icon src={Elo} className={styles["Elo"]} alt="ícone do cartão elo"/>
+        <Icon src={HiperCard} className={styles["HiperCard"]} alt="ícone do cartão hipercard"/>
+        <Icon src={Pagseguro} className={styles["Pagseguro"]} alt="ícone do meio de pagamento pagseguro"/>
+        <Icon src={Boleto} className={styles["Boleto"]} alt="ícone do meio de pagamento boleto"/>
+        <li className={styles["Line"]}>
+          <span></span>
+        </li>
+        <Icon src={VtexPci} className={styles["VtexPci"]} alt="ícone do vtex pci"/>
       </ul>
       <ul className={styles["Autores"]}>
-        <li>Developed by <img src={Vtex} className={styles["Vtex"]} alt="ícone da Vtex"/></li>
-        <li>Powered by <img src={M3} className={styles["M3"]} alt="ícone do M3"/></li>
+        <li>
+          Developed by
+          <img src={Vtex} className={styles["Vtex"]} alt="ícone da Vtex" />
+        </li>
+        <li>
+          Powered by <img src={M3} className={styles["M3"]} alt="ícone do M3" />
+        </li>
       </ul>
     </>
   );
diff --git a/src/assets/imgs/Boleto.svg b/src/components/Footer/assets/icons/Boleto.svg
similarity index 100%
rename from src/assets/imgs/Boleto.svg
rename to src/components/Footer/assets/icons/Boleto.svg
diff --git a/src/assets/imgs/Diners.svg b/src/components/Footer/assets/icons/Diners.svg
similarity index 100%
rename from src/assets/imgs/Diners.svg
rename to src/components/Footer/assets/icons/Diners.svg
diff --git a/src/assets/imgs/Elo.svg b/src/components/Footer/assets/icons/Elo.svg
similarity index 100%
rename from src/assets/imgs/Elo.svg
rename to src/components/Footer/assets/icons/Elo.svg
diff --git a/src/assets/imgs/Hiper.svg b/src/components/Footer/assets/icons/Hiper.svg
similarity index 100%
rename from src/assets/imgs/Hiper.svg
rename to src/components/Footer/assets/icons/Hiper.svg
diff --git a/src/assets/imgs/Master.svg b/src/components/Footer/assets/icons/Master.svg
similarity index 100%
rename from src/assets/imgs/Master.svg
rename to src/components/Footer/assets/icons/Master.svg
diff --git a/src/assets/imgs/Pagseguro.svg b/src/components/Footer/assets/icons/Pagseguro.svg
similarity index 100%
rename from src/assets/imgs/Pagseguro.svg
rename to src/components/Footer/assets/icons/Pagseguro.svg
diff --git a/src/assets/imgs/Visa.svg b/src/components/Footer/assets/icons/Visa.svg
similarity index 100%
rename from src/assets/imgs/Visa.svg
rename to src/components/Footer/assets/icons/Visa.svg
diff --git a/src/assets/imgs/m3.svg b/src/components/Footer/assets/icons/m3.svg
similarity index 100%
rename from src/assets/imgs/m3.svg
rename to src/components/Footer/assets/icons/m3.svg
diff --git a/src/assets/imgs/vtex-pci-200.svg b/src/components/Footer/assets/icons/vtex-pci-200.svg
similarity index 100%
rename from src/assets/imgs/vtex-pci-200.svg
rename to src/components/Footer/assets/icons/vtex-pci-200.svg
diff --git a/src/assets/imgs/vtex.svg b/src/components/Footer/assets/icons/vtex.svg
similarity index 100%
rename from src/assets/imgs/vtex.svg
rename to src/components/Footer/assets/icons/vtex.svg