Hide label of verification badge in a table for mobile screens#2003
Conversation
kaja-osojnik
requested review from
buberdds,
csillag,
lubej and
lukaw3d
as code owners
Deployed to Cloudflare Pages
|
kaja-osojnik
changed the title
There was a problem hiding this comment.
-
There is some
spacing inContractStatuswhich is now more visible with compact badges in tables. Maybe it's better to render these extra spaces conditionally? -
I think we don't need StatusBadge.tsx changes. Once reverted I would change prop name to
hideLabel(or oppositewithLabel) and just changeContractStatusto sth like
return <StatusBadge label={hideLabel ? '' : statusLabel} variant={statusVariant} hideLabel={hideLabel} />
buberdds
left a comment
buberdds
left a comment
There was a problem hiding this comment.
Nice, once two issues reported by Luka are fixed I am fine with merging.
donouwens
left a comment
donouwens
left a comment
There was a problem hiding this comment.
Design looks all good to me
| const Component = noLink ? Box : (Link as React.ElementType) | ||
| const componentProps = noLink ? {} : sourcifyLinkProps | ||
|
|
||
| const hideLabelMobile = hideLabel && isMobile |
There was a problem hiding this comment.
I'll fix: table component should decide to hide label on mobile. Not ContractStatus, not VerificationIcon
| <ContractStatus verificationLevel={verificationLevel} hideLabel={hideLabelMobile} /> | ||
| </Component> | ||
| | ||
| {hideLabel && isMobile ? null : '\u00A0\u00A0'} |
There was a problem hiding this comment.
I'll fix: spacing here is not related to label nor isMobile. It should be displayed depending on noLink
| [theme.breakpoints.down('sm')]: { | ||
| padding: 4, | ||
| }, |
There was a problem hiding this comment.
I'll fix: spacing here is not related to mobile. It should be displayed depending on hideLabel / (!!label in this component)
lukaw3d
force-pushed
the
kaja/mobile-verification-badge
branch
from
8ca2841 to
99fa4bb
Compare
Co-authored-by: lukaw3d <luka@oasisprotocol.org>
lukaw3d
force-pushed
the
kaja/mobile-verification-badge
branch
from
99fa4bb to
4df8d83
Compare
4 participants
Implements: #1992
Before:
After:
