Folded corner, page-edge strip and eraser fixes from the owner's page comments

.page-comments/threads/t_2bf0d8.jsonl

@@ -0,0 +1,4 @@
+{"v":1,"ev":"thread","id":"t_2bf0d8","ts":"2026-11-07T18:25:33Z","author":"omar","page":{"url":"http://127.0.0.1:7122/#/hafs-kfqc/2:80","path":"/#/hafs-kfqc/2:80","title":"حفظ · Hifth"},"viewport":{"w":1376,"h":1258,"dpr":1.3953488372093024,"scrollX":0,"scrollY":0,"scheme":"light"},"anchor":{"type":"element","commentId":null,"css":"#root > div:nth-of-type(1) > header:nth-of-type(1)","tag":"header","label":"Hifth Navigation for huffaz Page 12 ⌖ ▤ Tajweed beta ⓘ One Two − 100% + ع EN ← →","quote":{"exact":"HifthNavigation for huffazPage12⌖▤TajweedbetaⓘOneTwo−100%+عEN←→Pages/Go to","prefix":"\n    ","suffix":"RVHBNKWMCJSelect toolPage 11Al-B"},"box":{"fx":0.29,"fy":0.61},"source":[]},"rev":{"bodyHash":"a879e3837b57","ts":"2026-11-07T18:25:32Z","git":{"commit":"7eac2aa7","dirty":false}},"body":"where are we with having a settings button that shows a settigns tab ... we should have page icons on the bottom like a mac app ... where default is the mushaf page, another page is the settings page ... "}
+{"v":1,"ts":"2026-11-07T18:25:33Z","ev":"shot","role":"comment","author":"omar","icloud":"CloudDesktop/data/page-comments/hifth/t_2bf0d8/comment.png","sha":"143ea37d2493"}
+{"v":1,"ts":"2026-11-07T18:25:56Z","ev":"reply","author":"omar","body":"i also want a developer page that shows in localhsot mode .."}
+{"v":1,"ts":"2026-11-07T18:37:11Z","ev":"reply","author":"claude","body":"Not started: today every setting lives in the info panel (the ⓘ in the header), and there is no page switcher. I wrote both asks up as open questions in a new note, `docs/design/app-pages.md`: ① a bottom row of page icons with the mushaf as the default and settings as their own page; ② a developer page that only a laptop build shows, and a real build never carries. Next step is a rough build of the row; left open until then."}

.page-comments/threads/t_425726.jsonl

@@ -0,0 +1,3 @@
+{"v":1,"ev":"thread","id":"t_425726","ts":"2026-11-07T18:21:28Z","author":"omar","page":{"url":"http://127.0.0.1:7122/#/hafs-kfqc/2:63","path":"/#/hafs-kfqc/2:63","title":"حفظ · Hifth"},"viewport":{"w":1376,"h":1258,"dpr":1.3953488372093024,"scrollX":0,"scrollY":0,"scheme":"light"},"anchor":{"type":"element","commentId":null,"css":"#root > div:nth-of-type(1) > section:nth-of-type(1)","tag":"section","label":"Tools for Al-Baqarah · 2:63","quote":{"exact":"Al-Baqarah · 2:63×▶︎Listen⬡9Same roots⇪Share⚑Bookmark↗︎On QUL","prefix":"qarah · 2:63Al-Baqarah · 0 links","suffix":"604 of 604 pages availableSelect"},"box":{"fx":0.02,"fy":0.06},"source":[]},"rev":{"bodyHash":"8df9c9fcfa13","ts":"2026-11-07T18:21:27Z","git":{"commit":"c70bed78","dirty":false}},"body":"is this the Ayah Drawer ... if I click on a word do i get a word drawer stacked on top of it ... when i hover overe the drawer, can the relevant highlight glow? "}
+{"v":1,"ts":"2026-11-07T18:21:28Z","ev":"shot","role":"comment","author":"omar","icloud":"CloudDesktop/data/page-comments/hifth/t_425726/comment.png","sha":"84e385f22f48"}
+{"v":1,"ts":"2026-11-07T18:22:47Z","ev":"reply","author":"claude","body":"Yes, this is the verse drawer: the tools for the lit verse.\n\n- **A word drawer stacked on top?** Not today. With the Verse tool, a click on a word lights its whole verse. The word's own drawer (its letters and vowel-signs) opens only with the Word tool, and it takes the verse drawer's place rather than sitting above it.\n- **A glow while the pointer is on the drawer?** Not today. The verse stays lit the same way.\n\nI've logged both as open questions ① and ② in `docs/decisions/selection-drawer.md` and on the backlog. Next for each is a rough build to try beside today's behaviour. I'm leaving this thread open until those are built."}

.page-comments/threads/t_56f379.jsonl

@@ -0,0 +1,3 @@
+{"v":1,"ev":"thread","id":"t_56f379","ts":"2026-11-07T17:42:53Z","author":"omar","page":{"url":"http://127.0.0.1:7122/#/hafs-kfqc/p7","path":"/#/hafs-kfqc/p7","title":"حفظ · Hifth"},"viewport":{"w":2752,"h":1258,"dpr":1.3953488372093024,"scrollX":0,"scrollY":0,"scheme":"light"},"anchor":{"type":"element","commentId":null,"css":"#root > div:nth-of-type(1) > main:nth-of-type(1) > div:nth-of-type(1)","tag":"div","label":"Page 7 Al-Baqarah Juz 1 7 Page 8 Al-Baqarah Juz 1 8","quote":{"exact":"Page 7Al-BaqarahJuz 17\nTahaJuz 16320\nAl-BaqarahJuz 19\nPage 8Al-BaqarahJuz 18\n","prefix":"Pages/Go toRVHBNKWMCJSelect tool","suffix":"Click an ayah on the page to sel"},"box":{"fx":0.02,"fy":0.29},"source":[]},"rev":{"bodyHash":"8e48a05242e6","ts":"2026-11-07T17:42:53Z","git":{"commit":"08a85805","dirty":false}},"body":"Where is the side tool bar? "}
+{"v":1,"ts":"2026-11-07T17:42:53Z","ev":"shot","role":"comment","author":"omar","icloud":"CloudDesktop/data/page-comments/hifth/t_56f379/comment.png","sha":"24c079273ddc"}
+{"v":1,"ts":"2026-11-07T17:58:38Z","ev":"reply","author":"claude","body":"Full screen hides every bar on purpose, the tools down the side included, so the page gets all the room. Press F, or the small button in the bottom corner, to bring them back. If you want the tools in full screen, I've logged it as an open question with options to try: keep them down the side, or show them when the pointer comes near the side (question ① in `docs/decisions/verse-tap-and-hold.md`). I'm leaving this open until you choose.","commit":"931c0ab7"}

.page-comments/threads/t_58a7ab.jsonl

@@ -0,0 +1,5 @@
+{"v":1,"ev":"thread","id":"t_58a7ab","ts":"2026-11-07T18:23:39Z","author":"omar","page":{"url":"http://127.0.0.1:7122/#/hafs-kfqc/2:80","path":"/#/hafs-kfqc/2:80","title":"حفظ · Hifth"},"viewport":{"w":1376,"h":1258,"dpr":1.3953488372093024,"scrollX":0,"scrollY":0,"scheme":"light"},"anchor":{"type":"element","commentId":null,"css":"#root > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > button:nth-of-type(1)","tag":"button","label":"Eraser","box":{"fx":0.81,"fy":0.5},"source":[{"file":"apps/web/e2e/eraser.spec.ts","line":18,"how":"label","commit":"2b835700","dirty":false},{"file":"apps/web/src/components/UndoRedo.tsx","line":57,"how":"label","commit":"2b835700","dirty":false},{"file":"apps/web/src/components/UndoRedo.tsx","line":98,"how":"label","commit":"2b835700","dirty":false}]},"rev":{"bodyHash":"d7c87fad53db","ts":"2026-11-07T18:23:38Z","git":{"commit":"2b835700","dirty":false}},"body":"why is this not in the tool bar ... to the left, it should be an eraser mode"}
+{"v":1,"ts":"2026-11-07T18:23:39Z","ev":"shot","role":"comment","author":"omar","icloud":"CloudDesktop/data/page-comments/hifth/t_58a7ab/comment.png","sha":"7fc583a433e0"}
+{"v":1,"ts":"2026-11-07T18:36:19Z","ev":"shot","role":"after","author":"claude","icloud":"CloudDesktop/data/page-comments/hifth/t_58a7ab/after-b20860a3.png","sha":"80f3165c864d","commit":"b20860a3"}
+{"v":1,"ts":"2026-11-07T18:36:19Z","ev":"reply","author":"claude","body":"On a computer the eraser is now the last tool in the row (after Jump), picked like the others; **E** still turns it on. Where exactly it sits was my call — say if you want it elsewhere. The old place beside Undo is kept as a setting in the info panel, under **Where the eraser sits**. A phone keeps it beside Undo, as its bar has no room. Commit `b20860a3`; after picture in the thread.","commit":"b20860a3"}
+{"v":1,"ts":"2026-11-07T18:36:19Z","ev":"status","author":"claude","status":"resolved","note":"Eraser moved into the tools on a computer, b20860a3"}

.page-comments/threads/t_597343.jsonl

@@ -0,0 +1,5 @@
+{"v":1,"ev":"thread","id":"t_597343","ts":"2026-11-07T17:43:39Z","author":"omar","page":{"url":"http://127.0.0.1:7122/#/hafs-kfqc/p7","path":"/#/hafs-kfqc/p7","title":"حفظ · Hifth"},"viewport":{"w":2752,"h":1258,"dpr":1.3953488372093024,"scrollX":0,"scrollY":0,"scheme":"light"},"anchor":{"type":"element","commentId":null,"css":"#root > div:nth-of-type(1) > main:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(4)","tag":"div","label":"","box":{"fx":0.53,"fy":0.15},"source":[]},"rev":{"bodyHash":"b5272cdc7f0f","ts":"2026-11-07T17:43:39Z","git":{"commit":"08a85805","dirty":false}},"body":"this might need to be shifted vertically up, it strencesh under the pages, and doest go to top of book ... and shadows corners need curving as well "}
+{"v":1,"ts":"2026-11-07T17:43:39Z","ev":"shot","role":"comment","author":"omar","icloud":"CloudDesktop/data/page-comments/hifth/t_597343/comment.png","sha":"101093cc18b5"}
+{"v":1,"ts":"2026-11-07T17:58:38Z","ev":"shot","role":"after","author":"claude","icloud":"CloudDesktop/data/page-comments/hifth/t_597343/after-fb8d5cd0.png","sha":"90efb2d794a5","commit":"fb8d5cd0"}
+{"v":1,"ts":"2026-11-07T17:58:38Z","ev":"reply","author":"claude","body":"Fixed in fb8d5cd0. The shading you see when you hover an outer page edge now starts at the head of the page and ends at its foot, with rounded corners like the page's. It also runs up the page edges to the top, beside the folded corner. Before, it ran the height of the window. A browser test holds it (`EdgeGrabRails`). After picture attached; ready to check.","commit":"fb8d5cd0"}
+{"v":1,"ts":"2026-11-07T17:58:38Z","ev":"status","author":"claude","status":"resolved","note":"Strip follows the paper; fb8d5cd0"}

.page-comments/threads/t_756574.jsonl

@@ -0,0 +1,5 @@
+{"v":1,"ev":"thread","id":"t_756574","ts":"2026-11-07T17:41:55Z","author":"omar","page":{"url":"http://127.0.0.1:7122/#/hafs-kfqc/2:38","path":"/#/hafs-kfqc/2:38","title":"حفظ · Hifth"},"viewport":{"w":2752,"h":1258,"dpr":1.3953488372093024,"scrollX":0,"scrollY":0,"scheme":"light"},"anchor":{"type":"element","commentId":null,"css":"#root > div:nth-of-type(1) > main:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > button:nth-of-type(1) > span:nth-of-type(2)","tag":"span","label":"","box":{"fx":0.23,"fy":0.22},"source":[]},"rev":{"bodyHash":"676248a69d65","ts":"2026-11-07T17:41:55Z","git":{"commit":"08a85805","dirty":false}},"body":"the bacground in the top left corner is not seemlesly lendhing with the page, looks off"}
+{"v":1,"ts":"2026-11-07T17:41:55Z","ev":"shot","role":"comment","author":"omar","icloud":"CloudDesktop/data/page-comments/hifth/t_756574/comment.png","sha":"5a9b834aae2e"}
+{"v":1,"ts":"2026-11-07T17:48:27Z","ev":"shot","role":"after","author":"claude","icloud":"CloudDesktop/data/page-comments/hifth/t_756574/after-965c85e5.png","sha":"20f077b597ba","commit":"965c85e5"}
+{"v":1,"ts":"2026-11-07T17:48:27Z","ev":"reply","author":"claude","body":"Fixed in 965c85e5: the patch under the folded corner was a grey-beige that sat on the page like a pasted square. It now ends in the page's own paper colour, with only a light shade at the crease (`apps/web/src/styles/tokens.css`), and a browser test holds it there. After picture attached; ready to check.","commit":"965c85e5"}
+{"v":1,"ts":"2026-11-07T17:48:27Z","ev":"status","author":"claude","status":"resolved","note":"Under-fold is now the page's own paper; 965c85e5"}

.page-comments/threads/t_b08176.jsonl

@@ -0,0 +1,3 @@
+{"v":1,"ev":"thread","id":"t_b08176","ts":"2026-11-07T18:23:06Z","author":"omar","page":{"url":"http://127.0.0.1:7122/#/hafs-kfqc/2:80","path":"/#/hafs-kfqc/2:80","title":"حفظ · Hifth"},"viewport":{"w":1376,"h":1258,"dpr":1.3953488372093024,"scrollX":0,"scrollY":0,"scheme":"light"},"anchor":{"type":"element","commentId":null,"css":"#root > div:nth-of-type(1) > section:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1) > button:nth-of-type(1)","tag":"button","label":"Share this ayah as a link","quote":{"exact":"⇪Share","prefix":"rah · 2:80×▶︎Listen⬡11Same roots","suffix":"⚑Bookmark↗︎On QUL604 of 604 page"},"box":{"fx":0.6,"fy":0.28},"source":[{"file":".claude/skills/walk-app/scripts/corner-cards.js","line":53,"how":"label","commit":"c70bed78","dirty":true},{"file":".claude/skills/walk-app/scripts/lookalike-walk.js","line":88,"how":"label","commit":"c70bed78","dirty":true},{"file":"apps/web/e2e/desktop.spec.ts","line":2632,"how":"label","commit":"c70bed78","dirty":true}]},"rev":{"bodyHash":"43cf04ccdd0c","ts":"2026-11-07T18:23:05Z","git":{"commit":"c70bed78","dirty":true}},"body":"isntead of these buttons popping up popups, can they not not make the drawer expand and add the sections to the drawer instead? "}
+{"v":1,"ts":"2026-11-07T18:23:06Z","ev":"shot","role":"comment","author":"omar","icloud":"CloudDesktop/data/page-comments/hifth/t_b08176/comment.png","sha":"2dcea6063c40"}
+{"v":1,"ts":"2026-11-07T18:24:04Z","ev":"reply","author":"claude","body":"Today Share, Same roots and the commentary each open their own sheet, and the verse drawer steps aside until that sheet closes. I've logged your idea as open question ③ in `docs/decisions/selection-drawer.md` and on the backlog: the drawer grows to hold the tool's contents (as a section, or as tabs), tried beside today's sheets in a rough build. The drawer must still never cover the verse it is about, so the build has to find how tall it can grow. I'm leaving this thread open until it's built. (The picture saved with this comment came out blank, so I worked from your words.)"}

.page-comments/threads/t_e1e60b.jsonl

@@ -0,0 +1,3 @@
+{"v":1,"ev":"thread","id":"t_e1e60b","ts":"2026-11-07T17:42:43Z","author":"omar","page":{"url":"http://127.0.0.1:7122/#/hafs-kfqc/p7","path":"/#/hafs-kfqc/p7","title":"حفظ · Hifth"},"viewport":{"w":2752,"h":1258,"dpr":1.3953488372093024,"scrollX":0,"scrollY":0,"scheme":"light"},"anchor":{"type":"element","commentId":null,"css":"#root > div:nth-of-type(1) > main:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(1)","tag":"div","label":"Al-Baqarah Juz 1 8","quote":{"exact":"Al-BaqarahJuz 18\n","prefix":"uz 16320\nAl-BaqarahJuz 19\nPage 8","suffix":"Click an ayah on the page to sel"},"box":{"fx":1,"fy":0.98},"source":[]},"rev":{"bodyHash":"6fbd56b6c4ce","ts":"2026-11-07T17:42:43Z","git":{"commit":"08a85805","dirty":false}},"body":"In full screen mode ( or regular mode) how do i interact wit hthe book mark? how do I \"pull it down? puill it up? etc?"}
+{"v":1,"ts":"2026-11-07T17:42:43Z","ev":"shot","role":"comment","author":"omar","icloud":"CloudDesktop/data/page-comments/hifth/t_e1e60b/comment.png","sha":"252618e3b7fe"}
+{"v":1,"ts":"2026-11-07T17:58:38Z","ev":"reply","author":"claude","body":"Nothing is pulled today; it's all clicks, in full screen and out:\n- **Drop one:** click the page's top outer corner (top-left on a left page). It folds, a ribbon hangs, and a box opens to name it.\n- **Rename or lift one:** click its ribbon.\n- **Lift them all:** click the folded corner again; Undo puts them back.\n\nPulling a ribbon down or pushing it up isn't built. I've logged it as an open question with options to try (question ② in `docs/decisions/bookmark-fold.md`), including making the corner easier to find in full screen. I'm leaving this open until that's built.","commit":"931c0ab7"}

.page-comments/threads/t_e7e04a.jsonl

@@ -0,0 +1,3 @@
+{"v":1,"ev":"thread","id":"t_e7e04a","ts":"2026-11-07T18:24:26Z","author":"omar","page":{"url":"http://127.0.0.1:7122/#/hafs-kfqc/2:80","path":"/#/hafs-kfqc/2:80","title":"حفظ · Hifth"},"viewport":{"w":1376,"h":1258,"dpr":1.3953488372093024,"scrollX":0,"scrollY":0,"scheme":"light"},"anchor":{"type":"element","commentId":null,"css":"#root > div:nth-of-type(1) > div:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > button:nth-of-type(4) > svg:nth-of-type(1)","tag":"svg","label":"","box":{"fx":0.33,"fy":0.6},"source":[]},"rev":{"bodyHash":"43cf04ccdd0c","ts":"2026-11-07T18:24:26Z","git":{"commit":"2b835700","dirty":true}},"body":"in full screen mode ... there should be a small minimal icon dock that expands when we hover over it in desktop mode ... in mobile mode we need to find an equialvent feature"}
+{"v":1,"ts":"2026-11-07T18:24:26Z","ev":"shot","role":"comment","author":"omar","icloud":"CloudDesktop/data/page-comments/hifth/t_e7e04a/comment.png","sha":"2dcea6063c40"}
+{"v":1,"ts":"2026-11-07T18:37:11Z","ev":"reply","author":"claude","body":"Added to the backlog as a third way to build for full screen: a small dock of tool icons that opens out under the pointer on a computer. For a phone, which has no pointer to hover, I noted a small handle at the edge that a tap opens as a first idea. It sits with your earlier full-screen question in `docs/decisions/verse-tap-and-hold.md` ①; left open until there is a rough build to try."}

apps/web/e2e/bookmarks.spec.ts

@@ -26,6 +26,28 @@ async function openMap(page: Page) {
 }
 
 test.describe("Hifth · bookmarks", () => {
+  test("the page under the folded corner is a light shade of the page's own paper", async ({ page }) => {
+    // The owner, 2026-11-07: the patch under the fold read as a grey square
+    // that did not blend with the page. It is the same sheet as the page, so
+    // every shade of it stays close to the page's paper. (How much darker it
+    // must stay, so it still reads as a fold, is the test in edge-peel.spec.ts.)
+    await ready(page);
+    const under = page.locator("[class*='foldUnder']").first();
+    await expect(under).toBeAttached();
+    const { stops, paper } = await under.evaluate((el) => {
+      const lum = (c: number[]) => 0.2126 * c[0]! + 0.7152 * c[1]! + 0.0722 * c[2]!;
+      const leaf = document.querySelector("[class*='host'][data-leaf]");
+      const bg = getComputedStyle(el).backgroundImage;
+      const shade = bg.slice(bg.lastIndexOf("linear-gradient"));
+      const stops = [...shade.matchAll(/rgb\((\d+), (\d+), (\d+)\)/g)].map((m) => lum(m.slice(1, 4).map(Number)));
+      return { stops, paper: lum(getComputedStyle(leaf as Element).backgroundColor.match(/\d+/g)!.map(Number)) };
+    });
+    expect(stops.length).toBeGreaterThan(1);
+    // The old grey sat 58 below the page at the crease and 30 at the corner.
+    for (const s of stops) expect(paper - s, "a shade of the page stays within 22 of it").toBeLessThanOrEqual(22);
+    expect(paper - stops[stops.length - 1]!, "the corner end is all but the page").toBeLessThanOrEqual(12);
+  });
+
   test("a folded corner drops a named ribbon that is still there after a reload", async ({ page }) => {
     await ready(page);
     await page.getByRole("button", { name: "Drop a bookmark on this page" }).first().click();

apps/web/e2e/desktop.spec.ts

@@ -2286,7 +2286,7 @@ test.describe("Hifth · the page tools bar", () => {
     await expect(toolBtn(page, "Highlight")).toBeFocused();
     await expect(toolBtn(page, "Highlight")).toHaveAttribute("aria-checked", "true");
     await page.keyboard.press("End");
-    await expect(toolBtn(page, "Jump")).toHaveAttribute("aria-checked", "true");
+    await expect(toolBtn(page, "Eraser")).toHaveAttribute("aria-checked", "true");
   });
 
   test("with the highlighter, a plain drag paints — no hold first", async ({ page }) => {