julienfroidefond/got-gaming
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: user admin ui : condensed

Browse Source
This commit is contained in:
Julien Froidefond
2025-12-09 12:40:45 +01:00
parent d1e94f1402
commit f732eb7385
1 changed files with 28 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

56
components/UserManagement.tsx
View File

@@ -146,12 +146,12 @@ export default function UserManagement() {
return (
<div
key={user.id}
className="bg-black/60 border border-pixel-gold/20 rounded p-4"
className="bg-black/60 border border-pixel-gold/20 rounded p-3"
>
<div className="flex justify-between items-start mb-4">
<div className="flex gap-4 items-start">
<div className="flex justify-between items-center mb-2">
<div className="flex gap-3 items-center flex-1 min-w-0">
{/* Avatar */}
<div className="w-16 h-16 rounded-full border-2 border-pixel-gold/50 overflow-hidden bg-black/60 flex-shrink-0">
<div className="w-10 h-10 rounded-full border-2 border-pixel-gold/50 overflow-hidden bg-black/60 flex-shrink-0">
{user.avatar ? (
<img
src={user.avatar}
@@ -163,28 +163,28 @@ export default function UserManagement() {
}}
/>
) : null}
<div className={`w-full h-full flex items-center justify-center text-pixel-gold text-xl font-bold ${user.avatar ? "hidden" : ""}`}>
<div className={`w-full h-full flex items-center justify-center text-pixel-gold text-sm font-bold ${user.avatar ? "hidden" : ""}`}>
{user.username.charAt(0).toUpperCase()}
</div>
</div>
<div>
<h3 className="text-pixel-gold font-bold text-lg">
{user.username}
</h3>
<p className="text-gray-400 text-sm">{user.email}</p>
<div className="flex gap-4 mt-2 text-xs text-gray-500">
<span>Niveau {user.level}</span>
<span>Score: {formatNumber(user.score)}</span>
<span className={user.role === "ADMIN" ? "text-pixel-gold" : ""}>
<div className="flex-1 min-w-0">
<div className="flex items-center gap-2 flex-wrap">
<h3 className="text-pixel-gold font-bold text-base">
{user.username}
</h3>
<span className="text-xs text-gray-500">Niveau {user.level}</span>
<span className="text-xs text-gray-500">Score: {formatNumber(user.score)}</span>
<span className={`text-xs ${user.role === "ADMIN" ? "text-pixel-gold" : "text-gray-500"}`}>
{user.role}
</span>
</div>
<p className="text-gray-400 text-xs truncate">{user.email}</p>
</div>
</div>
{!isEditing && (
<button
onClick={() => handleEdit(user)}
className="px-4 py-2 border border-pixel-gold/50 bg-black/60 text-white uppercase text-xs tracking-widest rounded hover:bg-pixel-gold/10 transition"
className="px-3 py-1.5 border border-pixel-gold/50 bg-black/60 text-white uppercase text-xs tracking-widest rounded hover:bg-pixel-gold/10 transition flex-shrink-0 ml-2"
>
Modifier
</button>
@@ -510,15 +510,15 @@ export default function UserManagement() {
</div>
</div>
) : (
<div className="space-y-2">
<div>
<div className="flex justify-between items-center mb-1">
<span className="text-xs text-gray-400">HP</span>
<span className="text-xs text-gray-400">
{user.hp} / {user.maxHp}
<div className="flex gap-4 text-xs">
<div className="flex-1">
<div className="flex justify-between items-center mb-0.5">
<span className="text-gray-400">HP</span>
<span className="text-gray-400">
{user.hp}/{user.maxHp}
</span>
</div>
<div className="h-2 bg-black/60 rounded-full overflow-hidden">
<div className="h-1.5 bg-black/60 rounded-full overflow-hidden">
<div
className="h-full bg-gradient-to-r from-red-600 to-green-500"
style={{
@@ -527,14 +527,14 @@ export default function UserManagement() {
/>
</div>
</div>
<div>
<div className="flex justify-between items-center mb-1">
<span className="text-xs text-gray-400">XP</span>
<span className="text-xs text-gray-400">
{formatNumber(user.xp)} / {formatNumber(user.maxXp)}
<div className="flex-1">
<div className="flex justify-between items-center mb-0.5">
<span className="text-gray-400">XP</span>
<span className="text-gray-400">
{formatNumber(user.xp)}/{formatNumber(user.maxXp)}
</span>
</div>
<div className="h-2 bg-black/60 rounded-full overflow-hidden">
<div className="h-1.5 bg-black/60 rounded-full overflow-hidden">
<div
className="h-full bg-gradient-to-r from-blue-600 to-purple-500"
style={{