rodado/brasiliano
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: árvore de assuntos alinhada à esquerda com conectores

Browse Source
This commit is contained in:
rodado
2026-09-30 19:12:17 +02:00
parent e2b3a45d8c
commit efed9f28a0
1 changed files with 19 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/wall.html
+19 -8
View File
@@ -379,16 +379,27 @@
#card-title { font-size: 1.02rem; color: #f5f5f0; } #card-title { font-size: 1.02rem; color: #f5f5f0; }
#card-date { font-size: .85rem; color: #b9b9b0; margin-top: 2px; } #card-date { font-size: .85rem; color: #b9b9b0; margin-top: 2px; }
#card-contrib { font-size: .82rem; color: #cdd8e0; margin-top: 10px; } #card-contrib { font-size: .82rem; color: #cdd8e0; margin-top: 10px; }
#card-tags { margin-top: 12px; font-family: system-ui, sans-serif; font-size: .7rem; line-height: 1.55; color: #b8c6d1; } /* the card is centred text; the tree needs a common left edge, so it is a
left-aligned block that is itself centred */
#card-tags {
width: fit-content; max-width: 100%; margin: 14px auto 0; text-align: left;
font-family: system-ui, sans-serif; font-size: .72rem; line-height: 1.5; color: #b8c6d1;
}
#card-tags:empty { display: none; } #card-tags:empty { display: none; }
#card-tags .tn { margin: 0; padding: 0 0 0 13px; border-left: 1px solid rgba(127,168,201,.28); } #card-tags .tn { position: relative; margin-left: 6px; padding-left: 15px; border-left: 1px solid rgba(127,168,201,.3); }
#card-tags > .tn { padding-left: 0; border-left: 0; } #card-tags > .tn { margin-left: 0; padding-left: 0; border-left: 0; }
#card-tags .tl { padding: 1px 0; overflow-wrap: anywhere; } #card-tags .tl { padding: 2px 0; overflow-wrap: anywhere; }
#card-tags .tn.place > .tl { color: #dcebf6; font-weight: 600; } /* elbow from the parent's line to this label */
#card-tags .tn .tn > .tl::before {
content: ''; position: absolute; left: 0; top: .82em; width: 10px; border-top: 1px solid rgba(127,168,201,.3);
}
#card-tags .tn .tn:last-child { border-left-color: transparent; }
#card-tags .tn .tn:last-child::after {
content: ''; position: absolute; left: -1px; top: 0; height: .82em; border-left: 1px solid rgba(127,168,201,.3);
}
#card-tags .tn.place > .tl { color: #e6eef5; font-weight: 600; }
#card-tags .tn.topic > .tl { color: #b8c6d1; } #card-tags .tn.topic > .tl { color: #b8c6d1; }
#card-tags .tn > .tl::before { content: '└ '; color: rgba(127,168,201,.5); } #card-tags .to { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 10px; }
#card-tags > .tn > .tl::before { content: ''; }
#card-tags .to { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
#card-tags .to span { #card-tags .to span {
font-size: .64rem; line-height: 1.7; padding: 0 8px; border-radius: 999px; font-size: .64rem; line-height: 1.7; padding: 0 8px; border-radius: 999px;
background: rgba(127,168,201,.12); border: 1px solid rgba(127,168,201,.22); background: rgba(127,168,201,.12); border: 1px solid rgba(127,168,201,.22);