ButterflyEffect/uniswap-interface-uncensored
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: top token charts on mobile (#6967)

Browse Source 
* fix: top token charts on mobile

* Update TokenRow.test.tsx.snap

* Update src/components/Tokens/TokenTable/TokenRow.tsx

Co-authored-by: Zach Pomerantz <zzmp@uniswap.org>

* Update src/components/Tokens/TokenTable/__snapshots__/TokenRow.test.tsx.snap

Co-authored-by: Zach Pomerantz <zzmp@uniswap.org>

* update

* Update TokenRow.test.tsx.snap

* Update TokenRow.test.tsx.snap

---------

Co-authored-by: Zach Pomerantz <zzmp@uniswap.org>
This commit is contained in:
Brendan Wong 2023-07-28 17:50:02 -04:00 committed by GitHub
parent b4bb3d72d5
commit 136e68201f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/Tokens/TokenTable/TokenRow.tsx
View File

@ -14,7 +14,7 @@ import { CSSProperties, ReactNode } from 'react'
import { ArrowDown, ArrowUp, Info } from 'react-feather' import { ArrowDown, ArrowUp, Info } from 'react-feather'
import { Link, useParams } from 'react-router-dom' import { Link, useParams } from 'react-router-dom'
import styled, { css, useTheme } from 'styled-components/macro' import styled, { css, useTheme } from 'styled-components/macro'
import { ClickableStyle } from 'theme' import { BREAKPOINTS, ClickableStyle } from 'theme'
import { import {
LARGE_MEDIA_BREAKPOINT, LARGE_MEDIA_BREAKPOINT,
@ -163,6 +163,10 @@ const NameCell = styled(Cell)`
padding: 0px 8px; padding: 0px 8px;
min-width: 240px; min-width: 240px;
gap: 8px; gap: 8px;
@media only screen and (max-width: ${BREAKPOINTS.xs}px) {
min-width: 200px;
}
` `
const PriceCell = styled(DataCell)` const PriceCell = styled(DataCell)`
padding-right: 8px; padding-right: 8px;

6
src/components/Tokens/TokenTable/__snapshots__/TokenRow.test.tsx.snap
View File

@ -257,6 +257,12 @@ exports[`LoadedRow.tsx renders a row 1`] = `
} }
} }
@media only screen and (max-width:396px) {
.c4 {
min-width: 200px;
}
}
@media only screen and (max-width:540px) { @media only screen and (max-width:540px) {
.c21 { .c21 {
display: none; display: none;