Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Make repository file list useable on mobile #19515

Merged
merged 11 commits into from
Apr 28, 2022
Merged

Make repository file list useable on mobile #19515

merged 11 commits into from
Apr 28, 2022

Conversation

Gusted
Copy link
Contributor

@Gusted Gusted commented Apr 26, 2022 •
edited
Loading

  • When you're browsing a repository on mobile, you're met by a giant block called the "repository file list". The current design is not useable for mobile and is a big annoyance while browsing a repo on
    mobile. This PR removes that annoyance by making it more suitable design when on mobile.
  • Adds HTML for the commit/file time to align it vertically(noticeable on mobile, not on PC).
  • Show all information horizontally and not vertically.
  • Remove the last commit message of the file, there isn't enough space on mobile to place this anywhere, so we're not trying to make a best-effort here and instead just not display it.

Before:

After:

Gusted added 2 commits April 26, 2022 22:36
Make repository file list useable on mobile
f8d71fd 
- When you're browsing a repository on mobile, you're met by a giant
block called the "repository file list". The current design is not
useable for mobile and is a big annoyance while browsing a repo on
mobile. This PR removes that annoyance by making it more suitable design
when on mobile.
- Adds HTML for the commit/file time to align it vertically(noticeable
on mobile, not on PC).
- Show all information horizontally and not vertically.
- Remove the last commit message of the file, there isn't enough space
on mobile to place this anywhere, so we're not trying to make a
best-effort here and instead just not display it.
Merge branch 'main' into better-repo-list
b23dadf
@Gusted Gusted added this to the 1.17.0 milestone Apr 26, 2022
@Gusted Gusted added type/enhancement An improvement of existing functionality topic/ui Change the appearance of the Gitea UI topic/mobile labels Apr 26, 2022
@GiteaBot GiteaBot added the lgtm/need 1 This PR needs approval from one additional maintainer to be merged. label Apr 26, 2022
@GiteaBot GiteaBot added lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. and removed lgtm/need 1 This PR needs approval from one additional maintainer to be merged. labels Apr 26, 2022
zeripath
zeripath reviewed Apr 26, 2022
View reviewed changes
Copy link
Contributor

@zeripath zeripath left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Generally we should avoid !important as much as possible especially in these base less files. Please check that they're really necessary and if there is a way we can get away without them.

delvh
delvh requested changes Apr 26, 2022
View reviewed changes
templates/repo/view_list.tmpl Outdated Show resolved Hide resolved
templates/repo/view_list.tmpl Outdated Show resolved Hide resolved
@Gusted
Copy link
Contributor Author

Gusted commented Apr 26, 2022

Only one can be removed, the display needs to stay, because blame fomantic:

gitea/web_src/fomantic/build/semantic.css

Line 38183 in cdab462

display: block !important;

@lunny
Copy link
Member

lunny commented Apr 27, 2022

Have you tried a long file name?

1 similar comment
@lunny
Copy link
Member

lunny commented Apr 27, 2022

Have you tried a long file name?

@Gusted
Copy link
Contributor Author

Gusted commented Apr 27, 2022

Have you tried a long file name?

image

Same behavior on desktop, it's truncated to ellipsis.

@6543
Copy link
Member

6543 commented Apr 28, 2022

,

@6543 6543 merged commit ca4b920 into go-gitea:main Apr 28, 2022
zjjhot added a commit to zjjhot/gitea that referenced this pull request Apr 28, 2022
@zjjhot
Merge remote-tracking branch 'giteaofficial/main'
509d619 
* giteaofficial/main: (21 commits)
  Prevent intermittent race in attribute reader close (go-gitea#19537)
  Make repository file list useable on mobile (go-gitea#19515)
  Update image URL for Discord webhook (go-gitea#19536)
  [skip ci] Updated translations via Crowdin
  Fix 64-bit atomic operations on 32-bit machines (go-gitea#19531)
  Fix `upgrade.sh` script error with `su -c` (go-gitea#19483)
  When view _Siderbar or _Footer, just display once (go-gitea#19501)
  Fix migrate release from github (go-gitea#19510)
  Prevent dangling archiver goroutine (go-gitea#19516)
  Don't let repo clone URL overflow (go-gitea#19517)
  Add commit status popup to issuelist (go-gitea#19375)
  Disable unnecessary GitHooks elements (go-gitea#18485)
  Disable unnecessary GitHooks elements
  Improve dashboard's repo list performance (go-gitea#18963)
  By default force vertical tabs on mobile (go-gitea#19486)
  Refactor readme file renderer (go-gitea#19502)
  Allow package dump skipping (go-gitea#19506)
  Unset git author/committer variables when running integration tests (go-gitea#19512)
  Allow commit status popup on /pulls page (go-gitea#19507)
  Use router param for filepath in GetRawFile (go-gitea#19499)
  ...
@Gusted Gusted mentioned this pull request Apr 29, 2022
Merged
@wxiaoguang wxiaoguang mentioned this pull request May 3, 2022
Closed
@Gusted Gusted deleted the better-repo-list branch May 4, 2022 07:33
AbdulrhmnGhanem pushed a commit to kitspace/gitea that referenced this pull request Aug 24, 2022
@AbdulrhmnGhanem
Make repository file list useable on mobile (go-gitea#19515)
2a953c7 
* Make repository file list useable on mobile

- When you're browsing a repository on mobile, you're met by a giant
block called the "repository file list". The current design is not
useable for mobile and is a big annoyance while browsing a repo on
mobile. This PR removes that annoyance by making it more suitable design
when on mobile.
- Adds HTML for the commit/file time to align it vertically(noticeable
on mobile, not on PC).
- Show all information horizontally and not vertically.
- Remove the last commit message of the file, there isn't enough space
on mobile to place this anywhere, so we're not trying to make a
best-effort here and instead just not display it.

* Remove unnecessary `!important`

* Fix broken HTML

* Simplify code
@go-gitea go-gitea locked and limited conversation to collaborators May 3, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@wxiaoguang wxiaoguang wxiaoguang left review comments

@zeripath zeripath zeripath approved these changes

@delvh delvh delvh approved these changes

@6543 6543 6543 approved these changes

Assignees
No one assigned
Labels
lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. topic/mobile topic/ui Change the appearance of the Gitea UI type/enhancement An improvement of existing functionality
Projects
None yet
Milestone
1.17.0
Development

Successfully merging this pull request may close these issues.
7 participants
@Gusted @lunny @6543 @zeripath @wxiaoguang @delvh @GiteaBot