Sheldan/abstracto
1
0
Fork 0
mirror of https://github.com/Sheldan/abstracto.git synced 2026-04-14 19:56:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

[AB-xxx] changing style of leaderboard table

Browse Source 
preparing for release
This commit is contained in:
Sheldan
2024-03-26 23:48:22 +01:00
parent 287ae1f0b1
commit 8fd1aede2a
4 changed files with 15 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.env
View File

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

16
ui/experience-tracking/src/components/ExperienceConfigDisplay.tsx
View File

@@ -30,20 +30,21 @@ export const ExperienceConfigDisplay = ({serverId}: { serverId: bigint }) => {
return ( return (
<> <>
{!hasError ? {!hasError && roles.length !== 0 ?
<div className="bg-gray-800 p-4 mx-auto w-4/5 rounded-lg"> <div className="bg-gray-800 p-4 mx-auto w-4/5 rounded-lg">
<button className="w-full flex justify-between items-center p-2 px-4" onClick={toggleOpen}> <button className="w-full flex justify-between items-center p-2 px-4" onClick={toggleOpen}>
<h2 className="text-xl font-extrabold leading-none tracking-tight text-gray-100">Role config</h2> <h2 className="text-xl font-extrabold leading-none tracking-tight text-gray-100">Role config</h2>
<div> <div>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" className={`w-6 h-6 stroke-white stroke-2 duration-300 ${isOpen ? "rotate-180" : ""}`}> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" className={`w-6 h-6 stroke-white stroke-2 duration-500 ${isOpen ? "rotate-180" : ""}`}>
<path strokeLinecap="round" strike-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5"></path> <path strokeLinecap="round" strike-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5"></path>
</svg> </svg>
</div> </div>
</button> </button>
<div className={`grid grid-cols-1 ${isOpen ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]'} overflow-hidden duration-300`}> <div className={`grid grid-cols-1 ${isOpen ? 'grid-rows-[1fr]' : 'grid-rows-[0fr]'} overflow-hidden duration-500`}>
<div className="w-full gap-3 min-h-0 overflow-hidden flex flex-col items-start"> <div className="w-full min-h-0 overflow-hidden">
<div className="p-4 flex flex-col gap-3 items-start">
{roles.map(role => {roles.map(role =>
<div key={role.role.id} className="border-gray-700 flex gap-2 p-2 px-4 items-center flex-row-reverse"> <div key={role.role.id} className="border-gray-700 flex gap-4 items-center flex-row-reverse">
<p> <p>
<RoleDisplay role={role.role}/> <RoleDisplay role={role.role}/>
</p> </p>
@@ -51,11 +52,8 @@ export const ExperienceConfigDisplay = ({serverId}: { serverId: bigint }) => {
{role.level} {role.level}
</p> </p>
</div>)} </div>)}
</div>
</div> </div>
{roles.length === 0 ?
<div className="w-full flex items-center justify-center">
<span className="text-gray-400">No roles</span>
</div> : ''}
</div> </div>
</div> </div>
: ''} : ''}

2
ui/experience-tracking/src/components/Leaderboard.tsx
View File

@@ -72,7 +72,7 @@ export function Leaderboard({serverId}: { serverId: bigint }) {
</div> </div>
<div className="flex flex-col"> <div className="flex flex-col">
<div> <div className="mt-4">
<ExperienceConfigDisplay serverId={serverId}/> <ExperienceConfigDisplay serverId={serverId}/>
</div> </div>
<div className="text-sm text-left w-full mt-4"> <div className="text-sm text-left w-full mt-4">

10
ui/experience-tracking/src/components/LeaderboardEntry.tsx
View File

@@ -9,16 +9,18 @@ export const LeaderboardEntry = ({member, index}: { member: ExperienceMember, in
<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" style={{color: nameColor}}>{member.member!.name}</span>
</> : <>{member.id}</>; </> :
<span className="inline-flex items-center h-16">
{member.id.toString()}
</span>;
return ( return (
<> <>
<tr className={`${index % 2 === 0 ? "bg-gray-800" : "bg-gray-600"}`}> <tr className={`${index % 2 === 0 ? "bg-gray-600" : "bg-gray-800"} h-full`} style={{ minHeight: 64}}>
<td <td
className="text-center"> className="text-center">
{member.rank} {member.rank}
</td> </td>
<td <td className="px-2 py-4 font-medium whitespace-nowrap text-white flex items-center gap-3">
className="px-2 py-4 font-medium whitespace-nowrap text-white flex items-center gap-3">
{memberDisplay} {memberDisplay}
</td> </td>
<td className="px-6 py-4 text-center"> <td className="px-6 py-4 text-center">