blyzer/fasto
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: prevent long team names from breaking UI layout
All checks were successful
Build and Deploy / build-and-push (push) Successful in 1m0s
Details

Browse Source 
- Added maxLength to team creation input

- Truncated long team badges in user profile
This commit is contained in:
Cauê Faleiros
2026-03-03 17:51:15 -03:00
parent aa122d646c
commit e050cbfab1
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
pages/UserProfile.tsx
View File

@@ -145,12 +145,12 @@ export const UserProfile: React.FC = () => {
<h2 className="mt-4 text-lg font-bold text-zinc-900 dark:text-zinc-100">{user.name}</h2>
<p className="text-zinc-500 dark:text-zinc-400 text-sm">{user.email}</p>
<div className="mt-4 flex flex-wrap justify-center gap-2">
<span className="px-3 py-1 bg-purple-100 text-purple-700 rounded-full text-xs font-semibold capitalize border border-purple-200 dark:bg-purple-900/30 dark:text-purple-400 dark:border-purple-800">
<div className="mt-4 flex justify-center gap-2 max-w-full overflow-hidden px-2">
<span className="px-3 py-1 bg-purple-100 text-purple-700 rounded-full text-xs font-semibold capitalize border border-purple-200 dark:bg-purple-900/30 dark:text-purple-400 dark:border-purple-800 whitespace-nowrap shrink-0">
{user.role === 'admin' ? 'Admin' : user.role === 'manager' ? 'Gerente' : user.role === 'super_admin' ? 'Super Admin' : 'Agente'}
</span>
{user.team_id && (
<span className="px-3 py-1 bg-blue-100 text-blue-700 rounded-full text-xs font-semibold border border-blue-200 dark:bg-blue-900/30 dark:text-blue-400 dark:border-blue-800">
<span className="px-3 py-1 bg-blue-100 text-blue-700 rounded-full text-xs font-semibold border border-blue-200 dark:bg-blue-900/30 dark:text-blue-400 dark:border-blue-800 truncate max-w-[160px]" title={teamName || user.team_id}>
{teamName || user.team_id}
</span>
)}