Mira

test

Description

Mira is a small, minimal thing that does exactly one job. It was built in a few sittings and has not needed much since.

Everything on one screen — no tabs, no wizard
Keyboard-first: / focuses search, esc closes anything
Works offline once it has loaded

Claude Code did most of the lifting. I wrote the schema by hand and let the generated components follow it rather than the other way round.

Open to feedback, especially on the parts I have stopped being able to see.

Main prompt

Use 4:3
Three reasons, in order:

It's what you already have. 26 of 27 images fit exactly. Zero re-cropping, and the crop damage you've been living with disappears.
A website is tall. 16:9 letterboxes the hero and cuts everything below it. 4:3 shows the hero plus a slice of the next section — which is what tells someone whether a site is worth clicking. This is why Dribbble, Godly and most showcase galleries sit near 4:3 rather than at screen ratio.
Taller cards read better in a grid at your card width. At ~240px wide that's 180px of image instead of 135px — a third more to look at, in a layout that scrolls anyway.
The one cost: fewer cards above the fold. Worth it — people scroll a gallery, they don't scan it.

But loosen the validator
This is the more important fix. Right now it demands one ratio within ±0.12 and rejects everything else — so anyone who screenshots a browser window (16:9 or 16:10) gets bounced and has to go crop an image before they can submit. That's a real drop-off point on the one form that matters.

Better: display at 4:3, accept anything from ~1.2 to ~1.9, and let object-cover crop it. Add a live preview in the upload box showing the actual crop, so nobody is surprised by what lands on their card.

That way your existing images are pixel-perfect, a raw browser screenshot just works, and the only thing anyone sees is what their card will look like.

Want me to switch it to 4:3 with the permissive validator and crop preview?