anacarolinaduartecavalcante/challenge-vtex-io-ana-carolina-duarte-cavalcante
1
0
Fork 0
forked from M3-Academy/challenge-vtex-io
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor(PaymentMethods.tsx): substituindo classes por Css Modules

Browse Source
This commit is contained in:
Ana Carolina Duarte Cavalcante 2023-02-07 07:52:03 -03:00
parent 211fe5c464
commit 6610014992
1 changed files with 14 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
react/components/PaymentMethods/PaymentMethods.tsx
View File

@ -1,65 +1,66 @@
import React from "react"; import React from "react";
import styles from "./styles.css";
const PaymentMethods = () => { const PaymentMethods = () => {
return ( return (
<div className="vtex-menu-2-x-FooterRightBlock"> <div className={styles.FooterRightBlock}>
<span className="vtex-menu-2-x-SpanTitleBig">Formas de pagamento</span> <span className={styles.SpanTitleBig}>Formas de pagamento</span>
<ul className="vtex-menu-2-x-UlGroup"> <ul className={styles.UlGroup}>
<ul className="vtex-menu-2-x-UlSecondary"> <ul className={styles.UlSecondary}>
<li> <li>
<img <img
className="vtex-menu-2-x-ImgCard" className={styles.ImgCard}
src="https://agenciamagma.vteximg.com.br/arquivos/mastercard-icon-m3academy-anacarolinaduartecavalcante.svg" src="https://agenciamagma.vteximg.com.br/arquivos/mastercard-icon-m3academy-anacarolinaduartecavalcante.svg"
alt="ícone mastercard" alt="ícone mastercard"
/> />
</li> </li>
<li> <li>
<img <img
className="vtex-menu-2-x-ImgCard" className={styles.ImgCard}
src="https://agenciamagma.vteximg.com.br/arquivos/diners-icon-m3academy-anacarolinaduartecavalcante.svg" src="https://agenciamagma.vteximg.com.br/arquivos/diners-icon-m3academy-anacarolinaduartecavalcante.svg"
alt="ícone diners" alt="ícone diners"
/> />
</li> </li>
<li> <li>
<img <img
className="vtex-menu-2-x-ImgCard" className={styles.ImgCard}
src="https://agenciamagma.vteximg.com.br/arquivos/boleto-icon-m3academy-anacarolinaduartecavalcante.svg" src="https://agenciamagma.vteximg.com.br/arquivos/boleto-icon-m3academy-anacarolinaduartecavalcante.svg"
alt="ícone boleto" alt="ícone boleto"
/> />
</li> </li>
<li> <li>
<img <img
className="vtex-menu-2-x-ImgCard" className={styles.ImgCard}
src="https://agenciamagma.vteximg.com.br/arquivos/pix-icon-m3academy-anacarolinaduartecavalcante.svg" src="https://agenciamagma.vteximg.com.br/arquivos/pix-icon-m3academy-anacarolinaduartecavalcante.svg"
alt="ícone pix" alt="ícone pix"
/> />
</li> </li>
</ul> </ul>
<ul className="vtex-menu-2-x-UlSecondary"> <ul className={styles.UlSecondary}>
<li> <li>
<img <img
className="vtex-menu-2-x-ImgCard" className={styles.ImgCard}
src="https://agenciamagma.vteximg.com.br/arquivos/elo-icon-m3academy-anacarolinaduartecavalcante.svg" src="https://agenciamagma.vteximg.com.br/arquivos/elo-icon-m3academy-anacarolinaduartecavalcante.svg"
alt="ícone elo" alt="ícone elo"
/> />
</li> </li>
<li> <li>
<img <img
className="vtex-menu-2-x-ImgCard" className={styles.ImgCard}
src="https://agenciamagma.vteximg.com.br/arquivos/hipercard-icon-m3academy-anacarolinaduartecavalcante.svg" src="https://agenciamagma.vteximg.com.br/arquivos/hipercard-icon-m3academy-anacarolinaduartecavalcante.svg"
alt="ícone hipercard" alt="ícone hipercard"
/> />
</li> </li>
<li> <li>
<img <img
className="vtex-menu-2-x-ImgCard" className={styles.ImgCard}
src="https://agenciamagma.vteximg.com.br/arquivos/visa-icon-m3academy-anacarolinaduartecavalcante.svg" src="https://agenciamagma.vteximg.com.br/arquivos/visa-icon-m3academy-anacarolinaduartecavalcante.svg"
alt="ícone visa" alt="ícone visa"
/> />
</li> </li>
<li> <li>
<img <img
className="vtex-menu-2-x-ImgCard" className={styles.ImgCard}
src="https://agenciamagma.vteximg.com.br/arquivos/amex-icon-m3academy-anacarolinaduartecavalcante.svg" src="https://agenciamagma.vteximg.com.br/arquivos/amex-icon-m3academy-anacarolinaduartecavalcante.svg"
alt="ícone amex" alt="ícone amex"
/> />