diff --git a/src/components/Header/KyberAINavItem.tsx b/src/components/Header/KyberAINavItem.tsx index 40d23a6d79..c75beb1974 100644 --- a/src/components/Header/KyberAINavItem.tsx +++ b/src/components/Header/KyberAINavItem.tsx @@ -17,6 +17,7 @@ import NavGroup from './groups/NavGroup' import { DropdownTextAnchor, StyledNavLink } from './styleds' const CustomSlideToUnlock = styled(SlideToUnlock)` + background: ${({ theme }) => theme.subText}; background: linear-gradient( to right, ${({ theme }) => theme.subText} 0, @@ -25,8 +26,8 @@ const CustomSlideToUnlock = styled(SlideToUnlock)` ); background-clip: text; -webkit-background-clip: text; - &[data-active='true'] { + background: ${({ theme }) => theme.primary}; background: linear-gradient( to right, ${({ theme }) => theme.primary} 0, diff --git a/src/constants/networks/base.ts b/src/constants/networks/base.ts index 8f288af089..cb19d25c0f 100644 --- a/src/constants/networks/base.ts +++ b/src/constants/networks/base.ts @@ -22,7 +22,7 @@ const base: EVMNetworkInfo = { defaultBlockSubgraph: 'https://base-graph.kyberengineering.io/subgraphs/name/kybernetwork/base-blocks', etherscanUrl: 'https://basescan.org', etherscanName: 'Base Explorer', - bridgeURL: EMPTY, + bridgeURL: 'https://bridge.base.org/deposit', nativeToken: { symbol: 'ETH', name: 'ETH', diff --git a/src/pages/TrueSightV2/components/LoadingTextAnimation.tsx b/src/pages/TrueSightV2/components/LoadingTextAnimation.tsx index 23da04deed..55f77ed36e 100644 --- a/src/pages/TrueSightV2/components/LoadingTextAnimation.tsx +++ b/src/pages/TrueSightV2/components/LoadingTextAnimation.tsx @@ -1,5 +1,8 @@ +import { useMedia } from 'react-use' import styled, { keyframes } from 'styled-components' +import { MEDIA_WIDTHS } from 'theme' + const bounce = keyframes` 15%, 35%, @@ -24,7 +27,6 @@ const Wrapper = styled.div` color: ${({ theme }) => theme.text}; animation: ${bounce} 3s infinite ease; min-width: 10px; - display: flex; justify-content: center; margin-bottom: 10px; } @@ -120,16 +122,34 @@ const Wrapper = styled.div` animation-delay: 1.55s; } ${({ theme }) => theme.mediaWidth.upToSmall` - font-size: 12px; + font-size: 14px; `} ` export default function LoadingTextAnimation() { + const isMobile = useMedia(`(max-width: ${MEDIA_WIDTHS.upToSmall}px)`) return ( - - {'Crafting your screenshot...'.split('').map((w, index) => ( - {w} - ))} - + <> + {isMobile ? ( + + + {'Crafting your'.split('').map((w, index) => ( + {w} + ))} + + + {'screenshot...'.split('').map((w, index) => ( + {w} + ))} + + + ) : ( + + {'Crafting your screenshot...'.split('').map((w, index) => ( + {w} + ))} + + )} + > ) } diff --git a/src/pages/TrueSightV2/components/chart/index.tsx b/src/pages/TrueSightV2/components/chart/index.tsx index e64e59cf10..16fa66b24a 100644 --- a/src/pages/TrueSightV2/components/chart/index.tsx +++ b/src/pages/TrueSightV2/components/chart/index.tsx @@ -2724,6 +2724,7 @@ export const Prochart = ({ 'mainSeriesProperties.priceAxisProperties.autoScale': true, 'scalesProperties.textColor': theme.text, }) + tvWidget .activeChart() .createStudy('Relative Strength Index') @@ -2764,7 +2765,7 @@ export const Prochart = ({ const addSRLevels = useCallback(() => { if (!currentPrice || !tvWidget) return SRLevels?.forEach((level: ISRLevel) => { - const entityId = tvWidget.activeChart().createMultipointShape([{ time: level.timestamp, price: level.value }], { + const entityId = tvWidget?.activeChart().createMultipointShape([{ time: level.timestamp, price: level.value }], { shape: 'horizontal_ray', lock: true, disableSelection: true, @@ -2799,10 +2800,12 @@ export const Prochart = ({ }, [tvWidget, SRLevels, showSRLevels, currentPrice, theme, removeSRLevels, addSRLevels]) useEffect(() => { - if (resolution && tvWidget?.activeChart().resolution() !== (resolution as ResolutionString)) { - tvWidget?.activeChart().setResolution(resolution as ResolutionString) - variablesRef.current.resolution = resolution - } + try { + if (resolution && tvWidget?.activeChart().resolution() !== (resolution as ResolutionString)) { + tvWidget?.activeChart().setResolution(resolution as ResolutionString) + variablesRef.current.resolution = resolution + } + } catch {} }, [resolution, tvWidget]) return ( diff --git a/src/pages/TrueSightV2/pages/TokenAnalysisList.tsx b/src/pages/TrueSightV2/pages/TokenAnalysisList.tsx index fcbcfd2e79..c37d2bba0d 100644 --- a/src/pages/TrueSightV2/pages/TokenAnalysisList.tsx +++ b/src/pages/TrueSightV2/pages/TokenAnalysisList.tsx @@ -228,21 +228,18 @@ const TabWrapper = styled(motion.div)` } ${({ theme }) => theme.mediaWidth.upToSmall` min-width: initial; - flex:1; + flex: 1; `} ` const ButtonTypeActive = styled(ButtonLight)` height: 36px; - margin: 0 !important; - display: flex; gap: 4px; font-size: 14px; white-space: nowrap; border: 1px solid ${({ theme }) => theme.primary}; background-color: ${({ theme }) => rgba(theme.primary, 0.33)}; transition: all 0.1s ease; - flex: 1; :hover { background-color: ${({ theme }) => rgba(theme.primary, 0.5)}; filter: none; @@ -251,14 +248,10 @@ const ButtonTypeActive = styled(ButtonLight)` const ButtonTypeInactive = styled(ButtonOutlined)` height: 36px; - margin: 0 !important; - display: flex; gap: 4px; font-size: 14px; white-space: nowrap; transition: all 0.1s ease; - flex: 1; - ${({ theme }) => css` color: ${theme.subText}; border-color: ${theme.subText};