diff --git a/src/components/board-banner/board-banner.tsx b/src/components/board-banner/board-banner.tsx index 6b4ae795..7887a67e 100644 --- a/src/components/board-banner/board-banner.tsx +++ b/src/components/board-banner/board-banner.tsx @@ -17,14 +17,15 @@ interface BoardBannerProps { address: string | undefined; } -const BoardBanner = ({ title, address }: BoardBannerProps) => { +const BoardBanner = ({ address, title }: BoardBannerProps) => { + const displayAddress = address && address.length > 10 && !address.includes('.') ? address.slice(0, 13).concat('...') : address; return (
-
{title || `p/${address}`}
- {title &&
p/{address}
} +
{title || `p/${displayAddress}`}
+
p/{address}

); diff --git a/src/components/board-nav/board-nav.tsx b/src/components/board-nav/board-nav.tsx index bd48bc68..fa2e989a 100644 --- a/src/components/board-nav/board-nav.tsx +++ b/src/components/board-nav/board-nav.tsx @@ -37,16 +37,21 @@ const BoardNavDesktop = ({ subplebbits }: BoardNavProps) => { const BoardNavMobile = ({ subplebbits, currentSubplebbit }: BoardNavProps) => { const { t } = useTranslation(); const navigate = useNavigate(); + const displaySubplebbit = currentSubplebbit && currentSubplebbit.length > 10 ? currentSubplebbit.slice(0, 10).concat('...') : currentSubplebbit; const boardSelect = ( - navigate(`/p/${e.target.value}`)}> - {subplebbits.map((subplebbit: any, index: number) => ( - - ))} + {subplebbits.map((subplebbit: any, index: number) => { + const { address, title } = subplebbit; + const subplebbitAddress = address.includes('.') ? address : title || address.slice(0, 10).concat('...'); + return ( + + ); + })} ); diff --git a/src/components/post/post.module.css b/src/components/post/post.module.css index 926dd15e..a518f3d0 100644 --- a/src/components/post/post.module.css +++ b/src/components/post/post.module.css @@ -88,9 +88,9 @@ .postDesktop .postMessage { padding: 1em 40px; } -/* + @media (max-width: 640px) { .postDesktop { display: none; } -} */ \ No newline at end of file +} \ No newline at end of file