Дмитрий
887abf444e
Получен handoff-пакет liderra_v8_handoff/ от дизайнера Платона (kpd9363@gmail.com) от 07.05.2026 — v8 Forest. Заказчик 08.05 решил применить только в части дизайна, имени, логотипа. Функционал, состав страниц и правила (CTO-11, click-wrap, SSO break-glass, 14 статусов воронки) — без изменений (источник — ТЗ v8.5/schema v8.5). Что сделано: - Массовая замена Лидпоток→Лидерра (с учётом падежей: Лидерры/Лидерре) в 33 файлах (449 вхождений) — все .md/.sql/.json/.toml/.yml/.txt/.html, кроме исторических упоминаний внутри liderra_v8_handoff/ - Удалён docs/brandbook.md v1.1 — заменён на BRANDBOOK_v2.md из handoff - Скопированы 13 концептов liderra_v8_handoff/concepts/v8_*.html в web/v8/. Удалены старые web/01-login.html, 02-dashboard.html, 03-deals.html, index.html (палитра v1.1 deprecated) - CLAUDE.md v1.0→v1.1: §0 (BRANDBOOK_v2 + DEVELOPER_HANDOFF в источниках), §2 (палитра Forest, Inter+JBM, Lucide), §5 п.6 (anti-pattern Inter снят — в Forest Inter наш основной шрифт), §6 (13 концептов в web/v8/) - Реестр Открытые_вопросы_v8_3.md v1.12→v1.13: добавлена запись о ребрендинге + 4 точечных расхождений handoff vs ТЗ (статусы воронки, click-wrap чекбоксы, SSO fallback, axe violations) - package.json/package-lock.json: name lidpotok→liderra 4 расхождения handoff vs ТЗ (НЕ применены, источник истины — ТЗ/schema): 1. 14 «обобщённых» статусов в BRANDBOOK_v2 §3.6 ≠ 14 slug'ов в schema.sql:2076 (совпадает 2 из 14: «Переговоры», «Оплачено»). Источник — schema/ТЗ §6.4 (реселлерская модель из аудита crm.bp-gr.ru, 6 системных + 8 настраиваемых статусов). 2. 3-й click-wrap в v8_login.html («маркетинг-опционально») ≠ ТЗ §1.5/§4.1 («согласие на ПДн», обязательное, OPEN-Ж-3). 3. SSO в v8_admin.html («локальный 2FA fallback») ≠ ТЗ OPEN-И-13 (break-glass super_admin, локальный 2FA выключен). 4. Заявление «axe-core 4.10.2 — 0 violations» в README handoff — локально Pa11y 9.1.1 + axe нашёл 81 violation на 10/13 HTML (преимущественно color-contrast на декоративных separator'ах с --ink-disabled). Чисто: settings/errors/palette_options. Что НЕ включено в коммит: - лендинг/TZ_landing_v1_0.md — untracked, не моя работа в этой сессии - .tmp/ — gitignored Что осталось (для следующих сессий): - Возможное переименование GitHub-репо CoralMinister/lidpotok → liderra (отдельное решение заказчика) - Опционально: обратная связь Платону по 4 расхождениям handoff vs ТЗ Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
416 lines
36 KiB
HTML
416 lines
36 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<title>v8 · Канбан — Лидерра (Forest)</title>
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,400;14..32,500;14..32,600;14..32,700&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
||
<style>
|
||
*, *::before, *::after { box-sizing: border-box; }
|
||
html, body { margin: 0; padding: 0; }
|
||
@media (prefers-reduced-motion: reduce) { .has-motion { animation: none !important; transition: none !important; } }
|
||
|
||
:root {
|
||
--bg:#F6F3EC; --surface:#FFFDFA; --sunken:#F0EDE4;
|
||
--hairline:#D9D5CD; --hairline-soft:#E8E3D6;
|
||
--ink:#081319; --ink-2:#343C41; --ink-3:#66635C; --ink-disabled:#92907B;
|
||
--accent:#0F6E56; --accent-tint:#E1EEEA; --accent-deep:#084635;
|
||
--side-bg:#012019; --side-text:#B1C2BD; --side-text-2:#7A8C87;
|
||
--side-active:#13382F; --side-icon:#5C7A72; --side-icon-act:#32C8A9;
|
||
--side-hover:#0A2A22; --side-border:#1A3A30;
|
||
--st-new:#B94837; --st-work:#B35100; --st-call:#9A6700; --st-nocall:#7E7500;
|
||
--st-neg:#538200; --st-quote:#008A4D; --st-think:#008C7E; --st-wait:#00889B;
|
||
--st-paid:#007EB8; --st-refund:#406DC8; --st-fail:#6C60C4;
|
||
--st-dup:#9052AE; --st-spam:#AA4788; --st-arch:#B7445F;
|
||
--r-xs:4px; --r-sm:6px; --r-md:10px; --r-lg:14px;
|
||
--font-ui:'Inter',system-ui,sans-serif;
|
||
--font-mono:'JetBrains Mono',ui-monospace,monospace;
|
||
}
|
||
body { background:var(--bg); color:var(--ink); font-family:var(--font-ui); font-feature-settings:'cv11','ss01'; -webkit-font-smoothing:antialiased; font-variation-settings:'opsz' 14; min-height:100vh; }
|
||
button { font-family:inherit; }
|
||
a { color:inherit; text-decoration:none; }
|
||
a:focus-visible, button:focus-visible, [tabindex]:focus-visible {
|
||
outline:2px solid var(--accent); outline-offset:2px; border-radius:var(--r-sm);
|
||
}
|
||
.skip-link { position:absolute; top:-40px; left:12px; background:var(--ink); color:#fff; padding:9px 16px; z-index:200; font-weight:600; border-radius:var(--r-sm); }
|
||
.skip-link:focus { top:12px; }
|
||
|
||
/* Shell */
|
||
.app { display:grid; grid-template-columns:232px 1fr; min-height:100vh; }
|
||
.side { background:var(--side-bg); border-right:1px solid var(--side-border); padding:18px 12px 24px; position:sticky; top:0; height:100vh; overflow-y:auto; color:var(--side-text); }
|
||
.brand { display:flex; align-items:center; gap:10px; padding:6px 8px 18px; font-weight:600; font-size:14.5px; letter-spacing:-0.01em; font-variation-settings:'opsz' 18; color:#FFF; }
|
||
.brand-mark { width:22px; height:22px; border-radius:var(--r-xs); background:#FFF; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; overflow:hidden; }
|
||
.brand-mark svg { width:100%; height:100%; display:block; }
|
||
.brand-dot { color:var(--side-icon-act); }
|
||
.nav { display:flex; flex-direction:column; gap:1px; }
|
||
.nav-eyebrow { font-size:11px; font-weight:500; letter-spacing:0.01em; color:var(--side-text-2); padding:14px 10px 6px; }
|
||
.nav-item { display:flex; align-items:center; gap:10px; height:32px; padding:0 10px; border-radius:var(--r-sm); font-size:13px; color:var(--side-text); }
|
||
.nav-item:hover { background:var(--side-hover); color:#FFF; }
|
||
.nav-item.active { background:var(--side-active); color:#FFF; font-weight:500; }
|
||
.nav-item.active .nav-icon { color:var(--side-icon-act); }
|
||
.nav-icon { width:15px; height:15px; flex-shrink:0; color:var(--side-icon); stroke-width:1.6; }
|
||
.nav-item:hover .nav-icon { color:#FFF; }
|
||
.nav-text { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
||
.nav-count { font-family:var(--font-mono); font-size:10.5px; font-weight:500; font-feature-settings:'tnum'; background:rgba(255,255,255,0.10); color:var(--side-text); padding:2px 6px; border-radius:4px; }
|
||
.main { display:flex; flex-direction:column; min-width:0; }
|
||
.topbar { height:48px; border-bottom:1px solid var(--hairline); background:var(--surface); padding:0 24px; display:flex; align-items:center; gap:12px; position:sticky; top:0; z-index:50; }
|
||
.crumb { font-size:12.5px; color:var(--ink-3); display:flex; align-items:center; gap:8px; }
|
||
.crumb strong { color:var(--ink); font-weight:500; }
|
||
.crumb svg { width:11px; height:11px; color:var(--ink-3); opacity:0.5; }
|
||
.topbar-spacer { flex:1; }
|
||
.user-chip { display:inline-flex; align-items:center; gap:8px; height:30px; padding:0 10px 0 4px; border-radius:100px; border:1px solid var(--hairline); background:var(--surface); }
|
||
.user-chip .ava { width:22px; height:22px; border-radius:50%; background:var(--ink); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:9.5px; font-weight:600; }
|
||
.user-chip .uname { font-size:12px; color:var(--ink); font-weight:500; }
|
||
|
||
/* Page */
|
||
.content { padding:20px 24px 24px; flex:1; display:flex; flex-direction:column; min-height:0; }
|
||
.page-h { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; gap:12px; flex-wrap:wrap; }
|
||
.page-h-l { display:flex; align-items:baseline; gap:14px; }
|
||
.page-title { font-size:22px; font-weight:600; font-variation-settings:'opsz' 24; letter-spacing:-0.018em; line-height:1.1; margin:0; }
|
||
.page-stats { font-size:12px; color:var(--ink-3); display:flex; gap:10px; align-items:center; }
|
||
.page-stats .num { font-family:var(--font-mono); font-feature-settings:'tnum'; color:var(--ink-2); font-weight:500; }
|
||
.page-stats .accent-num { color:var(--accent); font-weight:600; }
|
||
.page-stats .sep { color:var(--ink-disabled); }
|
||
|
||
.btn { display:inline-flex; align-items:center; gap:7px; height:32px; padding:0 12px; border-radius:var(--r-sm); border:1px solid var(--hairline); background:var(--surface); font-size:12px; font-weight:500; color:var(--ink); cursor:pointer; font-family:inherit; letter-spacing:-0.005em; }
|
||
.btn:hover { border-color:var(--ink-disabled); background:var(--sunken); }
|
||
.btn-primary { background:var(--accent); color:#fff; border-color:var(--accent); }
|
||
.btn-primary:hover { background:var(--accent-deep); border-color:var(--accent-deep); }
|
||
.btn svg { width:13px; height:13px; stroke-width:1.7; }
|
||
|
||
.search-input { display:inline-flex; align-items:center; gap:8px; height:30px; padding:0 10px; border:1px solid var(--hairline); border-radius:var(--r-sm); background:var(--surface); min-width:200px; }
|
||
.search-input svg { width:13px; height:13px; color:var(--ink-3); }
|
||
.search-input input { flex:1; min-width:0; border:none; outline:none; background:none; font-family:inherit; font-size:12px; color:var(--ink); }
|
||
.search-input input::placeholder { color:var(--ink-3); }
|
||
|
||
/* Kanban */
|
||
.board-wrap { flex:1; min-height:0; overflow-x:auto; overflow-y:hidden; padding-bottom:8px; }
|
||
.board { display:inline-grid; grid-auto-flow:column; grid-auto-columns:262px; gap:10px; height:calc(100vh - 132px); align-items:stretch; }
|
||
.col { background:var(--surface); border:1px solid var(--hairline); border-radius:var(--r-md); display:flex; flex-direction:column; min-height:0; }
|
||
.col-h { padding:11px 14px 9px; border-bottom:1px solid var(--hairline-soft); display:flex; align-items:center; gap:8px; }
|
||
.col-h .dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; position:relative; }
|
||
.col-h .dot::after { content:''; position:absolute; inset:-1px; border-radius:50%; border:1px solid rgba(10,19,25,0.10); }
|
||
.col-h .name { font-size:12.5px; font-weight:600; color:var(--ink); letter-spacing:-0.005em; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
||
.col-h .count { font-family:var(--font-mono); font-feature-settings:'tnum'; font-size:11px; color:var(--ink-3); font-weight:500; background:var(--sunken); padding:2px 6px; border-radius:3px; }
|
||
.col-h .menu-btn { width:22px; height:22px; border:none; background:transparent; color:var(--ink-3); border-radius:4px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
|
||
.col-h .menu-btn:hover { background:var(--sunken); color:var(--ink); }
|
||
.col-h .menu-btn svg { width:13px; height:13px; }
|
||
|
||
.col-list { padding:8px; display:flex; flex-direction:column; gap:6px; overflow-y:auto; flex:1; min-height:0; }
|
||
|
||
.card { background:var(--bg); border:1px solid var(--hairline-soft); border-radius:var(--r-sm); padding:10px 12px; cursor:grab; transition:border-color 100ms ease, transform 100ms ease, box-shadow 100ms ease; }
|
||
.card:hover { border-color:var(--ink-disabled); transform:translateY(-1px); box-shadow:0 2px 6px rgba(10,19,25,0.04); }
|
||
.card.dragging { opacity:0.5; }
|
||
.card-row1 { display:flex; align-items:center; gap:6px; margin-bottom:5px; }
|
||
.card-name { font-size:12.5px; font-weight:500; color:var(--ink); flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:-0.005em; }
|
||
.card-icons { display:inline-flex; gap:4px; flex-shrink:0; }
|
||
.card-ico { width:13px; height:13px; color:var(--ink-3); }
|
||
.card-ico.hot { color:var(--st-new); }
|
||
.card-ico.paid { color:var(--accent); }
|
||
.card-ico.bell { color:var(--st-call); }
|
||
|
||
.card-meta { font-size:11px; color:var(--ink-3); margin-bottom:5px; line-height:1.35; letter-spacing:-0.005em; }
|
||
.card-meta strong { color:var(--ink-2); font-weight:500; }
|
||
.card-comment { font-size:11px; color:var(--ink-2); line-height:1.4; margin-bottom:6px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
|
||
.card-foot { display:flex; justify-content:space-between; align-items:center; font-family:var(--font-mono); font-feature-settings:'tnum'; font-size:10.5px; color:var(--ink-3); letter-spacing:-0.005em; }
|
||
.card-foot .price { color:var(--ink); font-weight:500; }
|
||
|
||
.col-add { padding:8px; border-top:1px solid var(--hairline-soft); }
|
||
.col-add button { width:100%; height:28px; border:1px dashed var(--hairline); background:transparent; border-radius:var(--r-sm); font-family:inherit; font-size:11.5px; color:var(--ink-3); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:5px; }
|
||
.col-add button:hover { border-color:var(--ink-disabled); color:var(--ink); }
|
||
.col-add button svg { width:11px; height:11px; }
|
||
|
||
.col[data-status="new"] .col-h .dot { background:var(--st-new); }
|
||
.col[data-status="work"] .col-h .dot { background:var(--st-work); }
|
||
.col[data-status="call"] .col-h .dot { background:var(--st-call); }
|
||
.col[data-status="nocall"] .col-h .dot { background:var(--st-nocall); }
|
||
.col[data-status="neg"] .col-h .dot { background:var(--st-neg); }
|
||
.col[data-status="quote"] .col-h .dot { background:var(--st-quote); }
|
||
.col[data-status="think"] .col-h .dot { background:var(--st-think); }
|
||
.col[data-status="wait"] .col-h .dot { background:var(--st-wait); }
|
||
.col[data-status="paid"] .col-h .dot { background:var(--st-paid); }
|
||
.col[data-status="refund"] .col-h .dot { background:var(--st-refund); }
|
||
.col[data-status="fail"] .col-h .dot { background:var(--st-fail); }
|
||
.col[data-status="dup"] .col-h .dot { background:var(--st-dup); }
|
||
.col[data-status="spam"] .col-h .dot { background:var(--st-spam); }
|
||
.col[data-status="arch"] .col-h .dot { background:var(--st-arch); }
|
||
|
||
@media (max-width:1100px) {
|
||
.app { grid-template-columns:56px 1fr; }
|
||
.side { padding:14px 6px; }
|
||
.brand .brand-text, .nav-eyebrow, .nav-text, .nav-item:not(.active) .nav-count { display:none; }
|
||
.nav-item { justify-content:center; padding:0; }
|
||
.topbar { padding:0 16px; }
|
||
.content { padding:16px 16px 16px; }
|
||
}
|
||
@media (max-width:768px) {
|
||
.app { grid-template-columns:1fr; }
|
||
.side { display:none; }
|
||
.topbar .crumb span:first-child { display:none; }
|
||
.page-h { gap:10px; }
|
||
.page-stats { display:none; }
|
||
.board { height:auto; }
|
||
.col-list { max-height:none; }
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<a href="#main" class="skip-link">К контенту</a>
|
||
<div class="app">
|
||
<aside class="side" aria-label="Главное меню">
|
||
<div class="brand">
|
||
<span class="brand-mark" aria-hidden="true"><svg viewBox="0 0 48 48"><path d="M16 14 L16 34 L32 34" stroke="#012019" stroke-width="4.5" stroke-linecap="round" stroke-linejoin="round" fill="none"/><circle cx="32" cy="34" r="3.5" fill="#0F6E56"/></svg></span>
|
||
<span class="brand-text">Лидерра<span class="brand-dot">.</span></span>
|
||
</div>
|
||
<nav class="nav">
|
||
<div class="nav-eyebrow">Работа</div>
|
||
<a class="nav-item" href="#"><svg class="nav-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/></svg><span class="nav-text">Дашборд</span></a>
|
||
<a class="nav-item" href="#"><svg class="nav-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 6h18M6 12h12M9 18h6"/></svg><span class="nav-text">Сделки</span><span class="nav-count">247</span></a>
|
||
<a class="nav-item active" href="#" aria-current="page"><svg class="nav-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="3" width="6" height="18"/><rect x="11" y="3" width="6" height="12"/><rect x="19" y="3" width="2" height="8"/></svg><span class="nav-text">Канбан</span></a>
|
||
<a class="nav-item" href="#"><svg class="nav-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 6v6l4 2"/><circle cx="12" cy="12" r="9"/></svg><span class="nav-text">Напоминания</span><span class="nav-count">12</span></a>
|
||
<div class="nav-eyebrow">Финансы</div>
|
||
<a class="nav-item" href="#"><svg class="nav-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><rect x="3" y="6" width="18" height="13" rx="1"/></svg><span class="nav-text">Биллинг</span></a>
|
||
<a class="nav-item" href="#"><svg class="nav-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path d="M3 12h18M3 6h18M3 18h18"/></svg><span class="nav-text">Отчёты</span></a>
|
||
<div class="nav-eyebrow">Команда</div>
|
||
<a class="nav-item" href="#"><svg class="nav-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/></svg><span class="nav-text">Менеджеры</span><span class="nav-count">4</span></a>
|
||
<a class="nav-item" href="#"><svg class="nav-icon" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="3"/></svg><span class="nav-text">Настройки</span></a>
|
||
</nav>
|
||
</aside>
|
||
|
||
<div class="main">
|
||
<div class="topbar">
|
||
<div class="crumb"><span>Рабочая область</span><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path d="M9 18l6-6-6-6"/></svg><strong>Канбан</strong></div>
|
||
<div class="topbar-spacer"></div>
|
||
<button type="button" class="user-chip" aria-label="Профиль · Иван Петров"><span class="ava" aria-hidden="true">ИП</span><span class="uname">Иван П.</span></button>
|
||
</div>
|
||
|
||
<main id="main" class="content">
|
||
<header class="page-h">
|
||
<div class="page-h-l">
|
||
<h1 class="page-title">Канбан</h1>
|
||
<div class="page-stats">
|
||
<span><span class="accent-num num">+3</span> новых с утра</span>
|
||
<span class="sep">·</span>
|
||
<span><span class="num">247</span> в работе</span>
|
||
<span class="sep">·</span>
|
||
<span>14 колонок</span>
|
||
</div>
|
||
</div>
|
||
<div style="display:flex;gap:8px;align-items:center">
|
||
<label class="search-input">
|
||
<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></svg>
|
||
<input type="search" placeholder="Поиск по карточкам…" aria-label="Поиск по сделкам">
|
||
</label>
|
||
<button type="button" class="btn"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><path d="M22 3H2l8 9.46V19l4 2v-8.54L22 3z"/></svg>Фильтры</button>
|
||
<button type="button" class="btn btn-primary"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Новая</button>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="board-wrap">
|
||
<div class="board" role="region" aria-label="Канбан-доска · 14 статусов воронки">
|
||
|
||
<section class="col" data-status="new" aria-labelledby="col-new">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-new">Новая</span><span class="count">8</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Анна Соколова</span><span class="card-icons"><svg class="card-ico hot" fill="currentColor" viewBox="0 0 24 24" aria-label="Горячий"><path d="M13.5.67s.74 2.65.74 4.8c0 2.06-1.35 3.73-3.41 3.73-2.07 0-3.63-1.67-3.63-3.73l.03-.36C5.21 7.51 4 10.62 4 14a8 8 0 0016 0C20 9.91 18.04 6.27 13.5.67zM11.71 19c-1.78 0-3.22-1.4-3.22-3.14 0-1.62 1.05-2.76 2.81-3.12 1.77-.36 3.6-1.21 4.62-2.58.39 1.29.59 2.65.59 4.04 0 2.65-2.15 4.8-4.8 4.8z"/></svg><svg class="card-ico bell" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.8" aria-label="Напоминание"><path d="M18 8a6 6 0 1 0-12 0c0 7-3 9-3 9h18s-3-2-3-9"/></svg></span></div>
|
||
<div class="card-meta">Натяжные потолки <strong>· 42 м²</strong></div>
|
||
<div class="card-comment">Звонила в 14:38 — занято. Перезвонить после 15:00. Интересует матовый, рассрочка.</div>
|
||
<div class="card-foot"><span>+7 (916) 871-23-45</span><span class="price">1 850 ₽</span></div>
|
||
</article>
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">+7 (495) 482-91-22</span></div>
|
||
<div class="card-meta">Окна Москва</div>
|
||
<div class="card-foot"><span>2 минуты назад</span><span class="price">2 200 ₽</span></div>
|
||
</article>
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Наталья Бузо́ва</span></div>
|
||
<div class="card-meta">Кухни на заказ</div>
|
||
<div class="card-foot"><span>14 минут</span><span class="price">3 100 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="work" aria-labelledby="col-work">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-work">В работе</span><span class="count">14</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Виктор Зайцев</span><span class="card-icons"><svg class="card-ico bell" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.8"><path d="M18 8a6 6 0 1 0-12 0c0 7-3 9-3 9h18s-3-2-3-9"/></svg></span></div>
|
||
<div class="card-meta">Окна Москва <strong>· 1.8×1.5</strong></div>
|
||
<div class="card-comment">Замер пятница 15:00. Подтвердить за день.</div>
|
||
<div class="card-foot"><span>13 ч</span><span class="price">2 200 ₽</span></div>
|
||
</article>
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Эльдар Габбасов</span></div>
|
||
<div class="card-meta">Натяжные потолки</div>
|
||
<div class="card-foot"><span>1 ч</span><span class="price">1 850 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="call" aria-labelledby="col-call">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-call">Дозвон</span><span class="count">22</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Елена Васильева</span></div>
|
||
<div class="card-meta">Кухни на заказ <strong>· 9 м²</strong></div>
|
||
<div class="card-comment">Думает между двумя планировками. Нужен повторный звонок завтра.</div>
|
||
<div class="card-foot"><span>4 ч</span><span class="price">3 100 ₽</span></div>
|
||
</article>
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Мария Орлова</span></div>
|
||
<div class="card-meta">Окна Москва</div>
|
||
<div class="card-foot"><span>5 ч</span><span class="price">2 200 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="nocall" aria-labelledby="col-nocall">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-nocall">Не дозвонились</span><span class="count">9</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Татьяна Иванова</span></div>
|
||
<div class="card-meta">Натяжные потолки</div>
|
||
<div class="card-foot"><span>11 ч · 3 попытки</span><span class="price">1 850 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="neg" aria-labelledby="col-neg">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-neg">Переговоры</span><span class="count">16</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Иван Петров</span><span class="card-icons"><svg class="card-ico hot" fill="currentColor" viewBox="0 0 24 24"><path d="M13.5.67s.74 2.65.74 4.8c0 2.06-1.35 3.73-3.41 3.73-2.07 0-3.63-1.67-3.63-3.73l.03-.36C5.21 7.51 4 10.62 4 14a8 8 0 0016 0c0-4.09-1.96-7.73-6.5-13.33z"/></svg></span></div>
|
||
<div class="card-meta">Окна Москва · договор</div>
|
||
<div class="card-comment">Согласовали 4 окна, спецификация на завтра.</div>
|
||
<div class="card-foot"><span>1 ч</span><span class="price">2 200 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="quote" aria-labelledby="col-quote">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-quote">КП отправлено</span><span class="count">11</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Ольга Громова</span></div>
|
||
<div class="card-meta">Кухни на заказ</div>
|
||
<div class="card-comment">КП на 218 000 ₽ отправлено в 11:32. Уточнить статус через 2 дня.</div>
|
||
<div class="card-foot"><span>7 ч</span><span class="price">3 100 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="think" aria-labelledby="col-think">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-think">Думает</span><span class="count">7</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Артём Лебедев</span></div>
|
||
<div class="card-meta">Окна Москва</div>
|
||
<div class="card-comment">Сравнивает с двумя другими подрядчиками. Решение к концу недели.</div>
|
||
<div class="card-foot"><span>9 ч</span><span class="price">2 200 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="wait" aria-labelledby="col-wait">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-wait">Ждёт оплату</span><span class="count">4</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Михаил Орлов</span><span class="card-icons"><svg class="card-ico bell" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="1.8"><path d="M18 8a6 6 0 1 0-12 0c0 7-3 9-3 9h18s-3-2-3-9"/></svg></span></div>
|
||
<div class="card-meta">Натяжные потолки · 28 050 ₽</div>
|
||
<div class="card-comment">Счёт выставлен. Ожидаем оплату до 20:00.</div>
|
||
<div class="card-foot"><span>3 ч</span><span class="price">1 850 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="paid" aria-labelledby="col-paid">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-paid">Оплачено</span><span class="count">45</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Дмитрий Котов</span><span class="card-icons"><svg class="card-ico paid" fill="none" stroke="currentColor" viewBox="0 0 24 24" stroke-width="2.5"><polyline points="20 6 9 17 4 12"/></svg></span></div>
|
||
<div class="card-meta">Окна Москва · 5 окон</div>
|
||
<div class="card-foot"><span>2 ч</span><span class="price">2 200 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="refund" aria-labelledby="col-refund">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-refund">Возврат</span><span class="count">3</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Кирилл Морозов</span></div>
|
||
<div class="card-meta">Кухни на заказ</div>
|
||
<div class="card-foot"><span>16 ч</span><span class="price">3 100 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="fail" aria-labelledby="col-fail">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-fail">Отказ</span><span class="count">38</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Сергей Новиков</span></div>
|
||
<div class="card-meta">Окна Москва</div>
|
||
<div class="card-foot"><span>5 ч</span><span class="price">2 200 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="dup" aria-labelledby="col-dup">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-dup">Дубликат</span><span class="count">5</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Полина Власова</span></div>
|
||
<div class="card-meta">Окна Москва · уже #1019</div>
|
||
<div class="card-foot"><span>вчера</span><span class="price" style="color:var(--ink-3)">—</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="spam" aria-labelledby="col-spam">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-spam">Спам</span><span class="count">5</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">+7 (000) 000-00-00</span></div>
|
||
<div class="card-meta">Натяжные потолки</div>
|
||
<div class="card-foot"><span>вчера</span><span class="price" style="color:var(--ink-3)">—</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
<section class="col" data-status="arch" aria-labelledby="col-arch">
|
||
<div class="col-h"><span class="dot" aria-hidden="true"></span><span class="name" id="col-arch">Архив</span><span class="count">39</span><button type="button" class="menu-btn" aria-label="Меню колонки"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><circle cx="12" cy="12" r="1"/><circle cx="12" cy="5" r="1"/><circle cx="12" cy="19" r="1"/></svg></button></div>
|
||
<div class="col-list">
|
||
<article class="card" tabindex="0" draggable="true">
|
||
<div class="card-row1"><span class="card-name">Антон Беляев</span></div>
|
||
<div class="card-meta">Окна Москва</div>
|
||
<div class="card-foot"><span>3 дня</span><span class="price">2 200 ₽</span></div>
|
||
</article>
|
||
</div>
|
||
<div class="col-add"><button type="button"><svg fill="none" stroke="currentColor" viewBox="0 0 24 24"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>Добавить</button></div>
|
||
</section>
|
||
|
||
</div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html>
|