diff --git a/public/images/sort-asc.svg b/public/images/sort-asc.svg deleted file mode 100644 index 14ac909a..00000000 --- a/public/images/sort-asc.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/images/sort-desc.svg b/public/images/sort-desc.svg deleted file mode 100644 index 965f6643..00000000 --- a/public/images/sort-desc.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/public/images/sort-none.svg b/public/images/sort-none.svg deleted file mode 100644 index c8825c6b..00000000 --- a/public/images/sort-none.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/src/components/Account/AccountNavigation.tsx b/src/components/Account/AccountMenu.tsx similarity index 91% rename from src/components/Account/AccountNavigation.tsx rename to src/components/Account/AccountMenu.tsx index f706ff06..c8079e1f 100644 --- a/src/components/Account/AccountNavigation.tsx +++ b/src/components/Account/AccountMenu.tsx @@ -9,6 +9,7 @@ import { Account, Add, ArrowDownLine, + ArrowRight, ArrowsLeftRight, ArrowUpLine, Rubbish, @@ -20,7 +21,7 @@ import useParams from 'hooks/useParams' import useStore from 'store' import { hardcodedFee } from 'utils/contants' -export const AccountNavigation = () => { +export default function AccountMenu() { const router = useRouter() const params = useParams() const selectedAccount = params.account @@ -69,7 +70,7 @@ export const AccountNavigation = () => { > {hasCreditAccounts ? accountSelected - ? `Account ${selectedAccount}` + ? `Account #${selectedAccount}` : 'Select Account' : 'Create Account'} @@ -82,22 +83,21 @@ export const AccountNavigation = () => { setShow={setShowMenu} >
- {!hasCreditAccounts && ( + {(!hasCreditAccounts || createAccount) && (
- - Create Credit Account + + Create your first Credit Account - Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod - tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At - vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, - no sea takimata sanctus est Lorem ipsum dolor sit amet. + Please approve the transaction in your wallet in order to create your first Credit + Account.
diff --git a/src/components/Borrow/AssetExpanded.tsx b/src/components/Borrow/AssetExpanded.tsx index 7ca8009a..d4608ee9 100644 --- a/src/components/Borrow/AssetExpanded.tsx +++ b/src/components/Borrow/AssetExpanded.tsx @@ -36,7 +36,7 @@ export default function AssetExpanded(props: AssetRowProps) { return ( { e.preventDefault() const isExpanded = props.row.getIsExpanded() diff --git a/src/components/Borrow/AssetRow.tsx b/src/components/Borrow/AssetRow.tsx index 808d89ad..cbaa202f 100644 --- a/src/components/Borrow/AssetRow.tsx +++ b/src/components/Borrow/AssetRow.tsx @@ -1,5 +1,5 @@ -import React from 'react' import { flexRender, Row } from '@tanstack/react-table' +import classNames from 'classnames' import { getMarketAssets } from 'utils/assets' @@ -17,7 +17,10 @@ export const AssetRow = (props: AssetRowProps) => { return ( { e.preventDefault() const isExpanded = props.row.getIsExpanded() diff --git a/src/components/Borrow/BorrowTable.tsx b/src/components/Borrow/BorrowTable.tsx index 0b31affe..03feffe6 100644 --- a/src/components/Borrow/BorrowTable.tsx +++ b/src/components/Borrow/BorrowTable.tsx @@ -13,14 +13,14 @@ import Image from 'next/image' import React from 'react' import AmountAndValue from 'components/AmountAndValue' +import AssetExpanded from 'components/Borrow/AssetExpanded' import { AssetRow } from 'components/Borrow/AssetRow' -import { ChevronDown, ChevronUp } from 'components/Icons' +import { ChevronDown, SortAsc, SortDesc, SortNone } from 'components/Icons' +import Loading from 'components/Loading' import { Text } from 'components/Text' import TitleAndSubCell from 'components/TitleAndSubCell' import { getMarketAssets } from 'utils/assets' import { formatPercent } from 'utils/formatters' -import AssetExpanded from 'components/Borrow/AssetExpanded' -import Loading from 'components/Loading' type Props = { data: BorrowAsset[] | BorrowAssetActive[] @@ -43,7 +43,7 @@ export const BorrowTable = (props: Props) => { return (
token - +
) }, @@ -101,7 +101,9 @@ export const BorrowTable = (props: Props) => { width: 150, cell: ({ row }) => (
-
{row.getIsExpanded() ? : }
+
+ +
), }, @@ -144,20 +146,20 @@ export const BorrowTable = (props: Props) => { 'align-center', )} > - {header.column.getCanSort() - ? { - asc: ( - mars - ), - desc: ( - mars - ), - false: ( - mars - ), - }[header.column.getIsSorted() as string] ?? null - : null} - + + {header.column.getCanSort() + ? { + asc: , + desc: , + false: , + }[header.column.getIsSorted() as string] ?? null + : null} + + {flexRender(header.column.columnDef.header, header.getContext())}
diff --git a/src/components/Button.tsx b/src/components/Button.tsx index ebaba871..567f8a20 100644 --- a/src/components/Button.tsx +++ b/src/components/Button.tsx @@ -40,11 +40,11 @@ const focusClasses = { } const buttonBorderClasses = - 'before:content-[" "] before:absolute before:inset-0 before:rounded-sm before:p-[1px] before:border-glas before:z-[-1]' + 'before:content-[" "] before:absolute before:inset-0 before:rounded-sm before:p-[1px] before:border-glas before:-z-1' const buttonGradientClasses = [ - 'before:content-[" "] before:absolute before:inset-0 before:rounded-sm before:z-[-1] before:opacity-0', - 'before:gradient-secondary-to-primary before:transition-opacity before:duration-500 before:ease-in', + 'before:content-[" "] before:absolute before:inset-0 before:rounded-sm before:-z-1 before:opacity-0', + 'before:gradient-secondary-to-primary before:transition-opacity before:ease-in', 'hover:before:opacity-100', ] @@ -153,7 +153,7 @@ export const Button = React.forwardRef(function Button( className={classNames( 'relative z-1 flex items-center', 'cursor-pointer appearance-none break-normal outline-none', - 'text-white transition-all duration-500', + 'text-white transition-all', enableAnimations && 'transition-color', buttonClasses, buttonVariantClasses[variant], diff --git a/src/components/Icons/CheckCircled.svg b/src/components/Icons/CheckCircled.svg new file mode 100644 index 00000000..3c315baf --- /dev/null +++ b/src/components/Icons/CheckCircled.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/Icons/Close.svg b/src/components/Icons/Cross.svg similarity index 100% rename from src/components/Icons/Close.svg rename to src/components/Icons/Cross.svg diff --git a/src/components/Icons/CrossCircled.svg b/src/components/Icons/CrossCircled.svg new file mode 100644 index 00000000..f61f68c5 --- /dev/null +++ b/src/components/Icons/CrossCircled.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/Icons/SortAsc.svg b/src/components/Icons/SortAsc.svg index 03aa66d4..88925f95 100644 --- a/src/components/Icons/SortAsc.svg +++ b/src/components/Icons/SortAsc.svg @@ -1,11 +1 @@ - - - - \ No newline at end of file + \ No newline at end of file diff --git a/src/components/Icons/SortDesc.svg b/src/components/Icons/SortDesc.svg index de497343..8811bbad 100644 --- a/src/components/Icons/SortDesc.svg +++ b/src/components/Icons/SortDesc.svg @@ -1,11 +1 @@ - - - - + \ No newline at end of file diff --git a/src/components/Icons/SortNone.svg b/src/components/Icons/SortNone.svg index 368d1265..d79c0da7 100644 --- a/src/components/Icons/SortNone.svg +++ b/src/components/Icons/SortNone.svg @@ -1,11 +1 @@ - - - - \ No newline at end of file + \ No newline at end of file diff --git a/src/components/Icons/index.ts b/src/components/Icons/index.ts index bceea3f1..f33a8ba8 100644 --- a/src/components/Icons/index.ts +++ b/src/components/Icons/index.ts @@ -7,18 +7,20 @@ export { default as ArrowDownLine } from 'components/Icons/ArrowDownLine.svg' export { default as ArrowLeftLine } from 'components/Icons/ArrowLeftLine.svg' export { default as ArrowRight } from 'components/Icons/ArrowRight.svg' export { default as ArrowRightLine } from 'components/Icons/ArrowRightLine.svg' -export { default as ArrowsLeftRight } from 'components/Icons/ArrowsLeftRight.svg' -export { default as ArrowsUpDown } from 'components/Icons/ArrowsUpDown.svg' export { default as ArrowUp } from 'components/Icons/ArrowUp.svg' export { default as ArrowUpLine } from 'components/Icons/ArrowUpLine.svg' +export { default as ArrowsLeftRight } from 'components/Icons/ArrowsLeftRight.svg' +export { default as ArrowsUpDown } from 'components/Icons/ArrowsUpDown.svg' export { default as BurgerMenu } from 'components/Icons/BurgerMenu.svg' export { default as Check } from 'components/Icons/Check.svg' +export { default as CheckCircled } from 'components/Icons/CheckCircled.svg' export { default as ChevronDown } from 'components/Icons/ChevronDown.svg' export { default as ChevronLeft } from 'components/Icons/ChevronLeft.svg' export { default as ChevronRight } from 'components/Icons/ChevronRight.svg' export { default as ChevronUp } from 'components/Icons/ChevronUp.svg' -export { default as Close } from 'components/Icons/Close.svg' export { default as Copy } from 'components/Icons/Copy.svg' +export { default as Cross } from 'components/Icons/Cross.svg' +export { default as CrossCircled } from 'components/Icons/CrossCircled.svg' export { default as Deposit } from 'components/Icons/Deposit.svg' export { default as Discord } from 'components/Icons/Discord.svg' export { default as Edit } from 'components/Icons/Edit.svg' diff --git a/src/components/Modal.tsx b/src/components/Modal.tsx index 95875127..8bf609ce 100644 --- a/src/components/Modal.tsx +++ b/src/components/Modal.tsx @@ -3,7 +3,7 @@ import { ReactNode } from 'react' import { Button } from 'components/Button' import Card from 'components/Card' -import { Close } from 'components/Icons' +import { Cross } from 'components/Icons' interface Props { header: string | ReactNode @@ -34,7 +34,7 @@ export const Modal = (props: Props) => { {props.header}