Lay the notes screen out like a notes app
The list of notes and the note being written are one screen now, two panes: the notes on the left, the open one on the right, side by side where there is room and one at a time on a phone, where the back button returns to the list. The search box moved into the top of that list, and its results *are* the list — searching is a way of finding a note, not a separate place to be, and a tab for it was a tab too many. Emptying the box brings the whole list back. Opening a hit opens that day at the lesson that matched, rather than at the top of a day with six of them. A row has to say what the note holds, so the listing carries it: the subjects a day covers, how many lessons, and the first line actually written in it. One request for the whole list rather than one per note. `plainText` is now one rule in one place for wherever a note is shown rather than edited — the search snippet and the list row both went through their own half-copy of it, and the row's copy rendered a table as `| | |` and left `_Fazit_` wearing its markers. It strips one leading marker, not each in turn, because `## 1. Deutsch` keeps its lesson number and the list rule was eating it. Driven in Firefox at both widths: the list, the search, opening a hit, the jump to the lesson, and the phone's list-then-note. 390 unit tests, 116/117 smoke. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -27,13 +27,29 @@
|
||||
<header>
|
||||
<nav class="tabs">
|
||||
<button type="button" id="tab-notes" class="tab" aria-current="page">Notizen</button>
|
||||
<button type="button" id="tab-search" class="tab">Suche</button>
|
||||
<button type="button" id="tab-settings" class="tab">Einstellungen</button>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<!-- Notes: one school day per note, one heading per lesson. -->
|
||||
<main id="view-notes" class="view">
|
||||
<!-- Two panes: the notes on the left, the open one on the right. Side by
|
||||
side where there is room; one at a time on a phone, where `data-pane`
|
||||
says which, and the back button returns to the list. -->
|
||||
<main id="view-notes" class="view notes" data-pane="list">
|
||||
<aside class="rail">
|
||||
<div class="rail-head">
|
||||
<form id="search-form" class="searchbar" role="search">
|
||||
<input id="search-input" type="search" inputmode="search" autocomplete="off"
|
||||
placeholder="Durchsuchen" aria-label="Notizen durchsuchen">
|
||||
</form>
|
||||
<button type="button" id="today" aria-label="Heutiger Tag" title="Heutiger Tag">+</button>
|
||||
</div>
|
||||
<p id="rail-status" class="status" role="status" aria-live="polite"></p>
|
||||
<div id="rail-list" class="rail-list"></div>
|
||||
</aside>
|
||||
|
||||
<section class="detail">
|
||||
<button type="button" id="back" class="back">‹ Notizen</button>
|
||||
<div class="daybar">
|
||||
<button type="button" id="prev" aria-label="Vorheriger Tag">‹</button>
|
||||
<div class="daybar-centre">
|
||||
@@ -84,23 +100,15 @@
|
||||
<button type="button" id="fill" hidden>Stunden ergänzen</button>
|
||||
<span id="lessons-hint" class="hint"></span>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- Search: the notes themselves, read from disk rather than the index, so a
|
||||
lesson written this morning is findable this morning. -->
|
||||
<main id="view-search" class="view" hidden>
|
||||
<form id="search-form" class="searchbar">
|
||||
<input id="search-input" type="search" inputmode="search" autocomplete="off"
|
||||
placeholder="In den eigenen Notizen suchen" aria-label="Suchbegriff">
|
||||
<button type="submit">Suchen</button>
|
||||
</form>
|
||||
<p id="search-status" class="status" role="status" aria-live="polite"></p>
|
||||
<div id="search-results" class="results"></div>
|
||||
<article id="search-note" class="note-preview" hidden>
|
||||
<button type="button" id="search-back">‹ Zurück zu den Treffern</button>
|
||||
<h2 id="search-note-title"></h2>
|
||||
<div id="search-note-body" class="editor" aria-readonly="true"></div>
|
||||
<!-- A note that is not a school day — one from the import, a page of
|
||||
revision — has no day to open, so it is shown rather than edited. -->
|
||||
<article id="note-preview" class="note-preview" hidden>
|
||||
<h2 id="note-preview-title"></h2>
|
||||
<p id="note-preview-path" class="hint"></p>
|
||||
<div id="note-preview-body" class="editor" aria-readonly="true"></div>
|
||||
</article>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<!-- Settings: the Schulcloud token, and what the server is doing. -->
|
||||
|
||||
Reference in New Issue
Block a user