jonastirona/ao5

UI: Polish layout for small mobile screens

Open

#5 opened on Dec 2, 2025

View on GitHubContributor guide
 (0 comments) (0 reactions) (0 assignees)TypeScript (0 forks)auto 404
good first issueui

Repository metrics

Stars
 (2 stars)
PR merge metrics
 (PR metrics pending)

Description

Description: On smaller devices (e.g., iPhone SE, older Androids), some UI elements feel cramped or misaligned.

File: apps/web/src/components

Task:

  • Check the Settings modal on mobile; ensure it scrolls correctly and doesn’t get cut off.
  • Adjust padding for the main timer display on screens narrower than 375px.
  • Ensure the "Session List" is easily tappable on mobile.

Contributor guide

Research direction
Inspect the components in apps/web/src/components, identify CSS issues on small screens, and apply responsive adjustments using media queries or flexbox/grid improvements.
Tech stack
typescriptreact
Domain
frontend
Issue type
Bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Fresh
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
CSSResponsive Design
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
75