diff --git a/CHANGELOG.md b/CHANGELOG.md index 24eabc9..1b60dcd 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed +- A pinned feed's pin sits on the corner of its artwork, as a failing feed's mark does, instead of before its name. - The Directory lists feeds nobody subscribes to yet; Popular still lists what people subscribe to. A feed nobody subscribes to is checked once a day, and at once when someone subscribes. A listed feed downloads nothing until someone subscribes. diff --git a/web/app.css b/web/app.css index 958516b..fc44f26 100644 --- a/web/app.css +++ b/web/app.css @@ -566,7 +566,14 @@ input:focus,select:focus{outline:0;border-color:var(--accent)} /* A show sits under its folder's title, a size down, so an open folder reads as one. */ .feed.child{margin-left:11px} /* Pinned feeds, at the top of the list: a small pin before the name, and a rule under the last. */ -.feed .fpin .i{width:10px;height:10px;margin-right:5px;vertical-align:-1px;color:var(--accent)} +/* Pinned: a disc on the artwork's corner, as a failing feed's mark is, in the accent and the ink + the theme pairs with it. A feed both pinned and failing keeps the error below, the pin above. */ +.fpin{ + position:absolute;right:-5px;bottom:-5px;width:17px;height:17px;border-radius:50%; + display:grid;place-items:center;background:var(--accent);color:var(--ink);border:2px solid var(--bg); +} +.fpin .i{width:9px;height:9px} +.feed.err .fpin{bottom:auto;top:-5px} .feed.lastpin{margin-bottom:9px} .feed.lastpin::after{content:"";position:absolute;left:8px;right:8px;bottom:-5px;border-bottom:1px solid var(--line)} .feed.child .art{width:28px;height:28px;font-size:11px} diff --git a/web/src/feeds.ts b/web/src/feeds.ts index 7cb6e09..aa026c6 100644 --- a/web/src/feeds.ts +++ b/web/src/feeds.ts @@ -130,8 +130,9 @@ function renderFeeds(){ // The mark sits on the artwork, the thing the eye scans the list by, and the line under // the name says what is wrong in place of the counts. `${mine.length?folderArt(f,mine):artHTML(f.image,f.title||f.id)}`+ - (err?`${ICON.alert}`:'')+``+ - `
${f.pinned?`${ICON.pinOn}`:''}${esc(f.title||f.id)}`+ + (err?`${ICON.alert}`:'')+ + (f.pinned?`${ICON.pinOn}`:'')+``+ + `
${esc(f.title||f.id)}`+ (nbad?`${plural(nbad,'feed')} not updating` :err?esc(f.failing?.reason||'The last check failed') :`${mine.length?plural(mine.length,'feed'):plural(eps,'item')} ยท ${saved} downloaded`)+