# Feedback and voting board

> A warm cream feedback board: an idea collects votes, rises past the leader and takes the top spot.

- Kind: Plan
- Page: https://ownlyplans.com/bhaskar/feedback-and-voting-board/
- Licence: CC BY 4.0 (reuse with credit)

## Steps

### 1. Paste the prompt

The AI builds the board with the five ideas.

Prompt:

```text
Build a single-file HTML feedback and voting board, 1280x720, warm cream background #fbf7f0, ink #241d12, accent amber #c58a1d. System fonts, no libraries.
Header: H1 "Feedback board", muted "Vote for what we build next" and a dark "+ New idea" button top right.
Five absolutely positioned white cards (96px tall, 20px radius, soft shadow, 114px apart). Each has a 66px vote box (small up arrow, a count, the word "votes"), a title with a muted "Requested by N teams" line and a status pill on the right (Planned amber, Open blue, Shipped green): Dark mode for the dashboard 142, Export reports to CSV 138, Slack notifications 121, Two-factor sign in 97, Custom domains 64.
Motion (8 second loop): cards rise in with a stagger. The count of Export reports to CSV ticks up 139, 140, 145 (CSS @property integer), its vote box turns amber and the card moves to the top slot while Dark mode moves down. Reset at the end.
Respect prefers-reduced-motion. Return only the complete HTML.
```

### 2. Check the count

The second card should tick up to 145.

### 3. Check the swap

It should move above the first card smoothly.

Done when: You can see it working in the browser.

### 4. Make it real

Store votes per user and sort by votes.

## Files

- prompt.md: https://ownlyplans.com/bhaskar/feedback-and-voting-board/prompt/ (The full prompt.)
- index.html.md: https://ownlyplans.com/bhaskar/feedback-and-voting-board/index-html/ (Complete code of the result in the video.)

## About

Five feature requests with vote boxes and status pills. The second idea gains votes, highlights and swaps places with the first. Topic inspired by OpenDesign's public dashboard prompt list; this prompt and design are written from scratch.

---
Also available as JSON: https://ownlyplans.com/bhaskar/feedback-and-voting-board/?format=json
MCP server: https://ownlyplans.com/mcp