fix(look): stregen under hurtig tilføjelse havde ingen luft under sig

Den skiller "skriv en ny" fra "det, der allerede er". Uden afstand sad den første
sektion klods op ad den, så den læste som en kant om sektionen frem for som en
afslutning på feltet over. En streg skal have plads på begge sider for at kunne
ses som en streg.

Co-Authored-By: Claude Opus 5 <[email protected]>

web/src/lib/components/NoteEditor.svelte

@@ -874,7 +874,17 @@
 		 *
 		 * Kun teksten, ikke arket: værktøjslinjen og foden hører til ruden og skal
 		 * blive i den. */
-		max-width: 46rem;
+		/* Bredden vokser med ruden, men ikke i det uendelige.
+		 *
+		 * 46rem var for stramt: på en skærm, der er halvanden gang så bred, stod
+		 * teksten i en smal søjle med en håndflade tom plads ved siden af — og
+		 * kodeblokke og billeder, som er de to ting i en note, der *vil* have
+		 * bredde, blev klemt sammen uden grund.
+		 *
+		 * clamp frem for et tal: en smal rude får det hele, en bred får en
+		 * linjelængde, øjet kan finde tilbage i. Øvre grænse omkring 68rem, hvor en
+		 * linje er lang nok til at rumme en kommando og kort nok til at læse. */
+		max-width: clamp(38rem, 92%, 68rem);
 		width: 100%;
 	}
 

web/src/lib/components/QuickAdd.svelte

@@ -221,6 +221,13 @@
 		gap: var(--s3);
 		padding: var(--s3) var(--s2);
 		border-bottom: 1px solid var(--line);
+		/* Luft under stregen.
+		 *
+		 * Stregen skiller "skriv en ny" fra "det, der allerede er", og uden afstand
+		 * sad den første sektion klods op ad den — så den læste som en kant om
+		 * sektionen frem for som en afslutning på feltet over. En streg skal have
+		 * plads på begge sider for at kunne ses som en streg. */
+		margin-bottom: var(--s4);
 	}
 
 	.plus {

web/src/routes/noter/+page.svelte

@@ -545,6 +545,11 @@
 									<span class="filed">{projectName(note.project_id)}</span>
 								{/if}
 							</button>
+							<!-- De to knapper står oven på hinanden i en smal søjle.
+							     Ved siden af hinanden tog de toogfyrre pixels af en liste,
+							     der er tre hundrede bred — og de bruges sjældent, mens
+							     titlen og uddraget læses hele tiden. -->
+							<div class="rowactions">
 							<!-- Én note lagt væk, uden at markere den først. Markeringen er
 							     til flere; det her er til den ene, man står med — og i
 							     arkivet er det vejen tilbage. -->
@@ -568,6 +573,7 @@
 							>
 								{note.pinned ? '★' : '☆'}
 							</button>
+							</div>
 						</div>
 					</li>
 				{/each}
@@ -890,9 +896,20 @@
 		gap: var(--s1);
 	}
 
+	/* De sjældne handlinger i en søjle, ikke en række. To knapper ved siden af
+	   hinanden er toogfyrre pixels taget fra en liste på tre hundrede — og de er
+	   det, man rører en gang imellem, mens titlen er det, man læser hele tiden. */
+	.rowactions {
+		display: flex;
+		flex-direction: column;
+		gap: 1px;
+		flex: none;
+	}
+
 	.star {
 		flex: none;
-		width: 24px;
+		width: 22px;
+		height: 22px;
 		color: var(--ink-faint);
 		opacity: 0;
 		font-size: var(--text-sm);