Убрать меню из строк каналов

This commit is contained in:
2026-08-22 16:51:37 +03:00
parent 60c8a6608a
commit 1f1bc0a7b9
2 changed files with 26 additions and 117 deletions
-30
View File
@@ -13,7 +13,6 @@ import {
} from '../services/channels-ux.js';
import { makeShineChannelRoute } from '../services/shine-routes.js';
import { renderAvatar } from '../components/avatar-image.js';
import { createOverflowDots } from '../components/overflow-dots.js';
import { parseDmTechBlocks } from '../services/dm-tech-blocks.js';
export const pageMeta = { id: 'channels-list', title: 'Каналы' };
@@ -1217,7 +1216,6 @@ function renderListContent({ screen, container, listState, navigate, refreshFeed
const main = renderChannelMain(channel);
const isGuest = !state.session.isAuthorized;
const controls = document.createElement('div');
controls.className = 'channel-row-controls';
@@ -1231,34 +1229,6 @@ function renderListContent({ screen, container, listState, navigate, refreshFeed
count.textContent = unreadCount > 0 ? String(unreadCount) : '';
count.classList.toggle('is-empty', unreadCount <= 0);
if (!isGuest) {
const menuButton = document.createElement('button');
menuButton.type = 'button';
menuButton.className = 'channel-menu-trigger';
menuButton.append(createOverflowDots());
menuButton.addEventListener('click', (event) => {
event.stopPropagation();
animatePress(menuButton);
listState.revealedCounters.add(channel.id);
if (listState.openMenuId === channel.id) {
closeChannelMenu(listState);
rerenderList();
return;
}
listState.openMenuId = channel.id;
openChannelMenu({
listState,
channel,
anchorEl: menuButton,
refreshFeed: async () => loadFeedAndRender({ screen, listState, contentEl: container, navigate }),
rerenderList,
});
rerenderList();
});
controls.append(menuButton);
}
controls.append(time, count);
row.append(avatar, main, controls);
+26 -87
View File
@@ -4197,8 +4197,15 @@ textarea.input {
.channel-row-count {
min-width: 28px;
justify-content: center;
background: linear-gradient(140deg, rgba(223, 186, 98, 0.95), rgba(199, 155, 75, 0.95));
color: #17203a;
background: linear-gradient(180deg, #57b6ff 0%, #2a86ff 100%);
color: #ffffff;
box-shadow:
0 0 0 1px rgba(255, 255, 255, 0.08) inset,
0 0 10px rgba(52, 146, 255, 0.68),
0 0 18px rgba(52, 146, 255, 0.32);
font-size: 12px;
font-weight: 700;
line-height: 1;
}
.channels-bottom-action {
@@ -5227,6 +5234,8 @@ textarea.input {
justify-items: end;
align-content: start;
gap: 6px;
position: relative;
min-width: 44px;
}
.channel-menu-trigger {
@@ -9172,32 +9181,6 @@ body.chat-topbar-overlay .app-shell.keyboard-open .scroll-to-bottom-btn {
margin-left: 48px;
}
/* Троеточие внутри строки канала использует тот же чистый overflow-стиль:
* без рамки/подложки, белые точки с мягким голубым свечением. */
.channels-screen--list .channel-menu-trigger {
width: 34px;
height: 34px;
min-width: 34px;
min-height: 34px;
padding: 0;
display: inline-flex;
align-items: center;
justify-content: center;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
color: var(--app-topbar-gold);
text-shadow: none;
}
.channels-screen--list .channel-menu-trigger .app-overflow-dots i {
background: var(--app-topbar-gold);
box-shadow:
0 0 5px var(--app-topbar-blue-glow),
0 0 10px var(--app-topbar-blue-glow-soft);
}
/* Название канала и техническая строка (login / channel) — одна типографическая
* система с основным интерфейсом: белый текст + голубое свечение. */
.channels-screen--list .channel-row-title,
@@ -9213,76 +9196,32 @@ body.chat-topbar-overlay .app-shell.keyboard-open .scroll-to-bottom-btn {
font-weight: 700;
}
/* ===== Channels: final overflow + unread polish (2026-08-22 13:34) ===== */
/* Внутреннее троеточие карточки канала должно выглядеть ровно как остальные
* overflow-кнопки интерфейса. Более высокая специфичность намеренно перекрывает
* старые локальные стили .channel-menu-trigger. */
.channels-screen--list .channel-row .channel-row-controls > button.channel-menu-trigger {
width: 40px !important;
height: 40px !important;
min-width: 40px !important;
min-height: 40px !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
outline: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: #F7FBFF !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
font: inherit !important;
line-height: 1 !important;
appearance: none !important;
-webkit-appearance: none !important;
}
.channels-screen--list .channel-row .channel-row-controls > button.channel-menu-trigger:hover,
.channels-screen--list .channel-row .channel-row-controls > button.channel-menu-trigger:focus,
.channels-screen--list .channel-row .channel-row-controls > button.channel-menu-trigger:focus-visible,
.channels-screen--list .channel-row .channel-row-controls > button.channel-menu-trigger:active {
border: 0 !important;
outline: 0 !important;
background: transparent !important;
box-shadow: none !important;
}
.channels-screen--list .channel-row .channel-menu-trigger > .app-overflow-dots {
width: 8px !important;
height: 24px !important;
margin: 0 !important;
color: #F7FBFF !important;
filter:
drop-shadow(0 0 3px rgba(92, 190, 255, 0.72))
drop-shadow(0 0 7px rgba(72, 145, 255, 0.34));
}
.channels-screen--list .channel-row .channel-menu-trigger > .app-overflow-dots > i {
width: 4px !important;
height: 4px !important;
flex-basis: 4px !important;
border: 0 !important;
background: #F7FBFF !important;
box-shadow: none !important;
}
/* Счётчик непрочитанных: без видимой границы. Сам овал — светящийся синий объём,
* цифра остаётся обычной белой. */
.channels-screen--list .channel-row-count,
.channels-screen--list .unread.channel-row-count {
border: 0 !important;
outline: 0 !important;
background: rgba(74, 169, 255, 0.36) !important;
background: linear-gradient(180deg, #57b6ff 0%, #2a86ff 100%) !important;
color: #FFFFFF !important;
box-shadow:
0 0 8px rgba(92, 190, 255, 0.82),
0 0 18px rgba(72, 145, 255, 0.54),
0 0 30px rgba(72, 145, 255, 0.24) !important;
0 0 0 1px rgba(255, 255, 255, 0.08) inset,
0 0 10px rgba(52, 146, 255, 0.68),
0 0 18px rgba(52, 146, 255, 0.32) !important;
text-shadow: none !important;
}
.channels-screen--list .channel-row .channel-row-controls > .channel-row-count {
top: 0 !important;
right: 0 !important;
position: absolute !important;
z-index: 2;
}
.channels-screen--list .channel-row .channel-row-controls > .channel-menu-trigger {
display: none !important;
}
/* ===== Transparent topbar + scroll fade (2026-08-22 13:40) =====
* Верхняя шапка не рисует отдельную плашку. Контент прокручивается под ней и