From 2a65e6d359990f1e3c04119ffe331ea4736d33cd5468b7de57d707461bf6a8ea Mon Sep 17 00:00:00 2001 From: AidarKC Date: Wed, 26 Aug 2026 12:33:18 +0400 Subject: [PATCH] =?UTF-8?q?=D0=A1=D1=82=D0=B0=D0=BD=D0=B4=D0=B0=D1=80?= =?UTF-8?q?=D1=82=D0=B8=D0=B7=D0=B8=D1=80=D0=BE=D0=B2=D0=B0=D0=BB=D0=B8=20?= =?UTF-8?q?=D1=80=D0=B0=D0=B7=D0=BC=D0=B5=D1=80=D1=8B=20=D0=B0=D0=B2=D0=B0?= =?UTF-8?q?=D1=82=D0=B0=D1=80=D0=BE=D0=B2=20=D0=B2=20UI?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- VERSION.properties | 2 +- shine-UI/js/components/avatar-image.js | 11 +- shine-UI/js/pages/add-channel-view.js | 4 +- shine-UI/js/pages/channel-thread-view.js | 4 +- shine-UI/js/pages/channel-view.js | 10 +- shine-UI/js/pages/channels-list.js | 2 +- shine-UI/js/pages/chat-view.js | 4 +- shine-UI/js/pages/contact-search-view.js | 4 +- shine-UI/js/pages/messages-list.js | 4 +- shine-UI/js/pages/notifications-view.js | 2 +- shine-UI/js/pages/profile-edit-view.js | 2 +- shine-UI/js/pages/profile-view.js | 2 +- shine-UI/js/pages/user-profile-view.js | 2 +- shine-UI/js/services/call-ui-service.js | 2 +- shine-UI/styles/components.css | 163 +++++++++++++++-------- 15 files changed, 134 insertions(+), 84 deletions(-) diff --git a/VERSION.properties b/VERSION.properties index c16c29a1..ec63d844 100644 --- a/VERSION.properties +++ b/VERSION.properties @@ -1,2 +1,2 @@ -client.version=1.7.0 +client.version=1.7.1 server.version=1.6.1 diff --git a/shine-UI/js/components/avatar-image.js b/shine-UI/js/components/avatar-image.js index 88393acc..f4e677bc 100644 --- a/shine-UI/js/components/avatar-image.js +++ b/shine-UI/js/components/avatar-image.js @@ -8,9 +8,12 @@ function normalizeLogin(value) { function pickSizeClass(size) { const raw = String(size || '').trim().toLowerCase(); - if (raw === 'large') return 'large'; if (raw === 'node') return 'node-dot'; - if (raw === 'small') return ''; + if (raw === 'xs' || raw === 'xsmall' || raw === 'tiny') return 'avatar-xs'; + if (raw === 'sm' || raw === 'small') return 'avatar-sm'; + if (raw === 'md' || raw === 'medium' || raw === '') return 'avatar-md'; + if (raw === 'lg' || raw === 'big') return 'avatar-lg'; + if (raw === 'xl' || raw === 'xlarge' || raw === 'large' || raw === 'very-large') return 'avatar-xl'; return raw || ''; } @@ -28,7 +31,7 @@ export function buildAvatarInitials({ login, firstName = '', lastName = '' } = { export function renderAvatar({ initials = '?', avatar = null, - size = 'large', + size = 'xl', className = '', title = '', alt = 'Аватар', @@ -139,7 +142,7 @@ export function renderUserAvatar({ firstName = '', lastName = '', avatar = null, - size = 'large', + size = 'xl', className = '', title = '', glow = false, diff --git a/shine-UI/js/pages/add-channel-view.js b/shine-UI/js/pages/add-channel-view.js index 2e399f62..c669341d 100644 --- a/shine-UI/js/pages/add-channel-view.js +++ b/shine-UI/js/pages/add-channel-view.js @@ -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); } diff --git a/shine-UI/js/pages/channel-thread-view.js b/shine-UI/js/pages/channel-thread-view.js index ab844774..a4082ea5 100644 --- a/shine-UI/js/pages/channel-thread-view.js +++ b/shine-UI/js/pages/channel-thread-view.js @@ -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, }); diff --git a/shine-UI/js/pages/channel-view.js b/shine-UI/js/pages/channel-view.js index 363c8ed6..8baa95fa 100644 --- a/shine-UI/js/pages/channel-view.js +++ b/shine-UI/js/pages/channel-view.js @@ -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({ `; - 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 = ''; diff --git a/shine-UI/js/pages/channels-list.js b/shine-UI/js/pages/channels-list.js index ce0cf858..fd636575 100644 --- a/shine-UI/js/pages/channels-list.js +++ b/shine-UI/js/pages/channels-list.js @@ -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: 'Аватар канала', }); diff --git a/shine-UI/js/pages/chat-view.js b/shine-UI/js/pages/chat-view.js index d9017eba..bb196e21 100644 --- a/shine-UI/js/pages/chat-view.js +++ b/shine-UI/js/pages/chat-view.js @@ -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, }); diff --git a/shine-UI/js/pages/contact-search-view.js b/shine-UI/js/pages/contact-search-view.js index 39af69e0..f423f6dd 100644 --- a/shine-UI/js/pages/contact-search-view.js +++ b/shine-UI/js/pages/contact-search-view.js @@ -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, }); diff --git a/shine-UI/js/pages/messages-list.js b/shine-UI/js/pages/messages-list.js index 9aa41db1..787e5855 100644 --- a/shine-UI/js/pages/messages-list.js +++ b/shine-UI/js/pages/messages-list.js @@ -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, }); diff --git a/shine-UI/js/pages/notifications-view.js b/shine-UI/js/pages/notifications-view.js index e6fb6f62..31a73941 100644 --- a/shine-UI/js/pages/notifications-view.js +++ b/shine-UI/js/pages/notifications-view.js @@ -165,7 +165,7 @@ function renderIdentity(item) { firstName, lastName, avatar, - size: 'small', + size: 'md', className: 'notification-avatar', })); diff --git a/shine-UI/js/pages/profile-edit-view.js b/shine-UI/js/pages/profile-edit-view.js index fad1994e..54d5b9d8 100644 --- a/shine-UI/js/pages/profile-edit-view.js +++ b/shine-UI/js/pages/profile-edit-view.js @@ -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', })); } diff --git a/shine-UI/js/pages/profile-view.js b/shine-UI/js/pages/profile-view.js index 8ba70adb..747cf990 100644 --- a/shine-UI/js/pages/profile-view.js +++ b/shine-UI/js/pages/profile-view.js @@ -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', })); } diff --git a/shine-UI/js/pages/user-profile-view.js b/shine-UI/js/pages/user-profile-view.js index 32369511..8e5ac022 100644 --- a/shine-UI/js/pages/user-profile-view.js +++ b/shine-UI/js/pages/user-profile-view.js @@ -156,7 +156,7 @@ function renderIdentity(card) { firstName: card.firstName, lastName: card.lastName, avatar: card.avatar, - size: 'large', + size: 'xl', className: 'profile-avatar', })); diff --git a/shine-UI/js/services/call-ui-service.js b/shine-UI/js/services/call-ui-service.js index 219fe9f6..fcccc286 100644 --- a/shine-UI/js/services/call-ui-service.js +++ b/shine-UI/js/services/call-ui-service.js @@ -114,7 +114,7 @@ function renderPeerAvatar(login, avatar = null) { const avatarEl = renderUserAvatar({ login: String(login || '').trim() || 'unknown', avatar, - size: 'large', + size: 'xl', className: 'call-peer-avatar', title: login ? `Профиль ${login}` : 'Профиль собеседника', }); diff --git a/shine-UI/styles/components.css b/shine-UI/styles/components.css index 8b052f45..f1fa9204 100644 --- a/shine-UI/styles/components.css +++ b/shine-UI/styles/components.css @@ -1430,10 +1430,10 @@ } .avatar { - width: 44px; - height: 44px; - min-width: 44px; - min-height: 44px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; flex: 0 0 auto; aspect-ratio: 1 / 1; border-radius: 50%; @@ -1442,11 +1442,52 @@ place-items: center; font-weight: 700; color: #e5ebff; + font-size: 14px; } -.avatar.large { - width: 82px; - height: 82px; +.avatar.avatar-xs, +.avatar.xs { + width: 20px; + height: 20px; + min-width: 20px; + min-height: 20px; + font-size: 9px; +} + +.avatar.avatar-sm, +.avatar.small { + width: 28px; + height: 28px; + min-width: 28px; + min-height: 28px; + font-size: 10px; +} + +.avatar.avatar-md, +.avatar.medium { + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; + font-size: 14px; +} + +.avatar.avatar-lg, +.avatar.big { + width: 56px; + height: 56px; + min-width: 56px; + min-height: 56px; + font-size: 18px; +} + +.avatar.avatar-xl, +.avatar.large, +.avatar.xlarge { + width: 96px; + height: 96px; + min-width: 96px; + min-height: 96px; font-size: 26px; } @@ -4143,10 +4184,10 @@ textarea.input { } .channel-row .avatar { - width: 58px; - height: 58px; - min-width: 58px; - min-height: 58px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; border-radius: 50%; background: linear-gradient(138deg, #efd193, #c18c42); color: #17233f; @@ -4390,15 +4431,15 @@ textarea.input { } .channel-message-avatar { - width: 40px; - height: 40px; - min-width: 40px; - min-height: 40px; + width: 28px; + height: 28px; + min-width: 28px; + min-height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; - font-size: 16px; + font-size: 10px; font-weight: 700; color: #f4f6ff; background: radial-gradient(circle at 30% 30%, #8a73ff, #4f4bda 58%, #3b2b89); @@ -5010,10 +5051,10 @@ textarea.input { } .channel-row .avatar { - width: 64px; - height: 64px; - min-width: 64px; - min-height: 64px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; } .channel-row-title { @@ -5754,10 +5795,10 @@ textarea.input { } .channel-row .avatar { - width: 68px; - height: 68px; - min-width: 68px; - min-height: 68px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; border-radius: 50%; overflow: hidden; color: #ffffff; @@ -6155,10 +6196,10 @@ textarea.input { .dm-card--shining { border-color: rgba(104, 216, 255, 0.45); } /* линия связи: cyan (сияющий) */ .dm-screen .list-item .avatar { - width: 48px; - height: 48px; - min-width: 48px; - min-height: 48px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; border-radius: 50%; border: 1px solid rgba(212, 175, 55, 0.45); background: @@ -6255,8 +6296,8 @@ textarea.input { .dm-name-check svg { width: 16px; height: 16px; } /* AvatarRing — обод/свечение по тону (адаптация орбов «Связей», без тяжёлой магии) */ -.dm-av { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; position: relative; } -.dm-av .avatar { width: 50px; height: 50px; min-width: 50px; min-height: 50px; border: none; box-shadow: none; } +.dm-av { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; position: relative; } +.dm-av .avatar { width: 40px; height: 40px; min-width: 40px; min-height: 40px; border: none; box-shadow: none; } /* Цветные обводки вокруг аватаров (violet/gold) убраны по просьбе. Свечение оставляем только у сияющих (ниже). */ .dm-av--default { box-shadow: none; } .dm-av--family { box-shadow: none; } @@ -7196,6 +7237,7 @@ html, body { overflow-x: hidden; } /* ===== Targeted UI touchups (requested) ===== */ .channels-screen--list .channel-row .avatar, +.profile-screen .avatar-xl, .profile-screen .avatar.large { position: relative; border-radius: 50%; @@ -7212,6 +7254,7 @@ html, body { overflow-x: hidden; } } .channels-screen--list .channel-row .avatar::after, +.profile-screen .avatar-xl::after, .profile-screen .avatar.large::after { content: ""; position: absolute; @@ -8156,6 +8199,10 @@ html, body { overflow-x: hidden; } } .notification-avatar { + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; flex: 0 0 auto; } @@ -8481,10 +8528,10 @@ body.chat-topbar-overlay .app-shell.keyboard-open .scroll-to-bottom-btn { } .chat-header-avatar-slot { - width: 28px; - height: 28px; - min-width: 28px; - min-height: 28px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; display: inline-flex; align-items: center; justify-content: center; @@ -8492,11 +8539,11 @@ body.chat-topbar-overlay .app-shell.keyboard-open .scroll-to-bottom-btn { .chat-header-avatar.avatar, .chat-header-avatar.avatar-image { - width: 28px; - height: 28px; - min-width: 28px; - min-height: 28px; - font-size: 11px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; + font-size: 14px; border: 0; box-shadow: none; } @@ -8989,10 +9036,10 @@ body.chat-topbar-overlay .app-shell.keyboard-open .scroll-to-bottom-btn { /* «Личные»: вместо жёлтого шестиугольника — текущий аватар пользователя. */ .dm-head-avatar-slot { - width: 38px; - height: 38px; - min-width: 38px; - min-height: 38px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; display: inline-flex; align-items: center; justify-content: center; @@ -9000,11 +9047,11 @@ body.chat-topbar-overlay .app-shell.keyboard-open .scroll-to-bottom-btn { .dm-head-avatar.avatar, .dm-head-avatar.avatar-image { - width: 32px; - height: 32px; - min-width: 32px; - min-height: 32px; - font-size: 12px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; + font-size: 14px; } /* Список личных чатов: без цветной границы карточки, компактная ава как в шапке @@ -9036,11 +9083,11 @@ body.chat-topbar-overlay .app-shell.keyboard-open .scroll-to-bottom-btn { .dm-list-screen .dm-av .avatar, .dm-list-screen .list-item .avatar { - width: 28px; - height: 28px; - min-width: 28px; - min-height: 28px; - font-size: 10px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; + font-size: 14px; border: 0; box-shadow: none; } @@ -9242,15 +9289,15 @@ body.chat-topbar-overlay .app-shell.keyboard-open .scroll-to-bottom-btn { .dm-head-avatar-slot, .dm-head-avatar.avatar, .dm-head-avatar.avatar-image { - width: 28px; - height: 28px; - min-width: 28px; - min-height: 28px; + width: 40px; + height: 40px; + min-width: 40px; + min-height: 40px; } .dm-head-avatar.avatar, .dm-head-avatar.avatar-image { - font-size: 11px; + font-size: 14px; } /* Composer должен быть продолжением основного фона: без верхнего разделителя