rays/ipx
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Show a failing feed on its artwork, in words, and grey (#93)

Browse Source 
The mark was a 12px "!" in the sidebar's margin, told apart by --bad alone; a dark theme's --bad
is a pale pink, and at that size it vanished. It is now a solid disc on the artwork's corner, the
subtitle says what is wrong in place of the counts, and a feed failing for a day or more has its
artwork greyed out. Lightness and words carry it, so no theme's palette changes.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Ray Slakinski
2026-09-29 15:17:46 +00:00
parent d4e00be085
commit e9f2832e1e
4 changed files with 39 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
web/app.css
View File

@@ -588,11 +588,18 @@ input:focus,select:focus{outline:0;border-color:var(--accent)}
@keyframes ipxspin{to{transform:rotate(360deg)}}
body.scan-this .fhead [data-a=scan] .i,body.scan-any .fhead [data-a=scanall] .i,body.scan-any #scanAll .i{
animation:ipxspin 1s linear infinite}
/* A feed's error mark, in the triangle's place: the same column as every folder's triangle,
a child's included, which is why it moves left by the child's indent. */
.ferr{position:absolute;left:-16px;top:0;bottom:0;width:24px;display:grid;place-items:center;color:var(--bad)}
.ferr .i{width:12px;height:12px}
.feed.child .ferr{left:-27px}
/* A feed's error mark: a solid disc on the artwork's corner, ringed in the page ground so it
stands off any cover. The glyph is cut out of it in --bg, which is the dark against the light
--bad of a dark theme and the light against the deep one of a light theme. */
.fart{position:relative;flex:none;display:grid}
.ferr{
position:absolute;right:-5px;bottom:-5px;width:17px;height:17px;border-radius:50%;
display:grid;place-items:center;background:var(--bad);color:var(--bg);border:2px solid var(--bg);
}
.ferr .i{width:9px;height:9px}
.feed.err .txt small{color:var(--bad)}
/* Failing for a day or more: the cover goes grey, a show gone off the air. */
.feed.failing .fart>.art{filter:grayscale(1);opacity:.45}
.chev .i{width:12px;height:12px;transition:transform .12s}
.chev[aria-expanded="true"] .i{transform:rotate(90deg)}
.childlist{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;margin-top:10px}