# Issue triage inbox > A cream issue triage list: issues are assigned or closed as duplicates, the rest move up and the untriaged count drops from 9 to 6. - Category: Developer tools - Version: 1.0 - Source: https://ownlyplans.com/bhaskar/issue-triage-inbox/ ## Overview An issue inbox with five cards. The first gets an ASSIGNED tag and slides away, a duplicate gets a red CLOSED tag and leaves, the others slide up and the Untriaged counter counts down. Topic inspired by OpenDesign's public dashboard prompt list; this prompt and design are written from scratch. ## Tech stack - CSS - Dashboard - HTML ## Build steps ### 1. Paste the prompt One prompt builds the whole inbox. Prompt: ```text Make a single-file HTML issue triage inbox, 1280x720, warm cream background #f6f3ee, ink #221d16. System fonts, no libraries. Header: H1 "Issue triage", a muted "Needs a decision" and a right aligned counter "Untriaged" with a big number that counts down 9, 8, 7, 6 (CSS @property integer animation with steps). Five absolutely positioned white cards (90px tall, 16px radius, soft shadow), each with a coloured priority dot, bold title, meta line (issue number, opener, age) and pills on the right (P1 red, P2 amber, P3 blue, Bug purple, Feature/Docs blue): Checkout fails on Safari 17, Add CSV export to reports, Duplicate of #1990 - login loop, Docs typo on pricing page, Dark mode flicker on load. Motion (8 second loop): cards rise in. Card 1 gets a green ASSIGNED tag, slides 28px right then 90px and fades; cards below move up one slot. Card 3 gets a red CLOSED - DUPLICATE tag and leaves the same way. Counter steps down in sync. Reset at the end. Respect prefers-reduced-motion. Return only the complete HTML. ``` ### 2. Check the assign move The first card should get a green tag and slide away. ### 3. Check the duplicate The duplicate card should get a red tag and leave. **Done when:** You can see it working in the browser. ### 4. Make it real Replace sample issues with your tracker data. ## Assets ### prompt.md — The full prompt. ~~~~ # Issue triage inbox Copy this prompt into Claude, Cursor or Lovable. ```text Make a single-file HTML issue triage inbox, 1280x720, warm cream background #f6f3ee, ink #221d16. System fonts, no libraries. Header: H1 "Issue triage", a muted "Needs a decision" and a right aligned counter "Untriaged" with a big number that counts down 9, 8, 7, 6 (CSS @property integer animation with steps). Five absolutely positioned white cards (90px tall, 16px radius, soft shadow), each with a coloured priority dot, bold title, meta line (issue number, opener, age) and pills on the right (P1 red, P2 amber, P3 blue, Bug purple, Feature/Docs blue): Checkout fails on Safari 17, Add CSV export to reports, Duplicate of #1990 - login loop, Docs typo on pricing page, Dark mode flicker on load. Motion (8 second loop): cards rise in. Card 1 gets a green ASSIGNED tag, slides 28px right then 90px and fades; cards below move up one slot. Card 3 gets a red CLOSED - DUPLICATE tag and leaves the same way. Counter steps down in sync. Reset at the end. Respect prefers-reduced-motion. Return only the complete HTML. ``` ~~~~ ### index.html.md — Complete code of the result in the video. ~~~~ # index.html The finished result as one file. Save it as index.html and open it. ```html Issue triage inbox

Issue triage

Needs a decision

Untriaged

Checkout fails on Safari 17

#2041 - opened by Dana - 2 h ago

P1Bug

Add CSV export to reports

#2038 - opened by Marco - 5 h ago

P3Feature

Duplicate of #1990 - login loop

#2036 - opened by Lena - 1 d ago

P2Bug

Docs typo on pricing page

#2033 - opened by Tom - 1 d ago

P3Docs

Dark mode flicker on load

#2031 - opened by Priya - 2 d ago

P2Bug

ASSIGNED

CLOSED - DUPLICATE

Swipe-style triage: assign, label or close each issue

``` ~~~~ ## Build instructions by tool ### Claude Code Open a terminal in an empty folder, run `claude`, then paste the prompt. ```text Build the "Issue triage inbox" app from the OwnlyPlans blueprint at https://ownlyplans.com/bhaskar/issue-triage-inbox/. Stack: CSS, Dashboard, HTML. Follow the plan's steps in order: Paste the prompt → Check the assign move → Check the duplicate → Make it real. Download the full plan (Markdown) from the link above and keep it in the project root as PLAN.md. Ask me before adding anything not in the plan. (Prepared for Claude Code.) ``` ### Cursor Open an empty folder in Cursor, start an Agent chat, then paste the prompt. ```text Build the "Issue triage inbox" app from the OwnlyPlans blueprint at https://ownlyplans.com/bhaskar/issue-triage-inbox/. Stack: CSS, Dashboard, HTML. Follow the plan's steps in order: Paste the prompt → Check the assign move → Check the duplicate → Make it real. Download the full plan (Markdown) from the link above and keep it in the project root as PLAN.md. Ask me before adding anything not in the plan. (Prepared for Cursor.) ``` ### Lovable Start a new Lovable project and paste the prompt as your first message. ```text Build the "Issue triage inbox" app from the OwnlyPlans blueprint at https://ownlyplans.com/bhaskar/issue-triage-inbox/. Stack: CSS, Dashboard, HTML. Follow the plan's steps in order: Paste the prompt → Check the assign move → Check the duplicate → Make it real. Download the full plan (Markdown) from the link above and keep it in the project root as PLAN.md. Ask me before adding anything not in the plan. (Prepared for Lovable.) ``` ## Definition of done - Every build step is complete and the app runs locally. - The main user flow works end to end. - Share your build on OwnlyPlans with a demo link, build time and tool.