Visual downline tree on the Overview

"Your line at a glance": YOU + three levels of member chips with connectors,
your qualified directs highlighted in gold, and "+ open" placeholders on levels
1-2 showing what's next. Loads from /api/my/line.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
martbost
2026-09-07 08:38:15 -05:00
parent 0dbd99f69e
commit 42d0e15fea
3 changed files with 40 additions and 2 deletions
+13
View File
@@ -561,3 +561,16 @@ img{max-width:100%}
.chat-msg-btn{margin-left:auto;font-size:12px;padding:3px 10px}
.switch{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px}
.switch input{width:18px;height:18px;accent-color:var(--mint)}
/* ── Overview line tree ── */
.line-tree{margin-top:6px}
.lt-top{margin-left:26px}
.lt-you{display:inline-block;background:var(--mint);color:var(--mint-ink);font-weight:800;padding:6px 18px;border-radius:999px;font-size:13px}
.lt-stem{height:12px;border-left:2px solid var(--line-strong);width:0;margin:0 0 6px 30px}
.lt-row{display:flex;align-items:center;gap:10px;margin:7px 0}
.lt-cap{font:700 11px var(--mono);color:var(--muted);width:22px;flex:0 0 auto}
.lt-nodes{display:flex;gap:8px;flex-wrap:wrap}
.lt-node{background:var(--panel);border:1px solid var(--line-strong);border-radius:10px;padding:6px 12px;font-size:13px;font-weight:600;white-space:nowrap}
.lt-node.deep{color:var(--muted)}
.lt-node.qualified{border-color:#ffb238;color:#ffd15c;box-shadow:0 0 0 1px rgba(255,177,56,.35)}
.lt-node.open{border-style:dashed;color:var(--muted);background:transparent}