diff options
| author | Adam Soltys <[email protected]> | 2026-09-13 09:53:45 -0700 |
|---|---|---|
| committer | Adam Soltys <[email protected]> | 2026-09-13 09:53:45 -0700 |
| commit | fda681331ae3de5abee04042caed994954e1b705 (patch) | |
| tree | 64e35f74d9af1869b66b386a0165d08f783f31fe /src/style.css | |
| parent | 38b3d091e8e1bece958c0d7e80a5ee78434de933 (diff) | |
| download | coinosv3-fda681331ae3de5abee04042caed994954e1b705.tar.gz coinosv3-fda681331ae3de5abee04042caed994954e1b705.zip | |
See the post before you post it.
A draft is written as plain text but doesn't arrive as plain text: a URL
ending in .jpg becomes a picture, a youtu.be link becomes a player, a
nostr: reference becomes the note it points at, an npub becomes a name.
The only way to find out how yours would land was to send it.
The eye beside the paperclip — on the composer and on a reply — opens a
preview. It runs the draft through noteBody, the very renderer the feed
uses, so this isn't a lookalike of the real thing: it IS the real thing,
in a dashed frame with a PREVIEW label so it can never be mistaken for
the post itself. It follows the draft live while it's open (and only
while it's open — a render per keystroke is not free).
Attaching a picture opens it by itself. Showing you what you attached is
the answer to the question attaching it raises, and it costs no tap.
tools/compose-preview-test.js covers both the composer and a reply: the
picture renders rather than sitting there as a URL, the YouTube link
becomes a player, the preview tracks typing, and it puts itself away.
Co-Authored-By: Claude Opus 5 (1M context) <[email protected]>
Claude-Session: https://claude.ai/code/session_019mrt228Upn9nNCwGixzSLx
Diffstat (limited to 'src/style.css')
| -rw-r--r-- | src/style.css | 13 |
1 files changed, 13 insertions, 0 deletions
diff --git a/src/style.css b/src/style.css index c9b4368..fc25801 100644 --- a/src/style.css +++ b/src/style.css @@ -598,6 +598,19 @@ html.no-scroll { overflow: hidden; scrollbar-gutter: auto; } .quote-card.clickable { cursor: pointer; } .quote-card.clickable:hover { border-color: var(--line-strong); } .quote-loading { flex-direction: row; align-items: center; gap: 8px; } +/* What a draft will look like once it's out there. Framed and labelled, so + it can hold real post content — pictures, players, quoted notes — without + ever being mistaken for the post itself. */ +.draft-preview { + border: 1px dashed var(--line-strong); border-radius: 10px; + padding: 10px 12px; background: var(--surface2); + display: flex; flex-direction: column; gap: 6px; +} +.draft-preview-tag { + font-size: 11px; font-weight: 650; letter-spacing: .04em; + text-transform: uppercase; color: var(--faint); +} +.attach-btn.on { color: var(--accent-ink); border-color: var(--accent); } .quote-card .note-text { font-size: 14px; } .quote-name { font-weight: 600; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .quote-card .note-img { max-height: 220px; } |