Improve PR diff view on mobile (#27883)

1. Show diff stats only on large screens

these are already shown in tabs, so no need for this duplicate
information on small screens


![image](1287839d-7490-42eb-a17e-d526dc0bfd9e)

![image](e9dcd89d-ed4d-4945-a7aa-4e6fc6d9c3a2)


2. Hide viewed files information on small screens

Github does the same and this gives us more free space on small screens


![image](e90b042f-fffb-4f79-a5ae-cd480c9d8334)

![image](d2480ffe-58f2-4694-8ae1-a2ab0aae14d4)


3. Review bar now doesn't wrap so we don't need the 77px even on very
small screens

(the sticky headers are still working)


![image](42b19b2b-73ef-4b88-8680-c555879b363b)
This commit is contained in:
sebastian-sauer 2023-11-16 04:58:53 +01:00 committed by GitHub
parent 79394b340d
commit 49dddd87b1
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 3 additions and 26 deletions

View file

@ -25,7 +25,7 @@
</div>
<div class="diff-detail-actions">
{{if and .PageIsPullFiles $.SignedUserID (not .IsArchived) (not .DiffNotAvailable)}}
<div class="gt-df gt-ac gt-fc gt-whitespace-nowrap gt-mr-2">
<div class="not-mobile gt-df gt-ac gt-fc gt-whitespace-nowrap gt-mr-2">
<label for="viewed-files-summary" id="viewed-files-summary-label" data-text-changed-template="{{ctx.Locale.Tr "repo.pulls.viewed_files_label"}}">
{{ctx.Locale.Tr "repo.pulls.viewed_files_label" .Diff.NumViewedFiles .Diff.NumFiles}}
</label>