@matheusbsbs / matheus-bagliano / commits / fd10720357

gitweb: fix mobile page overflow across log/commit/blob/diff views

On mobile-sized viewports, gitweb pages in log/commit/blob/diff views can overflow horizontally due to desktop-oriented paddings and fixed-width preformatted content. Extend the existing mobile media query to rebalance those layouts: reduce or clear paddings in log/commit sections, and allow horizontal scrolling for preformatted blob/diff content instead of forcing page-wide overflow. All layout adjustments in this patch are mobile-scoped, except one global safeguard: set overflow-wrap:anywhere on div.log_body. Log content can contain escaped or non-breaking text that behaves like a single long token and can overflow at any viewport width, including desktop. Signed-off-by: Rito Rhymes <rito@ritovision.com> Signed-off-by: Junio C Hamano <gitster@pobox.com>

Rito Rhymes committed Feb 16, 2026 at 15:53 UTC fd10720357f01baa8a07ff6fa8e22de198424fd3
1 file changed +52
gitweb/static/gitweb.css
+52
@@ -123,6 +123,7 @@ div.title_text {
123
124 div.log_body {
125 padding: 8px 8px 8px 150px;
126 + overflow-wrap: anywhere;
127 }
128
129 span.age {
@@ -686,6 +687,15 @@ div.remote {
687 .kwd { color:#010181; }
688
689 @media (max-width: 768px) {
690 + div.page_body {
691 + overflow-x: auto;
692 + -webkit-overflow-scrolling: touch;
693 + }
694 +
695 + div.page_body div.pre {
696 + min-width: max-content;
697 + }
698 +
699 div.projsearch {
700 padding: 0 8px;
701 box-sizing: border-box;
@@ -695,4 +705,46 @@ div.remote {
705 max-width: 100%;
706 box-sizing: border-box;
707 }
708 +
709 + div.title_text {
710 + overflow-x: auto;
711 + -webkit-overflow-scrolling: touch;
712 + padding-left: 4px;
713 + padding-right: 4px;
714 + box-sizing: border-box;
715 + }
716 +
717 + div.title_text table.object_header {
718 + width: max-content;
719 + }
720 +
721 + div.log_body {
722 + padding: 8px;
723 + clear: left;
724 + }
725 +
726 + div.patchset div.patch {
727 + width: max-content;
728 + min-width: 100%;
729 + }
730 +
731 + div.diff.header {
732 + padding: 4px 8px 2px 8px;
733 + white-space: nowrap;
734 + overflow-wrap: normal;
735 + }
736 +
737 + div.diff.extended_header {
738 + padding: 2px 8px;
739 + white-space: nowrap;
740 + overflow-wrap: normal;
741 + }
742 +
743 + div.diff.ctx,
744 + div.diff.add,
745 + div.diff.rem,
746 + div.diff.chunk_header {
747 + padding: 0 8px;
748 + white-space: pre;
749 + }
750 }