[vitalNohj]

Closes #281

Keeps the unsent answers on a Pi asks card when you switch sessions or reload, and clears them once the card is done. It also spaces the card's questions out so a card with several reads more easily.

What it does

• The person who may answer has their picks and typed text saved for that card, per person, through person-storage.js, the way the message box keeps a draft. Switching to another session and back, whether or not the tab has shown that session before, or reloading, shows them again.
• A card for someone else stays as it is and saves nothing.
• The saved answers are cleared on Send, on Decline, when the question leaves while its card is on screen because the run stopped or it was answered elsewhere, and on sign-out. A question that ends while the tab shows another session leaves its entry until sign-out; nothing shows it again, because the card is gone. Archiving a session does not cancel its question, so the card and its answers stay.
• A Send the server turns down (for example an answer over 4096 characters) keeps the answers, so you can fix them and try again.
• A different card starts empty. A saved entry that no longer fits the form is removed, so it cannot come back later.
• A secret field's unsent text is kept the same way as the other fields: in this browser's storage until one of the above clears it.

Layout

Each question now has more room above it (24px) than inside it (8px), and its header tag always sits on its own line above the question, so short and long questions start the same way. Option labels and descriptions start at the top, options in one row are the same height, and an odd last option takes the whole row on wide screens instead of leaving a hole. "Or type your own answer" is a quieter one-line box under that question's options, so it no longer looks like one more option, and a hairline sets Decline and Send apart from the last question. CSS only, with the app's existing variables; on a phone the options stay one column and at least 44px tall.

Screenshots

A card with three questions: one long question with two long options, one with three options, and one with three options where more than one can be chosen.

Before (desktop):

After (desktop):

After, light theme:

After, phone (390px):

Tests

• Pick a choice and type an answer, switch to a session the tab has not shown yet and back, and the card shows both. A reload still shows them.
• Switch with the app's own navigation between two sessions the tab has already shown, and the pick and its saved entry are still there when you come back. This failed before the fix.
• Send an answer the server turns down: the saved entry stays and a reload shows the typed text. This failed before the fix.
• After Send, the saved entry is gone. A new card starts empty.
• Sign-out clears the saved entry.
• Someone else sees the waiting card and their browser keeps no answer.
• The existing mobile test still finds the options at least 44px tall.

Decline, a stopped run, a question answered elsewhere, and a saved entry that no longer fits are not covered by a test of their own.

npm run check passes. eslint and prettier pass on the touched files. node --test --test-concurrency=2 on test/ask-answers-ui.test.ts, test/ask.test.ts, test/approvals.test.ts, and test/person-storage.test.ts: 17 tests, 17 pass. With test/mobile-ui.test.ts added: 44 tests, 44 pass.