nmemmertandClaude Sonnet 5.5
9e722a296d
Build and Push Docker Image / build-and-push (push) Failing after 20s
New reading surface with paper/sepia/dark themes, slim top and bottom bars, and sheets for navigation, search, settings, audio and per-verse study tools. Plan progress is built into the reader. Page-flip mode removed. ESV added via the server-side proxy (ESV_API_KEY). Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
19 lines
1.1 KiB
React
19 lines
1.1 KiB
React
// Thin strip under the top bar while the open chapter belongs to an active
|
|
// reading plan. Shows which day you're on and lets you mark it read.
|
|
export default function PlanStrip({ matches, notice, onToggle }) {
|
|
if (!matches.length && !notice) return null;
|
|
return (
|
|
<div className="mx-auto flex max-w-2xl flex-col gap-1 px-4 pt-2 font-sans">
|
|
{notice && <p className="rounded-lg bg-[var(--r-bar)] px-3 py-1.5 text-xs text-[var(--r-accent)]">{notice}</p>}
|
|
{matches.map((m) => (
|
|
<button key={m.progressId} type="button" onClick={() => onToggle(m)}
|
|
className="flex items-center justify-between gap-3 rounded-lg bg-[var(--r-bar)] px-3 py-1.5 text-left text-xs text-[var(--r-sub)] hover:bg-black/5"
|
|
title={m.done ? 'Tap to unmark this day' : 'Tap to mark this day read'}>
|
|
<span className="truncate"><span className="text-[var(--r-accent)]">{m.done ? '✓' : '●'}</span> {m.plan.title} · Day {m.dayIndex + 1} of {m.plan.days}</span>
|
|
<span className="shrink-0">{m.total > 1 ? `${m.position} of ${m.total}` : m.done ? 'Read' : 'Mark read'}</span>
|
|
</button>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|