Public: anyone can read this; the crew can change it.
Migrated from github.com/Trevato/SO-ARM100
workbenchthis machine
main's tests pass again: the #notesPill fade rules move from src/ui/notes.css into viewer.html's <style> #526
quill/arm:quill/512-main-s-tests-pass-again-the-notespill-fa → main 1 commit fork
3 files
changed +7
−3
Software/so101/src/stop-layout.test.ts +5
| @@ -171,4 +171,9 @@ describe("notes on the served page", () => { | ||
| 171 | 171 | // styled by the page, so it never shows unstyled while the stylesheet loads |
| 172 | 172 | expect(notesCss.some((r) => r.selector.includes("notesPill"))).toBe(false); |
| 173 | 173 | }); |
| 174 | ||
| 175 | test("the pill fades out on the page's own rules: .fading takes it to opacity 0 over 0.4 s", () => { | |
| 176 | expect(body("#notesPill")).toMatch(/transition:\s*opacity\s+\.4s/); | |
| 177 | expect(body("#notesPill.fading")).toMatch(/opacity:\s*0\b/); | |
| 178 | }); | |
| 174 | 179 | }); |
Software/so101/src/ui/notes.css −2
| @@ -1,4 +1,2 @@ | ||
| 1 | 1 | #notesList { position: fixed; z-index: 9; left: 8px; right: 8px; bottom: calc(8px + var()); max-height: 40vh; overflow: auto; margin: 0 auto; max-width: 480px; padding: 6px; border: 1px solid var(); border-radius: 10px; background: var(); } |
| 2 | 2 | .note { display: flex; gap: 8px; padding: 8px; border-left: 3px solid var(); font-size: 14px; overflow-wrap: anywhere; } .note span { flex: 1; } .note button { flex: none; min-height: 44px; min-width: 44px; } |
| 3 | #notesPill { transition: opacity .4s ease; } | |
| 4 | #notesPill.fading { opacity: 0; } |
Software/so101/src/viewer.html +2 −1
| @@ -137,7 +137,8 @@ | ||
| 137 | 137 | #tabs .badge { display: inline-block; min-width: 18px; margin-left: 4px; padding: 0 5px; border-radius: 9px; background: var(); color: var(); font-size: 11px; line-height: 18px; } |
| 138 | 138 | #tabs .badge:empty { display: none; } |
| 139 | 139 | |
| 140 | #notesPill { flex: none; min-height: 44px; min-width: 44px; padding: 0 12px; border-radius: 22px; background: var(); } | |
| 140 | #notesPill { flex: none; min-height: 44px; min-width: 44px; padding: 0 12px; border-radius: 22px; background: var(); transition: opacity .4s ease; } | |
| 141 | #notesPill.fading { opacity: 0; } | |
| 141 | 142 | |
| 142 | 143 | /* chat */ |
| 143 | 144 | #tab-chat { padding: 0; gap: 0; } |
new above
offline