- Touch screens: a couplet's tools show when it is tapped (the couplet lightly marked; tapping again or another hides them); a set bookmark or note stays visible; couplets without either keep no room for the row (from a phone screenshot: every line had four icons under it)
- E-book format tabs stay on one line each; on phones without the English in brackets, scrolling sideways if needed
- Phones: the sticky header slides away while scrolling down and returns on the way up (a transform, so nothing jumps; not while the search box, keyboard or display menu is in use)
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- The header stays at the top for readers and admins alike; its height never changes while scrolling (no jumps), it gains a translucent blurred background and a hairline shadow once scrolled. --header-h keeps anchors (#c6) and the editor's sticky toolbar and code panel clear of it. The header logo is a little smaller (48–60px)
- Footer: the brand (logo, name, tagline, the flag line) beside the links, the site's five links down one column with sources and code stacked beside them; licence, contact and attribution in a thin bottom bar. On phones the brand on top and the links in two columns
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- Reading mode (the book button in a poem's, book's or poet's action row): the text, the breadcrumbs, the poet's name and the logo; no search, icons, buttons, couplet tools, tags or footer; larger verse. Kept across pages until the ✕ in the header; switched on before paint (no flash); only on readable pages, so search and tools are unaffected
- For Safari Reader, Firefox Reader View and Chrome's reading mode: a poem is one <article> (title, poet, text), with <meta name="author"> and schema.org CreativeWork data
- Printing shows the text and its source only
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- A note never bookmarks: notes and bookmarks share a row, bookmarked false is a note only (db: library.bookmarked). Un-bookmarking keeps a note; clearing the note of a row that is not bookmarked removes it; ✕ on the saved page keeps a note
- A phrase with a note but no bookmark is underlined only, with the note glyph
- /notes: every note with where it is and its couplet (the noted phrase marked), editable in place with the Urdu keyboard, deleted after asking; from a note icon in the header and a نوٹس tab
- API tests for all of it
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- Bookmark, note, share and download sit in one row centred under each couplet on the ✤ line (bookmark and note on one side, share and download on the other), clear of the text, the same on phones
- Share always opens the share menu (the picture where the browser can share files, else the couplet and its link; with no share menu, both are copied); a new download button saves the picture
- The note box has the Urdu keyboard and Roman typing like the search box (the keyboard moves into the box while it is open); notes can be in any language (the box follows the typed direction)
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
- Notes: a glyph below each couplet's bookmark opens a note box (filled gold when the couplet or a phrase in it has a note; the note shows on hover). Selected text gets نوٹ in the selection menu; a highlighted phrase with a note shows the note glyph and opens its note (with "remove highlight"). API: POST /api/library/note {poemId, couplet, phrase?, note} (bookmarks if needed; empty clears the note), notes in /api/library/state; tests added
- Confirm dialog in Urdu (destructive answer in red, named for what it does) in place of the browser's English confirm(); forms use data-confirm
- Toasts for "done" messages; errors stay by the form and nudge; a submitting button shows a spinner
- Motion: page cross-fade (View Transitions) with the logo held; couplets rise in on load; bookmark and note glyphs pop; the word sidebar slides in; menus and folding sections open smoothly; all off with reduced motion
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
