Revision 10 of 16 · Build The Urlist

+14 −9 lines of text vs revision 9 (this site's diff)

This revision also changed the line endings (CRLF → LF); GitHub counts that as every line changed, which is why it reports +263 −258.

The text of revision 10 against revision 9: + marks an added line, − a removed one, with three unchanged lines of context around each change; old and new line numbers on the left where there is room.
Old	New	Change	Line
@@ -77,20 +77,25 @@
77	77
78	78		## Home page
79	79
80		−	Top section, two columns on desktop (banner hidden on mobile):
	80	+	Two stacked sections. The top one sits on the page's base background; the bottom one is a distinct, slightly darker full-bleed band.
81	81
82		−	- Left column, in order:
83		−	1. H1: Group links, Save & Share them with the world — the single words "Group", "Save", and "Share" rendered in the primary teal color.
84		−	2. Paragraph: Add links to a list and share it with one simple URL.
85		−	3. Paragraph: Create a list anonymously or login to save, manage, and edit your lists.
86		−	- Right column: a Postrboard-native hero illustration (lazy loaded, roughly 500×500), in place of the reference app's `banner-logo-large.svg`.
	82	+	Top section — two columns on desktop (the illustration is hidden on mobile), both columns top-aligned (the copy starts at the top of the section; it is not vertically centered against the illustration):
87	83
88		−	Bottom section on a distinct background: a centered, bold, primary-colored H2 Get Started, followed by the first-link input widget.
	84	+	- Left column, in order, generously spaced:
	85	+	1. H1 (large, medium weight — not bold): Group links, Save & Share them with the world — the single words "Group", "Save", and "Share" rendered in the primary teal color at the same weight as the rest of the sentence.
	86	+	2. Paragraph (regular body text): Add links to a list and share it with one simple URL.
	87	+	3. Paragraph (regular body text): Create a list anonymously or login to save, manage, and edit your lists.
	88	+	- Right column: a Postrboard-native hero illustration (lazy loaded, roughly 500×500; in place of the reference app's `banner-logo-large.svg`). Its subject is three cascading browser-window frames, each offset down and to the right of the one behind it, alternating light / dark / light window chrome, each with a tab strip and an address bar reading `theurlist.com` and an otherwise empty page — it evokes a shared list opening in any browser. Draw it from Postrboard tokens (surface, border, text, accent colors and radii), keep it quiet, and do not copy the source SVG.
89	89
	90	+	Bottom section ("Get Started") — a full-bleed band on a distinct background (the reference renders it as a very wide sheet with a gently rounded top edge rising from the bottom of the page; a full-width band with a subtle rounded or straight top edge is fine). It runs to the bottom of the page, filling the remaining viewport height when the page is shorter than the window. Inside, on the normal content width:
	91	+
	92	+	1. A centered, bold, primary-colored H2 Get Started
	93	+	2. The first-link input widget, left-aligned and spanning the full content width (not centered or narrowed): the helper text directly above the input, then the input.
	94	+
90	95		First-link input widget:
91	96
92		−	- Helper text above the input: "Enter a link and press enter"
93		−	- Extra-large text input with placeholder `http://example.com`
	97	+	- Helper text above the input (left-aligned, regular-weight body text — not a small bold form label): "Enter a link and press enter"
	98	+	- Extra-large text input spanning the full width of its container, with large placeholder/value text (visibly the biggest input on the page after the editor's vanity field), placeholder `http://example.com`
94	99		- Submit with Enter key. Validation: non-empty after trim; must parse as an absolute `http` or `https` URL (a bare domain-like value may be prefixed with `http://`); the host (after stripping a leading `www.`) must be a DNS-like host containing at least one dot. Invalid: apply the invalid input state and show "That doesn't look like a valid URL"
95	100		- On valid submit: add the link to the local draft, clear the input, refocus it, start metadata enrichment for that link, navigate to `/s/new`.
96	101