diff --git a/packages/app/src/assets/svg/app/docs.svg b/packages/app/src/assets/svg/app/docs.svg new file mode 100644 index 0000000000..33aae457e3 --- /dev/null +++ b/packages/app/src/assets/svg/app/docs.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/packages/app/src/assets/svg/app/support.svg b/packages/app/src/assets/svg/app/support.svg new file mode 100644 index 0000000000..01daa5365a --- /dev/null +++ b/packages/app/src/assets/svg/app/support.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file diff --git a/packages/app/src/sections/exchange/TradeCard/CurrencyCard/CurrencyCard.tsx b/packages/app/src/sections/exchange/TradeCard/CurrencyCard/CurrencyCard.tsx index dca9656225..a1a2d172e3 100644 --- a/packages/app/src/sections/exchange/TradeCard/CurrencyCard/CurrencyCard.tsx +++ b/packages/app/src/sections/exchange/TradeCard/CurrencyCard/CurrencyCard.tsx @@ -57,10 +57,8 @@ const CurrencyCard: FC = memo( const hasCurrencySelectCallback = !!onCurrencySelect const tokenName = useMemo(() => { - return currencyKey && currencyKey[0] === 's' - ? t('common.currency.synthetic-currency-name', { currencyName }) - : currencyName || t('exchange.currency-card.synth-name') - }, [currencyKey, currencyName, t]) + return currencyName || t('exchange.currency-card.synth-name') + }, [currencyName, t]) return ( diff --git a/packages/app/src/sections/futures/MarketDetails/HoursToggle.tsx b/packages/app/src/sections/futures/MarketDetails/HoursToggle.tsx index b8a41b452e..e09d18102e 100644 --- a/packages/app/src/sections/futures/MarketDetails/HoursToggle.tsx +++ b/packages/app/src/sections/futures/MarketDetails/HoursToggle.tsx @@ -44,13 +44,14 @@ const HoursToggle: React.FC = () => { ) } - +// solid ${(props) => props.theme.colors.selectedTheme.newTheme.pill['gray'].border}; const ToggleTableRow = styled.div` margin: auto; padding: 1.5px 6px; height: ${HOURS_TOGGLE_HEIGHT}; background: ${(props) => props.theme.colors.selectedTheme.newTheme.pill['gray'].background}; - border: 1px solid ${(props) => props.theme.colors.selectedTheme.newTheme.pill['gray'].border}; + border-width: 0px; + :last-child { border-radius: 0px 0px 9px 9px; } diff --git a/packages/app/src/sections/futures/MarketDetails/MarketDetails.tsx b/packages/app/src/sections/futures/MarketDetails/MarketDetails.tsx index 4d44296b78..27426fe3ee 100644 --- a/packages/app/src/sections/futures/MarketDetails/MarketDetails.tsx +++ b/packages/app/src/sections/futures/MarketDetails/MarketDetails.tsx @@ -118,7 +118,9 @@ const DailyChangeDetail: React.FC = memo(({ mobile }) => { dataKey={MarketDataKey.dailyChange} value={ indexPriceWei.gt(0) && pastPrice?.rate - ? formatPercent(indexPriceWei.sub(pastPrice.rate).div(indexPriceWei) ?? ZERO_WEI) + ? formatPercent(indexPriceWei.sub(pastPrice.rate).div(indexPriceWei) ?? ZERO_WEI, { + maxDecimals: 2, + }) : NO_VALUE } color={ @@ -147,7 +149,11 @@ const HourlyFundingDetail: React.FC = memo(({ mobile }) => { return ( } diff --git a/packages/app/src/sections/futures/MobileTrade/UserTabs/PositionsTab.tsx b/packages/app/src/sections/futures/MobileTrade/UserTabs/PositionsTab.tsx index 95a2de5346..3c15c03155 100644 --- a/packages/app/src/sections/futures/MobileTrade/UserTabs/PositionsTab.tsx +++ b/packages/app/src/sections/futures/MobileTrade/UserTabs/PositionsTab.tsx @@ -5,7 +5,6 @@ import { useCallback, useMemo, useState } from 'react' import { useTranslation } from 'react-i18next' import styled from 'styled-components' -import UploadIcon from 'assets/svg/futures/upload-icon.svg' import Currency from 'components/Currency' import { FlexDiv, FlexDivRow, FlexDivRowCentered } from 'components/layout/flex' import Pill from 'components/Pill' @@ -137,10 +136,7 @@ const PositionsTab = () => { Close handleOpenShareModal(row.share)}> - - - Share - + Share diff --git a/packages/app/src/sections/futures/Trade/TradeBalance.tsx b/packages/app/src/sections/futures/Trade/TradeBalance.tsx index 0f59d46668..754c813880 100644 --- a/packages/app/src/sections/futures/Trade/TradeBalance.tsx +++ b/packages/app/src/sections/futures/Trade/TradeBalance.tsx @@ -86,7 +86,7 @@ const TradeBalance: React.FC = memo(({ isMobile = false }) => <> {isMobile ? ( - + {t('futures.market.trade.trade-balance.available-margin')}: @@ -97,7 +97,7 @@ const TradeBalance: React.FC = memo(({ isMobile = false }) => {accountType === 'cross_margin' && lockedMargin.gt(0) && ( - + {t('futures.market.trade.trade-balance.locked-margin')}: diff --git a/packages/app/src/sections/futures/UserInfo/PositionsTable.tsx b/packages/app/src/sections/futures/UserInfo/PositionsTable.tsx index 27cb34e390..782d83eb5a 100644 --- a/packages/app/src/sections/futures/UserInfo/PositionsTable.tsx +++ b/packages/app/src/sections/futures/UserInfo/PositionsTable.tsx @@ -312,9 +312,7 @@ const PositionRowDesktop = styled.div` &:nth-child(odd) { background-color: ${(props) => props.theme.colors.selectedTheme.table.fill}; } - :not(:last-child) { - border-bottom: ${(props) => props.theme.colors.selectedTheme.border}; - } + border-bottom: ${(props) => props.theme.colors.selectedTheme.border}; ` const HeadersRow = styled(PositionRowDesktop)` @@ -325,6 +323,9 @@ const HeadersRow = styled(PositionRowDesktop)` :not(:last-child) { border-bottom: 0; } + &:first-child { + background-color: transparent; + } ` const PositionCell = styled.div` diff --git a/packages/app/src/sections/shared/Layout/AppLayout/Footer.tsx b/packages/app/src/sections/shared/Layout/AppLayout/Footer.tsx index bc45346777..b897662a34 100644 --- a/packages/app/src/sections/shared/Layout/AppLayout/Footer.tsx +++ b/packages/app/src/sections/shared/Layout/AppLayout/Footer.tsx @@ -1,6 +1,9 @@ import router from 'next/router' import styled from 'styled-components' +import DocsIcon from 'assets/svg/app/docs.svg' +import SupportIcon from 'assets/svg/app/support.svg' +import { FlexDivRow } from 'components/layout/flex' import { Body } from 'components/Text' import { EXTERNAL_LINKS } from 'constants/links' import ROUTES from 'constants/routes' @@ -19,9 +22,11 @@ const Footer = () => { Stats + Docs + Support @@ -50,11 +55,17 @@ const FooterLink = styled.a.attrs({ target: '_blank', rel: '_noreferrer' })` &:not(:last-of-type) { margin-right: 18px; } + display: flex; + flex-direction: row; + align-items: center; + column-gap: 5px; ` -const FooterLinkInternal = styled.div` +const FooterLinkInternal = styled(FlexDivRow)` margin-right: 18px; cursor: pointer; + align-items: center; + column-gap: 5px; ` export default Footer diff --git a/packages/sdk/src/utils/number.ts b/packages/sdk/src/utils/number.ts index f786816c56..475aad4783 100644 --- a/packages/sdk/src/utils/number.ts +++ b/packages/sdk/src/utils/number.ts @@ -181,7 +181,7 @@ export const formatPercent = ( value: WeiSource, options?: { minDecimals?: number; suggestDecimals?: boolean; maxDecimals?: number } ) => { - let decimals = suggestedDecimals ? suggestedDecimals(value) : options?.minDecimals ?? 2 + let decimals = options?.suggestDecimals ? suggestedDecimals(value) : options?.minDecimals ?? 2 if (options?.maxDecimals) { decimals = Math.min(decimals, options.maxDecimals) }