ec708ba943
Complete companion repo for "Your First Hour with Claude Code" article. Includes step-by-step prompts, example output, troubleshooting, and cost guide. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
26 lines
847 B
Markdown
26 lines
847 B
Markdown
# Prompt 05: Make It Mobile-Friendly
|
|
|
|
Copy and paste this into Claude Code:
|
|
|
|
---
|
|
|
|
Make the todo app responsive and mobile-friendly. Requirements:
|
|
|
|
- Works well on phone screens (375px wide and up)
|
|
- Touch-friendly: buttons and inputs are at least 44px tall
|
|
- Category filters wrap to multiple lines on small screens
|
|
- Search bar is full width on mobile
|
|
- Task text does not overflow, long text wraps properly
|
|
- Add a proper viewport meta tag if missing
|
|
- Swipe-to-delete would be a bonus but not required
|
|
- Test: the app should look good on both a phone screen and a desktop monitor
|
|
- Keep all existing functionality working
|
|
|
|
---
|
|
|
|
## What to Expect
|
|
|
|
- Open `index.html` on your phone (or use browser dev tools to simulate a phone screen)
|
|
- Everything fits and is easy to tap
|
|
- No horizontal scrolling
|
|
- Filter buttons wrap neatly on small screens
|