ADR-065: сообщения по сторонам — свои вправо, чужие влево
Заменяет десктопную сетку «автор 132 px + текст» (часть ADR-024) единым для десктопа и мобильного потоком: блок сообщения прижат к своему краю ленты, ширина ограничена, текст внутри блока по-прежнему слева. Разделители дат и «новые» — во всю ширину. CSS-класс grid переименован в feed-list — сетки в разметке больше нет. Проверено вживую (два аккаунта, DM, скриншоты 390 и 1280 px через Playwright/Chromium) — своя и чужая сторона видны на обоих брейкпоинтах, перенос длинного текста и разделители работают. Обновлены ui.md, identity/brief.md и эталонный мок screens.html. sw.js VERSION → v5 (менялись app.css и js/ui/chat.js, накопительно с композером из ADR-064 — ни то ни другое ещё не в проде).
This commit is contained in:
+15
-2
@@ -79,7 +79,7 @@ export function renderChat(root, ctx, chatId) {
|
||||
root.append(head(view));
|
||||
|
||||
view.feed = el("div", "feed");
|
||||
view.body = el("div", "grid");
|
||||
view.body = el("div", "feed-list");
|
||||
view.body.setAttribute("aria-live", "polite");
|
||||
view.feed.append(view.body);
|
||||
// Прокрутка к верхнему краю берёт следующую страницу (ADR-053).
|
||||
@@ -524,12 +524,25 @@ function line(view, record, previous, parent = view.body) {
|
||||
}
|
||||
// Подряд идущие сообщения одного автора — без повтора автора.
|
||||
const first = marks.length > 0 || !previous || previous.from !== record.from;
|
||||
const node = el("div", first ? "line is-head" : "line");
|
||||
const node = el("div", lineClass(record, view.me, first));
|
||||
node.append(author(view, record, first), text(view, record));
|
||||
parent.append(...marks, node);
|
||||
view.nodes.set(record.id, { node, marks });
|
||||
}
|
||||
|
||||
// lineClass — своя сторона ленты: свои сообщения вправо, чужие влево
|
||||
// (ADR-065), классом на самой строке — выравнивает feed-list.
|
||||
function lineClass(record, me, first) {
|
||||
const classes = ["line"];
|
||||
if (record.from === me) {
|
||||
classes.push("line--me");
|
||||
}
|
||||
if (first) {
|
||||
classes.push("is-head");
|
||||
}
|
||||
return classes.join(" ");
|
||||
}
|
||||
|
||||
// redraw обновляет одну строку на месте: автор и группировка от состояния
|
||||
// сообщения не зависят.
|
||||
function redraw(view, record) {
|
||||
|
||||
Reference in New Issue
Block a user