oleh/astrolabe
1
0
Fork 0
mirror of https://github.com/olehomelchenko/astrolabe.git synced 2026-08-08 02:02:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

Reconcile visual specimen with the resolved status indicator and toggle

Browse Source
This commit is contained in:
Oleh Omelchenko
2026-06-05 14:11:05 +03:00
parent ad239d7d49
commit 25849461e0
1 changed files with 23 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/architecture/visual-specimen.html
+23 -6
View File
@@ -568,7 +568,9 @@
display: inline-block; display: inline-block;
} }
.dot.draft { .dot.draft {
background: var(--support-warning); /* Accent, not a warning hue: a draft / unpublished-changes state is
neutral, not a problem (arch/10 §6 status-indicator resolution + council). */
background: var(--accent);
} }
.dot.published { .dot.published {
background: var(--support-success); background: var(--support-success);
@@ -624,6 +626,13 @@
align-items: center; align-items: center;
gap: var(--space-2); gap: var(--space-2);
} }
/* Fixed-width slot so the draft dot (shown only on dirty rows) never shifts
the date — published rows keep an empty slot and stay aligned. */
.item .indicator {
flex: 0 0 auto;
width: 8px;
height: 8px;
}
.item .del { .item .del {
opacity: 0; opacity: 0;
border: none; border: none;
@@ -990,8 +999,12 @@
<section> <section>
<h2>Tabs · status · tags</h2> <h2>Tabs · status · tags</h2>
<div class="tabs"> <div class="tabs">
<button aria-selected="true">Draft</button> <button aria-selected="true">Overview</button>
<button aria-selected="false">Published</button> <button aria-selected="false">Details</button>
</div>
<div class="cap" style="margin-top: var(--space-2)">
Catalog primitive only. The Draft/Published view uses the segmented control (a
radio group), not tabs — see arch/10.
</div> </div>
<div class="row" style="margin-top: var(--space-6)"> <div class="row" style="margin-top: var(--space-6)">
<span class="tag-pill"><span class="dot draft"></span> Draft changes</span> <span class="tag-pill"><span class="dot draft"></span> Draft changes</span>
@@ -1033,7 +1046,11 @@
<div class="item active"> <div class="item active">
<div class="main"> <div class="main">
<div class="name">Quarterly revenue</div> <div class="name">Quarterly revenue</div>
<div class="sub"><span class="dot draft"></span> Today · 2 KB</div> <div class="sub">
<span class="indicator"><span class="dot draft"></span></span><span
>Today · 2 KB</span
>
</div>
</div> </div>
<button class="del" title="Delete"> <button class="del" title="Delete">
<svg <svg
@@ -1052,7 +1069,7 @@
<div class="item"> <div class="item">
<div class="main"> <div class="main">
<div class="name">Population by region</div> <div class="name">Population by region</div>
<div class="sub"><span class="dot published"></span> Yesterday</div> <div class="sub"><span class="indicator"></span><span>Yesterday</span></div>
</div> </div>
<button class="del" title="Delete"> <button class="del" title="Delete">
<svg <svg
@@ -1071,7 +1088,7 @@
<div class="item"> <div class="item">
<div class="main"> <div class="main">
<div class="name">Scatter · height vs weight</div> <div class="name">Scatter · height vs weight</div>
<div class="sub"><span class="dot published"></span> 3d ago</div> <div class="sub"><span class="indicator"></span><span>3d ago</span></div>
</div> </div>
<button class="del" title="Delete"> <button class="del" title="Delete">
<svg <svg