TemaDeveloper / TemaDeveloper/personal_planner
polish(notes): mobile responsiveness for editor, database views & template gallery
Open
Nobody has claimed this yet.
enhancement
polish
- Dominant language
- TypeScript
- Stars
- 2
- Forks
- 4
- PR merge metrics
- No merged PRs in 30d
Description
The Notes section was built desktop-first. On small screens several areas likely overflow or cramp:
- Database views (
src/components/notes/database/database-view.tsx): table has many columns; board/gallery use fixed-ish widths; the view-tab bar + filter/sort/search controls may wrap awkwardly. - Row peek panel (
row-peek.tsx):max-w-mdside panel — check it's usable full-width on mobile. - Template gallery modal (
template-gallery.tsx) and multi-column templates (3–5 columns) will be very narrow on phones — consider collapsingcolumnListto stacked on small screens.
Audit and add responsive breakpoints / horizontal scroll affordances where needed.
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by running the app and inspecting the Notes section at small viewport widths. Review src/components/notes/database/database-view.tsx, row-peek.tsx, and template-gallery.tsx, including the multi-column template layout, for overflow and cramped controls. Done means database views, the row peek panel, controls, and template gallery remain usable on mobile with appropriate scrolling or stacking.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nextjs, react, tailwindcss, typescript
- Domain
- design, frontend, web-dev
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 58/100