diff --git a/src/assets/icons/check.svg b/src/assets/icons/check.svg index 6f0e734..55c02f0 100644 --- a/src/assets/icons/check.svg +++ b/src/assets/icons/check.svg @@ -1,4 +1,4 @@ - - - + + + diff --git a/src/assets/icons/package.svg b/src/assets/icons/package.svg index 50f570a..06215bd 100644 --- a/src/assets/icons/package.svg +++ b/src/assets/icons/package.svg @@ -1,3 +1,3 @@ - - + + diff --git a/src/assets/icons/transactions.svg b/src/assets/icons/transactions.svg index 0eb5dc3..4e12c2f 100644 --- a/src/assets/icons/transactions.svg +++ b/src/assets/icons/transactions.svg @@ -1,3 +1,3 @@ - - + + diff --git a/src/assets/icons/user.svg b/src/assets/icons/user.svg index a895504..190572a 100644 --- a/src/assets/icons/user.svg +++ b/src/assets/icons/user.svg @@ -1,4 +1,4 @@ - - - + + + diff --git a/src/pages/dashboard/ModalUser/index.tsx b/src/pages/dashboard/ModalUser/index.tsx index a3a934b..b49343c 100644 --- a/src/pages/dashboard/ModalUser/index.tsx +++ b/src/pages/dashboard/ModalUser/index.tsx @@ -17,19 +17,20 @@ import { PurchaseTab } from "./PurchaseTab"; import { TransactionsTab } from "./TransactionsTab"; import { VerificationTab } from "./VerificationTab"; -import userIcon from "@root/assets/icons/user.svg"; -import packageIcon from "@root/assets/icons/package.svg"; -import transactionsIcon from "@root/assets/icons/transactions.svg"; -import checkIcon from "@root/assets/icons/check.svg"; +import { ReactComponent as UserIcon } from "@root/assets/icons/user.svg"; +import { ReactComponent as PackageIcon } from "@root/assets/icons/package.svg"; +import { ReactComponent as TransactionsIcon } from "@root/assets/icons/transactions.svg"; +import { ReactComponent as CheckIcon } from "@root/assets/icons/check.svg"; + import forwardIcon from "@root/assets/icons/forward.svg"; import type { SyntheticEvent } from "react"; const TABS = [ - { name: "Пользователь", icon: userIcon }, - { name: "Покупка товаров и услуг", icon: packageIcon }, - { name: "Транзакции", icon: transactionsIcon }, - { name: "Верификация", icon: checkIcon }, + { name: "Пользователь", icon: UserIcon }, + { name: "Покупка товаров и услуг", icon: PackageIcon }, + { name: "Транзакции", icon: TransactionsIcon }, + { name: "Верификация", icon: CheckIcon }, ]; const ModalUser = () => { @@ -127,9 +128,9 @@ const ModalUser = () => { }} TabIndicatorProps={{ style: { background: "transparent" } }} > - {TABS.map(({ name, icon }) => ( + {TABS.map(({ name, icon: Icon }) => ( } + icon={} iconPosition="start" key={name} label={mobile ? (openNavigation ? name : "") : name} @@ -144,10 +145,12 @@ const ModalUser = () => { color: theme.palette.common.black, whiteSpace: "nowrap", lineHeight: "18px", + transition: ".2s", "&.MuiButtonBase-root.Mui-selected": { borderRadius: "12px", color: "#7E2AEA", background: "rgba(126, 42, 234, 0.07)", + "& svg": { stroke: "#7E2AEA" }, }, }} />