Remove some excess spacing on user page

This commit is contained in:
James Grugett 2022-09-06 23:39:50 -05:00
parent 082125bd2f
commit a40bdc28be

View File

@ -168,62 +168,63 @@ export function UserPage(props: { user: User }) {
<Spacer h={4} /> <Spacer h={4} />
</> </>
)} )}
<Row className="flex-wrap items-center gap-2 sm:gap-4"> {(user.website || user.twitterHandle || user.discordHandle) && (
{user.website && ( <Row className="mb-5 flex-wrap items-center gap-2 sm:gap-4">
<SiteLink {user.website && (
href={ <SiteLink
'https://' + href={
user.website.replace('http://', '').replace('https://', '') 'https://' +
} user.website.replace('http://', '').replace('https://', '')
> }
<Row className="items-center gap-1"> >
<LinkIcon className="h-4 w-4" /> <Row className="items-center gap-1">
<span className="text-sm text-gray-500">{user.website}</span> <LinkIcon className="h-4 w-4" />
</Row> <span className="text-sm text-gray-500">{user.website}</span>
</SiteLink> </Row>
)} </SiteLink>
)}
{user.twitterHandle && ( {user.twitterHandle && (
<SiteLink <SiteLink
href={`https://twitter.com/${user.twitterHandle href={`https://twitter.com/${user.twitterHandle
.replace('https://www.twitter.com/', '') .replace('https://www.twitter.com/', '')
.replace('https://twitter.com/', '') .replace('https://twitter.com/', '')
.replace('www.twitter.com/', '') .replace('www.twitter.com/', '')
.replace('twitter.com/', '')}`} .replace('twitter.com/', '')}`}
> >
<Row className="items-center gap-1"> <Row className="items-center gap-1">
<img <img
src="/twitter-logo.svg" src="/twitter-logo.svg"
className="h-4 w-4" className="h-4 w-4"
alt="Twitter" alt="Twitter"
/> />
<span className="text-sm text-gray-500"> <span className="text-sm text-gray-500">
{user.twitterHandle} {user.twitterHandle}
</span> </span>
</Row> </Row>
</SiteLink> </SiteLink>
)} )}
{user.discordHandle && ( {user.discordHandle && (
<SiteLink href="https://discord.com/invite/eHQBNBqXuh"> <SiteLink href="https://discord.com/invite/eHQBNBqXuh">
<Row className="items-center gap-1"> <Row className="items-center gap-1">
<img <img
src="/discord-logo.svg" src="/discord-logo.svg"
className="h-4 w-4" className="h-4 w-4"
alt="Discord" alt="Discord"
/> />
<span className="text-sm text-gray-500"> <span className="text-sm text-gray-500">
{user.discordHandle} {user.discordHandle}
</span> </span>
</Row> </Row>
</SiteLink> </SiteLink>
)} )}
</Row> </Row>
<Spacer h={5} /> )}
{currentUser?.id === user.id && REFERRAL_AMOUNT > 0 && ( {currentUser?.id === user.id && REFERRAL_AMOUNT > 0 && (
<Row <Row
className={ className={
'w-full items-center justify-center gap-2 rounded-md border-2 border-indigo-100 bg-indigo-50 p-2 text-indigo-600' 'mb-5 w-full items-center justify-center gap-2 rounded-md border-2 border-indigo-100 bg-indigo-50 p-2 text-indigo-600'
} }
> >
<span> <span>
@ -240,7 +241,6 @@ export function UserPage(props: { user: User }) {
/> />
</Row> </Row>
)} )}
<Spacer h={5} />
<QueryUncontrolledTabs <QueryUncontrolledTabs
currentPageForAnalytics={'profile'} currentPageForAnalytics={'profile'}
labelClassName={'pb-2 pt-1 '} labelClassName={'pb-2 pt-1 '}