Стандартизировали размеры аватаров в UI

This commit is contained in:
AidarKC
2026-08-26 12:33:18 +04:00
parent 83f87ba22c
commit 2a65e6d359
15 changed files with 134 additions and 84 deletions
+2 -2
View File
@@ -44,12 +44,12 @@ function renderAvatarPreview(slot, avatar, title) {
const wrap = renderAvatar({
initials: label.slice(0, 1).toUpperCase() || 'К',
avatar,
size: 'small',
size: 'xl',
className: 'channel-profile-avatar',
title: label,
alt: 'Аватар канала',
});
wrap.style.setProperty('--channel-avatar-size', '104px');
wrap.style.setProperty('--channel-avatar-size', '96px');
slot.append(wrap);
}
+2 -2
View File
@@ -62,7 +62,7 @@ function createThreadAvatar(login) {
const title = cleanLogin ? `Профиль ${cleanLogin}` : '';
const avatarEl = renderUserAvatar({
login: cleanLogin || 'unknown',
size: 'small',
size: 'sm',
className: 'channel-message-avatar',
title,
});
@@ -77,7 +77,7 @@ function createThreadAvatar(login) {
sha256Hex: String(snapshot?.avatar?.sha256Hex || '').trim().toLowerCase(),
}
: null,
size: 'small',
size: 'sm',
className: 'channel-message-avatar',
title,
});
+5 -5
View File
@@ -86,7 +86,7 @@ function createMessageAvatar(login) {
const title = cleanLogin ? `Профиль ${cleanLogin}` : '';
const avatarEl = renderUserAvatar({
login: cleanLogin || 'unknown',
size: 'small',
size: 'sm',
className: 'channel-message-avatar',
title,
});
@@ -101,7 +101,7 @@ function createMessageAvatar(login) {
sha256Hex: String(snapshot?.avatar?.sha256Hex || '').trim().toLowerCase(),
}
: null,
size: 'small',
size: 'sm',
className: 'channel-message-avatar',
title,
});
@@ -577,13 +577,13 @@ function getStatusActionOptionsForTarget(targetMsgSubType) {
}
}
function createChannelAvatarElement(channel, size = 72) {
function createChannelAvatarElement(channel, size = 96) {
const txId = String(channel?.avaAr || '').trim();
const title = String(channel?.displayTitle || channel?.name || 'К').trim() || 'К';
const wrap = renderAvatar({
initials: title.slice(0, 1).toUpperCase() || 'К',
avatar: txId ? { ar: txId } : null,
size: 'small',
size: 'xl',
className: 'channel-profile-avatar',
title,
alt: 'Аватар канала',
@@ -626,7 +626,7 @@ function openChannelMetaDetailsModal({
</div>
</div>
`;
root.querySelector('#about-channel-avatar-slot')?.append(createChannelAvatarElement(channel, 86));
root.querySelector('#about-channel-avatar-slot')?.append(createChannelAvatarElement(channel, 96));
root.querySelector('#about-channel-close')?.addEventListener('click', () => {
root.innerHTML = '';
+1 -1
View File
@@ -94,7 +94,7 @@ function createChannelAvatar(channel = {}) {
return renderAvatar({
initials: channel.avatar || channel.initials || avatarLetterFromName(channel.displayTitle || channel.title || channel.name),
avatar: channel.avaAr ? { ar: String(channel.avaAr || '').trim() } : null,
size: 'small',
size: 'md',
title: channel.displayTitle || channel.title || channel.name || 'Канал',
alt: 'Аватар канала',
});
+2 -2
View File
@@ -43,7 +43,7 @@ function createChatHeaderParts(login, navigate) {
avatarSlot.className = 'chat-header-avatar-slot chat-header-avatar-slot--left';
const initialAvatar = renderUserAvatar({
login: cleanLogin,
size: 'small',
size: 'md',
className: 'chat-header-avatar',
title: cleanLogin,
});
@@ -76,7 +76,7 @@ function createChatHeaderParts(login, navigate) {
sha256Hex: String(snapshot?.avatar?.sha256Hex || '').trim().toLowerCase(),
}
: null,
size: 'small',
size: 'md',
className: 'chat-header-avatar',
title: cleanLogin,
});
+2 -2
View File
@@ -34,7 +34,7 @@ function createSearchAvatar(login) {
const title = cleanLogin ? `Профиль ${cleanLogin}` : '';
const avatarEl = renderUserAvatar({
login: cleanLogin || 'unknown',
size: 'small',
size: 'md',
className: 'avatar',
title,
});
@@ -49,7 +49,7 @@ function createSearchAvatar(login) {
sha256Hex: String(snapshot?.avatar?.sha256Hex || '').trim().toLowerCase(),
}
: null,
size: 'small',
size: 'md',
className: 'avatar',
title,
});
+2 -2
View File
@@ -52,7 +52,7 @@ function createDmAvatar(login, { className = '' } = {}) {
const title = cleanLogin ? `Профиль ${cleanLogin}` : '';
const avatarEl = renderUserAvatar({
login: cleanLogin || 'unknown',
size: 'small',
size: 'md',
title,
className,
});
@@ -67,7 +67,7 @@ function createDmAvatar(login, { className = '' } = {}) {
sha256Hex: String(snapshot?.avatar?.sha256Hex || '').trim().toLowerCase(),
}
: null,
size: 'small',
size: 'md',
title,
className,
});
+1 -1
View File
@@ -165,7 +165,7 @@ function renderIdentity(item) {
firstName,
lastName,
avatar,
size: 'small',
size: 'md',
className: 'notification-avatar',
}));
+1 -1
View File
@@ -229,7 +229,7 @@ export function render({ navigate, chrome }) {
avatar: currentAvatar?.txId
? { ar: currentAvatar.txId, sha256Hex: String(currentAvatar?.sha256Hex || '').trim().toLowerCase() }
: null,
size: 'large',
size: 'xl',
className: 'profile-avatar',
}));
}
+1 -1
View File
@@ -252,7 +252,7 @@ export function render({ navigate, chrome }) {
avatar: currentAvatar?.txId
? { ar: currentAvatar.txId, sha256Hex: String(currentAvatar?.sha256Hex || '').trim().toLowerCase() }
: null,
size: 'large',
size: 'xl',
className: 'profile-avatar',
}));
}
+1 -1
View File
@@ -156,7 +156,7 @@ function renderIdentity(card) {
firstName: card.firstName,
lastName: card.lastName,
avatar: card.avatar,
size: 'large',
size: 'xl',
className: 'profile-avatar',
}));