An item's text keeps to about 70 characters a line (#360)

Across a wide window a line ran past a hundred characters. On trial:
reverted if it does not suit.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

tests/ui/app.spec.js

@@ -189,6 +189,14 @@ test('the reading font is an item\'s title and text, and the interface keeps its
   // A serif gets more room between its lines (1.75 of the text's size, against 1.65).
   const lh = await page.locator('#detail .dbody').evaluate(el => { const c = getComputedStyle(el); return parseFloat(c.lineHeight) / parseFloat(c.fontSize); });
   expect(lh).toBeCloseTo(1.75, 2);
+  // About 70 characters a line, however wide the pane (#360).
+  const measure = await page.locator('#detail .dbody').evaluate(el => {
+    const ch = document.createElement('span'); ch.textContent = '0'; el.append(ch);
+    const n = el.getBoundingClientRect().width / ch.getBoundingClientRect().width; ch.remove(); return n; });
+  expect(measure).toBeLessThanOrEqual(70.5);
+  const [pane, text] = await page.locator('#detail .dbody').evaluate(el =>
+    [el.parentElement.clientWidth, el.getBoundingClientRect().width]);
+  expect(text, 'the pane is wider, so the measure is what holds it').toBeLessThan(pane - 100);
 
   await page.locator('#srfont').selectOption('same');
   await page.locator('#sfont').selectOption('theme');

web/CHANGELOG.md

@@ -11,6 +11,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+### Changed
+
+- An item's title and text keep to about 70 characters a line, however wide the window, so the eye finds the start of the next line (#360).
+
 ### Added
 
 - Fonts of your choosing in Settings, beside the theme, kept by each browser as the theme is: one for the interface and one for reading an item's title and text, which is the interface's until chosen, with a little more room between the lines in a serif. Inter, your system's, the reading fonts Atkinson Hyperlegible, Lexend, Literata, Source Serif and OpenDyslexic, your device's serif, or monospace. The default keeps each theme's face as it was (#359).

web/app.css

@@ -889,6 +889,9 @@ body.scan-this .fhead [data-a=scan] .i,body.scan-any .fhead [data-a=scanall] .i,
 .dmeta .tview{width:auto;padding:3px 6px;font-size:12px}
 #detail .encbox{margin:0 0 10px}
 .dbody{font-size:14.5px;line-height:1.65;overflow-wrap:anywhere;color:var(--fg)}
+/* About 70 characters a line, where the eye finds the next line's start without hunting: across a
+   wide window a line ran past a hundred (#360). In ch, so the measure follows the reading font. */
+#detail :is(.dt,.dbody){max-width:70ch}
 .dbody img{max-width:100%;height:auto;border-radius:6px}
 .dbody a{color:var(--accent)}
 .dbody pre{overflow-x:auto;background:var(--panel2);padding:10px;border-radius:8px}