[PATCH 0/5] fix broken mobile layouts across views
Rito Rhymes
rito at ritovision.com
Wed Feb 25 23:07:24 UTC 2026
This patch series fixes mobile responsiveness bugs that currently break
page layouts in cgit. The approach is adaptive rather than transformative:
it preserves the legacy desktop layout, adds targeted mobile constraints
at <=768px, and prevents content from escaping its containers and
breaking layout.
Rationale
Software development remains largely desktop-first, but contributors
increasingly browse history, read logs, review diffs, and share links
from mobile devices while away from a workstation. This patch series
improves day-to-day usability for contributors accessing cgit on small
screens, while preserving existing desktop behavior.
Before and After Mobile Screenshots
For convenience, a sequenced view of the before and after screenshots
can be seen at https://github.com/ritovision/cgit/pull/1
Index
Before:
https://github.com/user-attachments/assets/5a7c2936-d940-407d-a078-cebe845d1378
After (top, pre-scroll):
https://github.com/user-attachments/assets/b7cd488b-625c-4263-9291-52a1de70d9dd
After (top, post-scroll; content scrolled right):
https://github.com/user-attachments/assets/9956f880-1df1-4249-a496-f9812ea1f0d1
After (bottom):
https://github.com/user-attachments/assets/d940671d-a0ca-4512-b595-3a537436acc2
Summary
Before:
https://github.com/user-attachments/assets/87d1407d-2ad7-42dc-9f9a-d167e133f941
After (pre-scroll):
https://github.com/user-attachments/assets/c652d2ba-c2b8-4d62-bcb7-714c2b6807e3
After (post-scroll; tabs row and table content scrolled right):
https://github.com/user-attachments/assets/4339c0fc-c7f2-4aab-b676-32b5b0d15eb9
After (long repo name wraps):
https://github.com/user-attachments/assets/1bc9dfbc-7f9b-45cf-bbe3-6fc2633dbaf7
Commit (representative of similar code element views)
Before:
https://github.com/user-attachments/assets/aa8dd431-90ca-461a-afa5-00c398201c21
After (pre-scroll):
https://github.com/user-attachments/assets/b8850299-b9f0-414f-9b48-4ab4b0a58792
After (post-scroll):
https://github.com/user-attachments/assets/1c1a501f-fdbf-411b-891d-643af609e51a
Rito Rhymes (5):
ui-shared: add viewport tag for baseline mobile usability
css: contain horizontal page overflow to content blocks
css: make tabs row horizontally scrollable on mobile
css: reflow header table to prevent mobile overflow
css: wrap long unbroken repo names in mobile header
cgit.css | 109 ++++++++++++++++++++++++++++++++++++++++++++++++++++
ui-shared.c | 1 +
2 files changed, 110 insertions(+)
--
2.51.0
More information about the CGit
mailing list