diff --git a/VERSION.properties b/VERSION.properties index 804bc8b..22376cf 100644 --- a/VERSION.properties +++ b/VERSION.properties @@ -1,2 +1,2 @@ -client.version=1.2.165 +client.version=1.2.166 server.version=1.2.144 diff --git a/shine-UI/assets/icon_kanaly.png b/shine-UI/assets/icon_kanaly.png new file mode 100644 index 0000000..8a139aa Binary files /dev/null and b/shine-UI/assets/icon_kanaly.png differ diff --git a/shine-UI/assets/icon_lichnye.png b/shine-UI/assets/icon_lichnye.png new file mode 100644 index 0000000..6e645c7 Binary files /dev/null and b/shine-UI/assets/icon_lichnye.png differ diff --git a/shine-UI/assets/icon_profil.png b/shine-UI/assets/icon_profil.png new file mode 100644 index 0000000..1ab37d1 Binary files /dev/null and b/shine-UI/assets/icon_profil.png differ diff --git a/shine-UI/assets/icon_svyazi.png b/shine-UI/assets/icon_svyazi.png new file mode 100644 index 0000000..e0b4b2e Binary files /dev/null and b/shine-UI/assets/icon_svyazi.png differ diff --git a/shine-UI/assets/icon_uvedomleniya.png b/shine-UI/assets/icon_uvedomleniya.png new file mode 100644 index 0000000..bec52ea Binary files /dev/null and b/shine-UI/assets/icon_uvedomleniya.png differ diff --git a/shine-UI/js/components/toolbar.js b/shine-UI/js/components/toolbar.js index f661fc0..4f66168 100644 --- a/shine-UI/js/components/toolbar.js +++ b/shine-UI/js/components/toolbar.js @@ -2,14 +2,23 @@ import { resolveToolbarActive } from '../router.js'; import { state } from '../state.js'; import { openAuthRequiredModal } from '../services/auth-required-modal.js'; +// iconImg — путь к неоновой PNG (если есть, рисуем картинку вместо эмодзи); glow — цвет доп.свечения +// активной/нажатой вкладки (var --tab-glow); hero — «герой»-вкладка (крупнее/ярче, всегда светится). +// Пока подключена только «Связи»; остальные 4 — эмодзи до подготовки ассетов (имена подставлю). const ITEMS = [ - { pageId: 'messages-list', label: 'Личные сообщения', icon: '💬' }, - { pageId: 'channels-list', label: 'Каналы', icon: '📢' }, - { pageId: 'network-view', label: 'Связи', icon: '🕸' }, - { pageId: 'notifications-view', label: 'Уведомления', icon: '🔔' }, - { pageId: 'profile-view', label: 'Профиль', icon: '👤' }, + { pageId: 'messages-list', label: 'Личные сообщения', icon: '💬', iconImg: '/assets/icon_lichnye.png', glow: 'rgba(0, 229, 255, .6)' }, + { pageId: 'channels-list', label: 'Каналы', icon: '📢', iconImg: '/assets/icon_kanaly.png', glow: 'rgba(0, 229, 255, .6)' }, + { pageId: 'network-view', label: 'Связи', icon: '🕸', iconImg: '/assets/icon_svyazi.png', glow: 'rgba(0, 229, 255, .6)', hero: true }, + { pageId: 'notifications-view', label: 'Уведомления', icon: '🔔', iconImg: '/assets/icon_uvedomleniya.png', glow: 'rgba(0, 229, 255, .6)' }, + { pageId: 'profile-view', label: 'Профиль', icon: '👤', iconImg: '/assets/icon_profil.png', glow: 'rgba(0, 229, 255, .6)' }, ]; +function iconHtml(item) { + return item.iconImg + ? `` + : `${item.icon}`; +} + function getTotalUnreadMessages() { const chats = Object.values(state.chats || {}); let total = 0; @@ -62,10 +71,10 @@ export function renderToolbar(currentPageId, navigate) { const isProfile = item.pageId === 'profile-view'; const isMessages = item.pageId === 'messages-list'; const isNetwork = item.pageId === 'network-view'; - btn.className = `toolbar-btn${item.pageId === active ? ' active' : ''}${isProfile ? ' toolbar-btn-profile' : ''}${isMessages ? ' toolbar-btn-messages' : ''}${isNetwork ? ' toolbar-btn-network' : ''}`; + btn.className = `toolbar-btn${item.pageId === active ? ' active' : ''}${isProfile ? ' toolbar-btn-profile' : ''}${isMessages ? ' toolbar-btn-messages' : ''}${isNetwork ? ' toolbar-btn-network' : ''}${item.hero ? ' toolbar-btn-hero' : ''}`; if (isProfile) { btn.innerHTML = ` - ${item.icon} + ${iconHtml(item)} ${item.label} @@ -75,7 +84,7 @@ export function renderToolbar(currentPageId, navigate) { `; } else { - btn.innerHTML = `${item.icon}${item.label}`; + btn.innerHTML = `${iconHtml(item)}${item.label}`; } if (isMessages && unreadTotal > 0) { const badge = document.createElement('span'); diff --git a/shine-UI/styles/components.css b/shine-UI/styles/components.css index 17519f8..2bbe08a 100644 --- a/shine-UI/styles/components.css +++ b/shine-UI/styles/components.css @@ -1,3 +1,9 @@ +/* Глобально отключаем синюю tap-подсветку мобильных браузеров/WebView на ВСЕХ элементах + (Android/Chromium): синего квадрата при нажатии нигде быть не должно. */ +* { + -webkit-tap-highlight-color: transparent; +} + .page-header { display: flex; align-items: center; @@ -3928,6 +3934,39 @@ textarea.input { text-shadow: 0 0 10px rgba(212, 175, 55, 0.6); } +/* Неоновые PNG-иконки вкладок (свечение запечено в PNG). Цвет доп.свечения — var --tab-glow (инлайн на img). */ +.toolbar-icon-img { + --tab-icon-size: 27px; /* крупнее (бар-иконки); герой ниже ещё больше */ + width: var(--tab-icon-size); + height: var(--tab-icon-size); + object-fit: contain; + display: block; + transition: transform .12s ease, filter .15s ease; +} +/* Активная вкладка — лёгкое доп. свечение (подпись подсвечивается правилом .active span:last-child выше). */ +.toolbar-btn.active .toolbar-icon-img { + filter: drop-shadow(0 0 5px var(--tab-glow)) brightness(1.08); +} +/* Нажатие — вдавливание + краткая вспышка свечения; на отпускании возврат. */ +.toolbar-btn:active .toolbar-icon-img { + transform: scale(0.9); + filter: drop-shadow(0 0 9px var(--tab-glow)) brightness(1.2); +} +/* «Связи» — герой: крупнее и всегда чуть светится сильнее остальных; press-feedback ярче. */ +.toolbar-btn-hero .toolbar-icon-img { + /* Крупнее ВИЗУАЛЬНО через transform (origin center) — раскладочный размер как у остальных (27px), + поэтому иконка остаётся на одной линии с другими, а не задирается вверх. */ + transform: scale(1.63); /* ≈44px при базовых 27px */ + filter: brightness(1.05); /* CSS-ореол убран — светится только сама PNG (логотип не тронут) */ +} +.toolbar-btn-hero.active .toolbar-icon-img { + filter: brightness(1.12); +} +.toolbar-btn-hero:active .toolbar-icon-img { + transform: scale(1.47); /* 1.63 × 0.9 (нажатие) */ + filter: brightness(1.25); /* нажатие — только подсветление, без ореола */ +} + .toolbar-channels-hold-overlay { position: fixed; z-index: 1200; @@ -4344,10 +4383,17 @@ textarea.input { .toolbar-btn-network { position: relative; overflow: hidden; + -webkit-tap-highlight-color: transparent; /* нет синей вспышки-квадрата при тапе (Android WebView/Chromium) */ +} +/* нет рамки/подсветки фокуса ВОКРУГ кнопки — светится только сама иконка (её drop-shadow) */ +.toolbar-btn-network:focus, +.toolbar-btn-network:focus-visible { + outline: none; } .toolbar-btn-network::before { content: ""; + display: none; /* подсветка-подложка вокруг иконки «Связи» убрана по запросу (иконка и её drop-shadow-ореол не тронуты) */ position: absolute; inset: 6px; border-radius: 10px;