diff --git a/web/components/manalink-card.tsx b/web/components/manalink-card.tsx index b49e1621..51880f5d 100644 --- a/web/components/manalink-card.tsx +++ b/web/components/manalink-card.tsx @@ -27,10 +27,10 @@ export function ManalinkCard(props: { const { expiresTime, maxUses, uses, amount, message } = info return ( -
@@ -54,20 +54,18 @@ export function ManalinkCard(props: { )} src="/logo-white.svg" /> - - -
- {formatMoney(amount)} -
-
{message}
- + +
+ {formatMoney(amount)} +
-
+ +
{message}
) } @@ -79,48 +77,48 @@ export function ManalinkCardFromView(props: { }) { const { className, link, highlightedSlug } = props const { message, amount, expiresTime, maxUses, claims } = link - const [details, setDetails] = useState(false) + const [showDetails, setShowDetails] = useState(false) return ( - -
+ setDetails(!details)} > - {details && ( - setShowDetails(!showDetails)} + > + {showDetails && ( + + )} + +
+ {maxUses != null + ? `${maxUses - claims.length}/${maxUses} uses left` + : `Unlimited use`} +
+
+ {expiresTime != null + ? `Expires ${fromNow(expiresTime)}` + : 'Never expires'} +
+ + - )} - -
- {maxUses != null - ? `${maxUses - claims.length}/${maxUses} uses left` - : `Unlimited use`} -
-
- {expiresTime != null - ? `Expires ${fromNow(expiresTime)}` - : 'Never expires'} -
- -
- - +
-
{message || '\n\n'}
+
+ {message || ''} +
) } diff --git a/web/components/manalinks/create-links-button.tsx b/web/components/manalinks/create-links-button.tsx index 25b51bb2..656aff29 100644 --- a/web/components/manalinks/create-links-button.tsx +++ b/web/components/manalinks/create-links-button.tsx @@ -37,7 +37,6 @@ export function CreateLinksButton(props: { message: newManalink.message, }) setHighlightedSlug(slug || '') - setTimeout(() => setHighlightedSlug(''), 3700) }} /> @@ -165,6 +164,7 @@ function CreateManalinkForm(props: {