relay-companion 0.1.67 → 0.1.68
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/overlay/inbox.html +25 -6
- package/package.json +1 -1
package/overlay/inbox.html
CHANGED
|
@@ -147,10 +147,15 @@
|
|
|
147
147
|
.tab:hover { background:rgba(31,26,23,.05); color:var(--ink-2); }
|
|
148
148
|
.tab.active { background:var(--accent-soft); color:var(--accent); }
|
|
149
149
|
.tab-badge {
|
|
150
|
-
font-family:var(--
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
150
|
+
font-family:var(--sans); font-size:9px; font-weight:650;
|
|
151
|
+
font-variant-numeric:tabular-nums; line-height:1;
|
|
152
|
+
color:#fff; background:var(--accent);
|
|
153
|
+
border-radius:999px; padding:2.5px 5.5px; min-width:15px; text-align:center;
|
|
154
|
+
display:inline-block; margin-left:3px; transform:translateY(-1px);
|
|
155
|
+
box-shadow:0 2px 5px -2px color-mix(in srgb, var(--accent) 50%, transparent);
|
|
156
|
+
transition:opacity .15s var(--settle);
|
|
157
|
+
}
|
|
158
|
+
.tab:not(.active) .tab-badge { opacity:.45; }
|
|
154
159
|
.tab-badge.gone { display:none; }
|
|
155
160
|
.mark-all-read {
|
|
156
161
|
appearance:none; margin-left:auto; border:0; background:transparent; cursor:pointer;
|
|
@@ -595,9 +600,23 @@
|
|
|
595
600
|
.th-item:hover { background:rgba(31,26,23,.035); }
|
|
596
601
|
.th-top { display:flex; align-items:baseline; gap:7px; min-width:0; }
|
|
597
602
|
.th-party { font-size:12px; font-weight:600; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
|
|
603
|
+
/* Message-count badge: a quiet filled pill, not an outlined circle — depth
|
|
604
|
+
from tint and light, numerals precisely centered and tabular. */
|
|
598
605
|
.th-count {
|
|
599
|
-
flex:0 0 auto;
|
|
600
|
-
|
|
606
|
+
flex:0 0 auto; align-self:center;
|
|
607
|
+
font-family:var(--sans); font-size:9.5px; font-weight:650;
|
|
608
|
+
font-variant-numeric:tabular-nums; letter-spacing:.02em; line-height:1;
|
|
609
|
+
color:var(--accent);
|
|
610
|
+
background:color-mix(in srgb, var(--accent) 9%, transparent);
|
|
611
|
+
box-shadow:inset 0 0 0 0.5px color-mix(in srgb, var(--accent) 14%, transparent);
|
|
612
|
+
border-radius:999px; padding:3px 6.5px; min-width:17px; text-align:center;
|
|
613
|
+
}
|
|
614
|
+
.th-item.unread .th-count {
|
|
615
|
+
color:#fff; background:var(--accent);
|
|
616
|
+
box-shadow:0 2px 5px -2px color-mix(in srgb, var(--accent) 55%, transparent);
|
|
617
|
+
}
|
|
618
|
+
.th-item.th-sent-only .th-count {
|
|
619
|
+
color:var(--muted); background:rgba(31,26,23,.055); box-shadow:none;
|
|
601
620
|
}
|
|
602
621
|
.th-unread {
|
|
603
622
|
flex:0 0 auto; align-self:center; min-width:7px; height:7px; border-radius:999px;
|