asdf
This commit is contained in:
1 parent
6b49f859e7
commit
bf27642bf6
8 files changed
+184
-151
No files matched your search
@@ -100,7 +100,7 @@ const ridges = Array.from({ length: rows }, (_, r) => {
|
||||
{s.status.rows.map((r) => (
|
||||
<div class="readout__cell">
|
||||
<dt>{r.key}</dt>
|
||||
<dd>{'live' in r && r.live && <span class="readout__live" aria-hidden="true" />}{r.value}</dd>
|
||||
<dd>{r.value}</dd>
|
||||
</div>
|
||||
))}
|
||||
</dl>
|
||||
@@ -236,24 +236,6 @@ const ridges = Array.from({ length: rows }, (_, r) => {
|
||||
}
|
||||
.readout__cell + .readout__cell { border-top: var(--hairline) solid var(--line-on-night); }
|
||||
.readout__cell--head, .readout dt { color: var(--ink-muted); }
|
||||
.readout dd { display: flex; align-items: center; gap: var(--space-2); }
|
||||
.readout__live { position: relative; width: 0.5rem; height: 0.5rem; border-radius: 50%; background: var(--signal); flex: none; }
|
||||
/* The live phase pulses: a ring in the signal tone grows out of the dot and fades. */
|
||||
.readout__live::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
border-radius: 50%;
|
||||
background: var(--signal);
|
||||
animation: readout-pulse calc(6 * var(--dur-slow)) var(--ease) infinite;
|
||||
}
|
||||
@keyframes readout-pulse {
|
||||
from { transform: scale(1); opacity: 0.7; }
|
||||
70%, to { transform: scale(3); opacity: 0; }
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.readout__live::after { animation: none; opacity: 0; }
|
||||
}
|
||||
|
||||
@media (max-width: 30rem) {
|
||||
.signup { padding: var(--space-5); }
|
||||
|
||||
Reference in new issue
Block a user