trafficlunar/tomodachi-share
1
0
Fork 0
mirror of https://github.com/trafficlunar/tomodachi-share.git synced 2026-05-13 13:17:45 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: text overflow on profiles and miis

Browse source
This commit is contained in:
trafficlunar 2026-03-29 12:36:48 +01:00
parent 971f0c3c00
commit 41a31311b5
4 changed files with 10 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
next.config.ts
View file

@ -15,7 +15,7 @@ const nextConfig: NextConfig = {
pathname: "/tutorial/**", pathname: "/tutorial/**",
}, },
{ {
pathname: "/guest.webp", pathname: "/guest.png",
}, },
], ],
remotePatterns: [ remotePatterns: [

2
src/app/mii/[id]/page.tsx
View file

@ -314,7 +314,7 @@ export default async function MiiPage({ params }: Props) {
<div className="bg-amber-50 border-2 border-amber-500 rounded-2xl shadow-lg p-4 flex flex-col gap-1"> <div className="bg-amber-50 border-2 border-amber-500 rounded-2xl shadow-lg p-4 flex flex-col gap-1">
<div className="flex justify-between items-start"> <div className="flex justify-between items-start">
{/* Submission name */} {/* Submission name */}
<h1 className="text-4xl font-extrabold wrap-break-word text-amber-700">{mii.name}</h1> <h1 className="text-4xl font-extrabold wrap-break-word whitespace-break-spaces text-amber-700 flex-1 min-w-0">{mii.name}</h1>
{/* Like button */} {/* Like button */}
<LikeButton likes={mii._count.likedBy ?? 0} miiId={mii.id} isLiked={(mii.likedBy ?? []).length > 0} big /> <LikeButton likes={mii._count.likedBy ?? 0} miiId={mii.id} isLiked={(mii.likedBy ?? []).length > 0} big />
</div> </div>

10
src/components/mii/list/index.tsx
View file

@ -205,16 +205,18 @@ export default async function MiiList({ searchParams, userId, inLikesPage }: Pro
/> />
<div className="p-4 flex flex-col gap-1 h-full"> <div className="p-4 flex flex-col gap-1 h-full">
<Link href={`/mii/${mii.id}`} className="relative font-bold text-2xl line-clamp-1" title={mii.name}> <div className="flex justify-between items-center">
<Link href={`/mii/${mii.id}`} className="relative font-bold text-2xl line-clamp-1 w-full" title={mii.name}>
{mii.name} {mii.name}
<div className="absolute right-0 top-1/2 -translate-y-1/2 text-[1.25rem] opacity-25"> </Link>
<div title={mii.platform === "SWITCH" ? "Switch" : "3DS"} className="-mr-3 text-[1.25rem] opacity-25">
{mii.platform === "SWITCH" ? ( {mii.platform === "SWITCH" ? (
<Icon icon="cib:nintendo-switch" className="text-red-400" /> <Icon icon="cib:nintendo-switch" className="text-red-400" />
) : ( ) : (
<Icon icon="cib:nintendo-3ds" className="text-sky-400" /> <Icon icon="cib:nintendo-3ds" className="text-sky-400" />
)} )}
</div> </div>
</Link> </div>
<div id="tags" className="flex flex-wrap gap-1"> <div id="tags" className="flex flex-wrap gap-1">
{mii.tags.map((tag) => ( {mii.tags.map((tag) => (
<Link href={{ query: { tags: tag } }} key={tag} className="px-2 py-1 bg-orange-300 rounded-full text-xs"> <Link href={{ query: { tags: tag } }} key={tag} className="px-2 py-1 bg-orange-300 rounded-full text-xs">
@ -227,7 +229,7 @@ export default async function MiiList({ searchParams, userId, inLikesPage }: Pro
<LikeButton likes={mii.likes} miiId={mii.id} isLiked={mii.isLiked} abbreviate /> <LikeButton likes={mii.likes} miiId={mii.id} isLiked={mii.isLiked} abbreviate />
{!userId && ( {!userId && (
<Link href={`/profile/${mii.user?.id}`} className="text-sm text-right overflow-hidden text-ellipsis"> <Link href={`/profile/${mii.user?.id}`} className="text-sm text-right overflow-hidden text-ellipsis whitespace-nowrap">
@{mii.user?.name} @{mii.user?.name}
</Link> </Link>
)} )}

2
src/components/profile-settings/index.tsx
View file

@ -123,7 +123,7 @@ export default function ProfileSettings({ currentDescription }: Props) {
</div> </div>
<div className="flex justify-end gap-1 h-min col-span-2"> <div className="flex justify-end gap-1 h-min col-span-2">
<input type="text" className="pill input flex-1" placeholder="Type here..." value={name} onChange={(e) => setName(e.target.value)} /> <input type="text" className="pill input flex-1" placeholder="Type here..." maxLength={64} value={name} onChange={(e) => setName(e.target.value)} />
<SubmitDialogButton <SubmitDialogButton
title="Confirm Name Change" title="Confirm Name Change"
description="Are you sure? You can change it again later." description="Are you sure? You can change it again later."