[AB-xxx] changing styling for smaller screens for member display to truncate the name

prepare for release
This commit is contained in:
Sheldan
2024-03-27 22:24:38 +01:00
parent d2bdfd8dac
commit 741c194bb8
2 changed files with 6 additions and 6 deletions

2
.env
View File

@@ -1,2 +1,2 @@
REGISTRY_PREFIX=harbor.sheldan.dev/abstracto/ REGISTRY_PREFIX=harbor.sheldan.dev/abstracto/
VERSION=1.5.32 VERSION=1.5.33

View File

@@ -8,7 +8,7 @@ export const LeaderboardEntry = ({member, index}: { member: ExperienceMember, in
let memberDisplay = memberExists ? <> let memberDisplay = memberExists ? <>
<img alt={member.member!.name} src={member.member!.avatarUrl} <img alt={member.member!.name} src={member.member!.avatarUrl}
className="object-contain h-16 w-16 rounded-full"/> className="object-contain h-16 w-16 rounded-full"/>
<span className="align-middle" style={{color: nameColor}}>{member.member!.name}</span> <span className="align-middle max-[480px]:max-w-48 truncate" style={{color: nameColor}}>{member.member!.name}</span>
</> : </> :
<span className="inline-flex items-center h-16"> <span className="inline-flex items-center h-16">
{member.id.toString()} {member.id.toString()}
@@ -20,16 +20,16 @@ export const LeaderboardEntry = ({member, index}: { member: ExperienceMember, in
className="text-center"> className="text-center">
{member.rank} {member.rank}
</td> </td>
<td className="px-2 py-4 font-medium whitespace-nowrap text-white flex items-center gap-3"> <td className="px-2 py-3 font-medium whitespace-nowrap text-white flex items-center gap-2">
{memberDisplay} {memberDisplay}
</td> </td>
<td className="px-6 py-4 text-center"> <td className="px-1 py-3 text-center">
{member.experience.toLocaleString()} {member.experience.toLocaleString()}
</td> </td>
<td className="px-6 py-4 text-center"> <td className="px-1 py-3 text-center">
{member.messages.toLocaleString()} {member.messages.toLocaleString()}
</td> </td>
<td className="px-6 py-4 text-center"> <td className="px-2 py-3 text-center">
{member.level.toString()} {member.level.toString()}
</td> </td>
</tr> </tr>