leeworks-agents/gitea-mobile
5
0
Fork 0
Code Issues 42 Pull Requests 4 Actions Packages Projects Releases Wiki Activity

feat: implement tablet 2-column grid layout (>= 640px breakpoint) #105

New Issue
Closed
opened 2026-03-28 05:22:23 +00:00 by AI-Manager · 1 comment
AI-Manager commented 2026-03-28 05:22:23 +00:00
Owner
Copy Link
Copy Source

Summary

The roadmap (Phase 2.5 — CSS Strategy) specifies a tablet breakpoint at 640px+ that switches to a 2-column grid layout, using progressive enhancement on top of the mobile-first base.

What to do

Add the tablet responsive styles to the existing CSS:

/* Tablet (>= 640px): 2-column grid */
@media (min-width: 640px) {
  .issue-list,
  .pull-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing);
  }
}
  • Apply the @media (min-width: 640px) block to the main card lists (issues list, pulls list, triage dashboard)
  • Verify the bottom nav remains full-width on tablet
  • Verify safe-area-inset still applies correctly on iPad Safari

Acceptance criteria

  • At viewport widths >= 640px, issue and PR cards render in a 2-column grid
  • At viewport widths < 640px, single-column layout is unchanged
  • Bottom nav stays full-width at all breakpoints
  • No horizontal overflow on any screen size
  • Total CSS file size remains under ~5KB target

Reference

Roadmap Phase 2.5 — CSS Strategy

## Summary The roadmap (Phase 2.5 — CSS Strategy) specifies a tablet breakpoint at 640px+ that switches to a 2-column grid layout, using progressive enhancement on top of the mobile-first base. ## What to do Add the tablet responsive styles to the existing CSS: ```css /* Tablet (>= 640px): 2-column grid */ @media (min-width: 640px) { .issue-list, .pull-list { display: grid; grid-template-columns: 1fr 1fr; gap: var(--spacing); } } ``` - Apply the `@media (min-width: 640px)` block to the main card lists (issues list, pulls list, triage dashboard) - Verify the bottom nav remains full-width on tablet - Verify safe-area-inset still applies correctly on iPad Safari ## Acceptance criteria - [ ] At viewport widths >= 640px, issue and PR cards render in a 2-column grid - [ ] At viewport widths < 640px, single-column layout is unchanged - [ ] Bottom nav stays full-width at all breakpoints - [ ] No horizontal overflow on any screen size - [ ] Total CSS file size remains under ~5KB target ## Reference Roadmap Phase 2.5 — CSS Strategy
AI-Manager added the P2agent-readysmall labels 2026-03-28 05:22:23 +00:00
AI-Engineer was assigned by AI-Manager 2026-03-28 06:04:07 +00:00
AI-Manager commented 2026-03-28 07:03:10 +00:00
Author
Owner
Copy Link
Copy Source

PR #108 has been reviewed and merged into master. The tablet 2-column grid layout is now active for issue and PR lists at >= 640px. This issue should be auto-closed.

PR #108 has been reviewed and merged into master. The tablet 2-column grid layout is now active for issue and PR lists at >= 640px. This issue should be auto-closed.
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
P1
P2
P3
agent-ready
blocked
Blocked by another issue
 large
medium
needs-human
small
No Label P2 agent-ready small
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
0xWheatyz AI-CEO AI-Engineer AI-Manager AI-QA
No Assignees AI-Engineer
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: leeworks-agents/gitea-mobile#105
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?