diff --git a/src/Theme/index.js b/src/Theme/index.js index 8c52dea..78269ba 100755 --- a/src/Theme/index.js +++ b/src/Theme/index.js @@ -127,13 +127,16 @@ export const Link = styled.a.attrs({ cursor: pointer; color: ${({ theme }) => theme.primary1}; font-weight: 500; + :hover { text-decoration: underline; } + :focus { outline: none; text-decoration: underline; } + :active { text-decoration: none; } @@ -159,11 +162,17 @@ export const ThemedBackground = styled.div` export const GlobalStyle = createGlobalStyle` @import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@500&display=swap'); - html { font-family: 'DM Sans', sans-serif; } + + html { + font-family: 'DM Sans', sans-serif; + } + @supports (font-variation-settings: normal) { - html { font-family: 'DM Sans', sans-serif; } + html { + font-family: 'DM Sans', sans-serif; + } } - + html, body { margin: 0; @@ -173,7 +182,7 @@ export const GlobalStyle = createGlobalStyle` font-size: 14px; background-color: ${({ theme }) => theme.bg6}; } - + * { box-sizing: border-box; } @@ -186,47 +195,50 @@ export const GlobalStyle = createGlobalStyle` } } - -.three-line-legend { - width: 100%; - height: 70px; - position: absolute; - padding: 8px; - font-size: 12px; - color: #20262E; - background-color: rgba(255, 255, 255, 0.23); - text-align: left; - z-index: 10; - pointer-events: none; -} - -.three-line-legend-dark { - width: 100%; - height: 70px; - position: absolute; - padding: 8px; - font-size: 12px; - color: white; - background-color: rgba(255, 255, 255, 0.23); - text-align: left; - z-index: 10; - pointer-events: none; -} + button { + font-family: 'DM Sans', sans-serif; + } -@media screen and (max-width: 800px) { .three-line-legend { - display: none !important; + width: 100%; + height: 70px; + position: absolute; + padding: 8px; + font-size: 12px; + color: #20262E; + background-color: rgba(255, 255, 255, 0.23); + text-align: left; + z-index: 10; + pointer-events: none; } -} -.tv-lightweight-charts{ - width: 100% !important; - + .three-line-legend-dark { + width: 100%; + height: 70px; + position: absolute; + padding: 8px; + font-size: 12px; + color: white; + background-color: rgba(255, 255, 255, 0.23); + text-align: left; + z-index: 10; + pointer-events: none; + } - & > * { + @media screen and (max-width: 800px) { + .three-line-legend { + display: none !important; + } + } + + .tv-lightweight-charts { width: 100% !important; + + + & > * { + width: 100% !important; + } } -} html { diff --git a/src/components/FAQ/index.js b/src/components/FAQ/index.js index 51404c6..aed2953 100755 --- a/src/components/FAQ/index.js +++ b/src/components/FAQ/index.js @@ -1,5 +1,5 @@ import React from 'react' -import styled, { css } from 'styled-components' +import styled from 'styled-components' import { Accordion as AccordionWrapper, AccordionItem as Item } from '@szhsin/react-accordion' import { ChevronDown } from 'react-feather' @@ -16,7 +16,9 @@ const ItemWithChevron = ({ header, ...rest }) => ( - {header} + + {header} + } /> diff --git a/src/components/PositionList/index.js b/src/components/PositionList/index.js index f461cb1..78064b2 100755 --- a/src/components/PositionList/index.js +++ b/src/components/PositionList/index.js @@ -108,7 +108,6 @@ const SORT_FIELD = { } function PositionList({ positions }) { - const below500 = useMedia('(max-width: 500px)') const below740 = useMedia('(max-width: 740px)') // pagination @@ -135,8 +134,6 @@ function PositionList({ positions }) { } }, [positions]) - const [ethPrice] = useEthPrice() - const ListItem = ({ position, index }) => { const poolOwnership = position.liquidityTokenBalance / position.pair.totalSupply const valueUSD = poolOwnership * position.pair.reserveUSD diff --git a/src/components/SideNav/index.js b/src/components/SideNav/index.js index ab212cd..64291c3 100755 --- a/src/components/SideNav/index.js +++ b/src/components/SideNav/index.js @@ -7,7 +7,7 @@ import { useMedia } from 'react-use' import { transparentize } from 'polished' import { TYPE } from '../../Theme' import { withRouter } from 'react-router-dom' -import { TrendingUp, List, PieChart, Disc, Flag } from 'react-feather' +import { TrendingUp, List, PieChart, Disc } from 'react-feather' import Link from '../Link' import { useSessionStart } from '../../contexts/Application' diff --git a/src/components/VolumeContestSearchWallet/index.js b/src/components/VolumeContestSearchWallet/index.js index c95eed3..a99196b 100644 --- a/src/components/VolumeContestSearchWallet/index.js +++ b/src/components/VolumeContestSearchWallet/index.js @@ -124,7 +124,7 @@ function VolumeContestSearchWalletPanel({ history }) { } history.push('/volume-contest/' + checkAccountQuery) }, - [isCheckAccountAddressValid, checkAccountQuery] + [isCheckAccountAddressValid, checkAccountQuery, history] ) return ( diff --git a/src/contexts/LpContestData.js b/src/contexts/LpContestData.js index 3d9edf9..f519cec 100644 --- a/src/contexts/LpContestData.js +++ b/src/contexts/LpContestData.js @@ -204,7 +204,7 @@ export function useLpContestNftRanksData() { if (!(ranks && Object.keys(ranks).length)) { fetchData() } - }, [ranks]) + }, [ranks, updateNftRanksData]) return ranks } diff --git a/src/contexts/User.js b/src/contexts/User.js index be66698..ce1ae19 100755 --- a/src/contexts/User.js +++ b/src/contexts/User.js @@ -1,5 +1,4 @@ import React, { createContext, useContext, useReducer, useMemo, useCallback, useEffect, useState } from 'react' -import { isEmpty } from 'lodash' import { usePairData } from './PairData' import { jediSwapClient } from '../apollo/client' import { @@ -347,7 +346,7 @@ export function useUserVolumeCampaignTransactions({ account, timestampGte, times if (!transactions && account) { fetchData(account) } - }, [account, transactions, updateVolumeContestTransactions]) + }, [account, transactions, updateVolumeContestTransactions, timestampGte, timestampLte]) return transactions || {} } diff --git a/src/pages/AccountPage.js b/src/pages/AccountPage.js index 37abd39..66c5eb1 100755 --- a/src/pages/AccountPage.js +++ b/src/pages/AccountPage.js @@ -87,10 +87,6 @@ function AccountPage({ account }) { const dynamicPositions = activePosition ? [activePosition] : positions - const aggregateFees = dynamicPositions?.reduce(function (total, position) { - return total + position.fees.sum - }, 0) - const positionValue = useMemo(() => { return dynamicPositions ? dynamicPositions.reduce((total, position) => { diff --git a/src/pages/LpContestLookup.js b/src/pages/LpContestLookup.js index 665b427..48f1429 100755 --- a/src/pages/LpContestLookup.js +++ b/src/pages/LpContestLookup.js @@ -2,7 +2,6 @@ import React, { useMemo } from 'react' import 'feather-icons' import { withRouter } from 'react-router-dom' import dayjs from 'dayjs' -import Countdown from 'react-countdown' import { TYPE } from '../Theme' import { PageWrapper, FullWrapper } from '../components' diff --git a/src/pages/LpContestPage.js b/src/pages/LpContestPage.js index 2805f5d..b0cc4ca 100755 --- a/src/pages/LpContestPage.js +++ b/src/pages/LpContestPage.js @@ -14,7 +14,6 @@ import { BasicLink } from '../components/Link' import eligibilityBadgeIcon from '../../src/assets/starBadge.svg' -import LpContestUserChart from '../components/LpContestUserChart' import { useLpContestNftRanksData } from '../contexts/LpContestData' import { isEmpty, isObject } from 'lodash' @@ -26,15 +25,6 @@ const EligibilityBadgeWrapper = styled.a` cursor: help; ` -const PanelWrapper = styled.div` - grid-template-columns: 1fr; - grid-template-rows: max-content; - gap: 6px; - display: inline-grid; - width: 100%; - align-items: start; -` - const Header = styled.div`` const DashboardWrapper = styled.div` diff --git a/src/pages/PairPage.js b/src/pages/PairPage.js index 55780b6..8ed3784 100755 --- a/src/pages/PairPage.js +++ b/src/pages/PairPage.js @@ -186,7 +186,6 @@ function PairPage({ pairAddress, history }) { const [savedPairs, addPair] = useSavedPairs() - const listedTokens = useListedTokens() const whitelistedTokens = useWhitelistedTokens() const isTokenWhitelisted = !!(whitelistedTokens[token0?.id] && whitelistedTokens[token1?.id]) diff --git a/src/pages/VolumeContestPage.js b/src/pages/VolumeContestPage.js index 8c3d360..aa15c91 100755 --- a/src/pages/VolumeContestPage.js +++ b/src/pages/VolumeContestPage.js @@ -151,8 +151,8 @@ function VolumeContestAccountPage({ account }) { const totalContestScore = userData?.totalContestScore let isUserEligible = useMemo(() => { - return (typeof userNftLevel == 'number' && userNftLevel) > 0 || false - }, [userData]) + return (typeof userNftLevel == 'number' && userNftLevel > 0 && userNftLevel <= 5) || false + }, [userData, userNftLevel]) const getEligibleNftForUserScore = useCallback(() => { const loadingResultStub = '...' @@ -173,7 +173,7 @@ function VolumeContestAccountPage({ account }) { if (!isAllDataAvailable) { return loadingResultStub } - const currentWeek = userData.weeks.filter(findCurrentWeek).unshift() + const currentWeek = userData.weeks.filter(findCurrentWeek).shift() return currentWeek?.score ?? 0 }, [userData])