Merge pull request #57 from kristianwind/site-charcoal-features

docs(site): Charcoal theme, offline, and the star that comes off

docs/index.md

@@ -39,8 +39,17 @@ forward mail to, and an MCP endpoint so Claude can work your task list directly.
 - **Live sync** — a change made by somebody else appears without a refresh.
 - **Repeating tasks** as RRULE, comments and attachments, and reminders that go
   out as Web Push to an iPhone or a Mac.
-- **[Calendar](caldav.md), [mail](mail.md) and [Claude](mcp.md)** connected over
-  open standards rather than private formats.
+- **[Your mail as an inbox](mailboxes.md).** Star a mail in Gmail, or flag one
+  over IMAP in iCloud or Fastmail, and it becomes a task — and the star or flag
+  comes off once it has, so a starred inbox empties as the tasks are made instead
+  of only filling up.
+- **[Calendar](caldav.md) and [Claude](mcp.md)** connected over open standards
+  rather than private formats.
+- **Six themes**, three dark and three light — including *Charcoal*, a warm
+  near-black after Apple Notes — and a size and typeface chosen apart from them.
+- **Holds through a short network drop.** A save rides out a few seconds of no
+  signal and goes through when it comes back; a reload opens from what it last saw
+  rather than the browser's offline page. It installs as a PWA.
 
 ## What it looks like
 
@@ -60,6 +69,12 @@ columns.*
 marked with an arrow to them, so a delegated task reads as delegated wherever you
 meet it.*
 
+![Notes in the Charcoal theme](screenshots/notes-charcoal.png)
+
+*Charcoal, the newest of six themes — a warm near-black after Apple Notes, with
+amber where the accent green usually is. Three dark themes and three light, and a
+typeface and size chosen apart from them.*
+
 ![Settings, integrations](screenshots/settings.png)
 
 *Where [Gmail](mailboxes.md), the [calendar feed](caldav.md) and the

site/index.html

@@ -992,12 +992,22 @@
 					<figure class="shot">
 						<img
 							src="screenshots/themes.webp"
-							alt="The settings page showing five themes as swatches and, below them, four looks written in the typeface each one selects."
+							alt="The settings page showing six themes as swatches and, below them, four looks written in the typeface each one selects."
 							width="1400"
 							height="900"
 							loading="lazy"
 						/>
-						<figcaption>Five themes and four looks: how bright, and how it reads.</figcaption>
+						<figcaption>Six themes and four looks: how bright, and how it reads.</figcaption>
+					</figure>
+					<figure class="shot">
+						<img
+							src="screenshots/notes-charcoal.webp"
+							alt="Notes in the Charcoal theme: a warm near-black modelled on Apple Notes, the note list on the left and a note open on the right, with amber where the accent green usually is."
+							width="1400"
+							height="900"
+							loading="lazy"
+						/>
+						<figcaption>Charcoal — the newest theme, a warm near-black after Apple Notes, amber for the accent.</figcaption>
 					</figure>
 					<figure class="shot">
 						<img
@@ -1120,6 +1130,15 @@
 							by itself — without touching when it is actually due.
 						</p>
 					</div>
+					<div class="cell">
+						<h3>Holds through a drop</h3>
+						<p>
+							A tunnel, a lift, a base station handing over — the app does not go
+							blank when the signal does. A save you make rides out a few seconds of
+							no connection and goes through when it comes back, and a reload opens
+							from what it last saw rather than the browser's offline page.
+						</p>
+					</div>
 				</div>
 
 				<p class="group-label">Connected to what you already use</p>
@@ -1154,9 +1173,10 @@
 						<h3>Your mail, as an inbox</h3>
 						<p>
 							Star a mail in Gmail, or flag one over IMAP in iCloud or Fastmail, and
-							it becomes a task. Forward one to your own address instead and the
-							subject is parsed like anything else you type. One way: unstarring it
-							later does nothing to the task you made.
+							it becomes a task — and the star or flag comes off once it has, so a
+							starred inbox empties as the tasks are made instead of only filling up.
+							Forward one to your own address instead and the subject is parsed like
+							anything else you type.
 						</p>
 					</div>
 					<div class="cell">
@@ -1237,6 +1257,25 @@
 					<a href="https://github.com/kristianwind/verdande/releases">the releases page</a>.
 				</p>
 				<ul class="lately">
+					<li>
+						<span class="ver">0.42</span>
+						A sixth theme, <strong>Charcoal</strong> — a warm near-black after Apple
+						Notes, with amber for the accent. And the app now holds through a short
+						network drop: a save rides out a few seconds of no signal, and a reload
+						opens from what it last saw rather than the browser's offline page.
+					</li>
+					<li>
+						<span class="ver">0.42</span>
+						A starred Gmail message loses its star once it has become a task, the way
+						a flagged IMAP mail already did — so a starred inbox empties itself as the
+						tasks are made instead of only filling up.
+					</li>
+					<li>
+						<span class="ver">0.42</span>
+						Notes read as three lines, the last one the project they are filed under;
+						the calendar lightened to pastel days with today marked at the top; and
+						two-factor set-up shows a QR code to scan.
+					</li>
 					<li>
 						<span class="ver">0.41</span>
 						A task you have delegated is marked where you meet it, not only on the

web/scripts/generate-screenshots.js

@@ -73,6 +73,12 @@ const SHOTS = [
 	{ name: 'detail', path: (ids) => `/opgave/${ids.detail}`, theme: 'dark' },
 	{ name: 'notes', path: '/noter', theme: 'dark', prepare: openMeetingNote },
 	{ name: 'notes-source', path: '/noter', theme: 'dark', prepare: showNoteSource },
+	// Charcoal, the newest theme — a warm near-black modelled on Apple Notes, with
+	// amber where the green usually is. Today and the notes list are the two views
+	// that show a theme's surfaces, text and one accent at once, so those are the two
+	// the landing page carries it in.
+	{ name: 'today-charcoal', path: '/', theme: 'charcoal' },
+	{ name: 'notes-charcoal', path: '/noter', theme: 'charcoal', prepare: openMeetingNote },
 	// The new work, and in the light theme, which is what most people want to look
 	// at a landing page in. The calendar drawing tasks to their length, and a note
 	// somebody shared into the "Shared with me" group.