(feat) Comprehensive Mobile Responsiveness Across All Pages #719

New Issue

2026-07-01T05:03:50Z

jmiller commented

2026-07-01 05:03:50 +00:00

Description

While MokoGitea works well on desktops, several views (such as the repository settings, pull request diffs, organization dashboards, and complex tables) are currently difficult to navigate or completely broken on smaller mobile screens.

To improve accessibility and the on-the-go developer experience, we should implement a fully responsive, mobile-first design pass across all core pages.

Key Areas for Improvement

PR & Commit Diffs: Code diffs currently require heavy horizontal scrolling. We need a unified mobile view (e.g., forcing a single-column/split-to-unified toggle for small screens).
Navigation & Header: The top navigation bar and repository sub-menus should gracefully collapse into a clean "hamburger" or bottom-nav menu on mobile viewports.
Tables & Lists: Issue lists, milestone tables, and release pages should stack vertically or hide non-essential columns (like labels/milestones) on screens narrower than 768px.
Settings Pages: Left-hand sidebar menus in Repository/User settings should move to a top-dropdown or collapsible drawer on mobile.

Proposed Solution / UX Suggestions

Adopt Mobile-First CSS Rules: Utilize standard media queries (or enhance the current UI breakpoints) to ensure layout shifting happens gracefully.
Touch-Friendly Targets: Ensure buttons, pagination links, and tab selectors have a minimum height/width of 44px for easy tapping.
Responsive Tables: Implement CSS data-attributes to turn wide tables into scannable card layouts on mobile.

Additional Context

Improving mobile views will significantly benefit maintainers who need to quickly review issues, triage bugs, or merge critical PRs while away from their desks.

# Description While MokoGitea works well on desktops, several views (such as the repository settings, pull request diffs, organization dashboards, and complex tables) are currently difficult to navigate or completely broken on smaller mobile screens. To improve accessibility and the on-the-go developer experience, we should implement a fully responsive, mobile-first design pass across all core pages. # Key Areas for Improvement * **PR & Commit Diffs:** Code diffs currently require heavy horizontal scrolling. We need a unified mobile view (e.g., forcing a single-column/split-to-unified toggle for small screens). * **Navigation & Header:** The top navigation bar and repository sub-menus should gracefully collapse into a clean "hamburger" or bottom-nav menu on mobile viewports. * **Tables & Lists:** Issue lists, milestone tables, and release pages should stack vertically or hide non-essential columns (like labels/milestones) on screens narrower than `768px`. * **Settings Pages:** Left-hand sidebar menus in Repository/User settings should move to a top-dropdown or collapsible drawer on mobile. # Proposed Solution / UX Suggestions 1. **Adopt Mobile-First CSS Rules:** Utilize standard media queries (or enhance the current UI breakpoints) to ensure layout shifting happens gracefully. 2. **Touch-Friendly Targets:** Ensure buttons, pagination links, and tab selectors have a minimum height/width of `44px` for easy tapping. 3. **Responsive Tables:** Implement CSS data-attributes to turn wide tables into scannable card layouts on mobile. # Additional Context Improving mobile views will significantly benefit maintainers who need to quickly review issues, triage bugs, or merge critical PRs while away from their desks.

jmiller commented

2026-07-01 05:03:58 +00:00

Branch created: feature/719-feature-comprehensive-mobile-responsiven

git fetch origin
git checkout feature/719-feature-comprehensive-mobile-responsiven

Branch created: [`feature/719-feature-comprehensive-mobile-responsiven`](https://git.mokoconsulting.tech/MokoConsulting/MokoGitea-Fork/src/branch/feature/719-feature-comprehensive-mobile-responsiven) ```bash git fetch origin git checkout feature/719-feature-comprehensive-mobile-responsiven ```

jmiller changed title from ~~[FEATURE] Comprehensive Mobile Responsiveness Across All Pages~~ to (feat) Comprehensive Mobile Responsiveness Across All Pages

2026-07-01 05:17:24 +00:00

jmiller referenced this issue

2026-07-12 20:13:06 +00:00

Epic: MokoGitea vNext — rebase to Gitea 1.26.4 (security backports) + feature roadmap #762

Sign in to join this conversation.

Priority Medium

Type Feature

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: MokoConsulting/MokoGIT#719