GKaszewski/thoughts
1
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

fix(frontend): fix instance badge overflow on narrow screens

Browse Source
This commit is contained in:
Gabriel Kaszewski
2026-05-29 01:47:50 +02:00
parent dc75ac5f6c
commit 4ab6da67c7
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
thoughts-frontend/components/movie-card.tsx
View File

@@ -59,7 +59,7 @@ export function MovieCard({ meta, author, createdAt }: MovieCardProps) {
<CardHeader className="flex flex-row items-center space-y-0 pb-3">
<Link
href={profileHref(author.username, author.local)}
className="flex items-center gap-3 hover:opacity-80"
className="flex items-center gap-3 hover:opacity-80 min-w-0 w-full"
>
<UserAvatar src={author.avatarUrl} alt={author.displayName ?? author.username} />
<div className="flex flex-col min-w-0">
@@ -69,7 +69,7 @@ export function MovieCard({ meta, author, createdAt }: MovieCardProps) {
<span className="text-xs text-muted-foreground/70 truncate flex-1">
{author.username.startsWith("@") ? author.username : `@${author.username}`}
</span>
<span className="text-[10px] font-medium px-2 py-0.5 rounded-full bg-blue-500/10 border border-blue-500/20 text-blue-500 shrink-0">
<span className="text-[10px] font-medium px-2 py-0.5 rounded-full bg-blue-500/10 border border-blue-500/20 text-blue-500 shrink-0 max-w-[8rem] truncate">
{author.username.split("@").filter(Boolean).at(-1)}
</span>
</div>

4
thoughts-frontend/components/thought-card.tsx
View File

@@ -160,7 +160,7 @@ export function ThoughtCard({
src={author.avatarUrl}
alt={author.displayName || author.username}
/>
<div className="flex flex-col">
<div className="flex flex-col min-w-0">
<span className="font-bold">
{author.displayName || author.username}
</span>
@@ -169,7 +169,7 @@ export function ThoughtCard({
<span className="text-xs text-muted-foreground/70 truncate flex-1">
{author.username.startsWith("@") ? author.username : `@${author.username}`}
</span>
<span className="text-[10px] font-medium px-2 py-0.5 rounded-full bg-blue-500/10 border border-blue-500/20 text-blue-500 shrink-0">
<span className="text-[10px] font-medium px-2 py-0.5 rounded-full bg-blue-500/10 border border-blue-500/20 text-blue-500 shrink-0 max-w-[8rem] truncate">
{author.username.split("@").filter(Boolean).at(-1)}
</span>
</div>