Robotail/Corp
Robotail/Corp
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(frontend): normalize avatar fallback initials

Browse Source
This commit is contained in:
lizerk 2026-04-13 16:05:23 +03:00
parent a3b309c84d
commit 3a70060a62
5 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/app/globals.css
View File

@ -343,9 +343,15 @@ html[data-bs-theme="dark"] .app-input::-webkit-calendar-picker-indicator {
}
.app-avatar-fallback {
display: inline-flex;
align-items: center;
justify-content: center;
border: 1px solid color-mix(in srgb, var(--accent-primary) 18%, var(--border-subtle));
background: color-mix(in srgb, var(--accent-primary) 18%, var(--surface-secondary));
color: var(--accent-primary-strong);
line-height: 1;
text-align: center;
white-space: nowrap;
}
.app-counter {

2
frontend/src/app/messages/page.tsx
View File

@ -520,7 +520,7 @@ export default function MessagesPage() {
>
<div className="flex items-start gap-3">
<div className="relative h-10 w-10">
<div className="flex h-10 w-10 items-center justify-center overflow-hidden rounded-full bg-sky-400 text-xs font-semibold text-white">
<div className="app-avatar-fallback flex h-10 w-10 items-center justify-center overflow-hidden rounded-full text-xs font-semibold">
{chatAvatar ? (
<Image
src={resolveMediaUrl(chatAvatar)}

2
frontend/src/components/AppShell.tsx
View File

@ -178,7 +178,7 @@ function Header({ onOpenLeftNav, onOpenCalendar }: HeaderProps) {
<NotificationCenter />
<div className="ml-1 relative h-10 w-10" id="user-menu-root">
<div
className="flex h-10 w-10 items-center justify-center overflow-hidden rounded-full bg-sky-400 text-sm font-semibold text-white hover:bg-sky-500 cursor-pointer"
className="app-avatar-fallback flex h-10 w-10 cursor-pointer items-center justify-center overflow-hidden rounded-full text-sm font-semibold hover:bg-[var(--accent-soft-strong)]"
title={userName}
onClick={() => setUserMenuOpen((v) => !v)}
>

2
frontend/src/components/layout/MobileDrawers.tsx
View File

@ -58,7 +58,7 @@ export function MobileLeftDrawer({ isOpen, onClose, children }: LeftNavDrawerPro
onClick={() => setIsProfileExpanded(!isProfileExpanded)}
className="flex w-full items-center gap-3 p-4 transition-colors hover:bg-[var(--accent-soft)]"
>
<div className="h-12 w-12 overflow-hidden rounded-full bg-sky-400 text-sm font-semibold text-white flex items-center justify-center flex-shrink-0">
<div className="app-avatar-fallback flex h-12 w-12 flex-shrink-0 items-center justify-center overflow-hidden rounded-full text-sm font-semibold">
{user?.avatar ? (
<img src={user.avatar} alt={userName} className="h-full w-full object-cover" />
) : (

2
frontend/src/components/messages/ChatMessageItem.tsx
View File

@ -147,7 +147,7 @@ export default function ChatMessageItem({
<div className={`flex ${isMine ? "justify-end" : "justify-start"}`}>
{!isMine ? (
<div className="relative mr-2 mt-1 h-8 w-8 shrink-0">
<div className="flex h-8 w-8 items-center justify-center overflow-hidden rounded-full bg-sky-400 text-[10px] font-semibold text-white">
<div className="app-avatar-fallback flex h-8 w-8 items-center justify-center overflow-hidden rounded-full text-[10px] font-semibold">
{message.avatar || message.author?.avatar ? (
<Image
src={resolveMediaUrl(message.avatar || message.author?.avatar || "")}