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.

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

Use horizontal tabs for repo header on mobile #19468

Merged
merged 3 commits into from
Apr 23, 2022

Conversation

Gusted
Copy link
Contributor

@Gusted Gusted commented Apr 22, 2022

  • The current behavior of the repo header on mobile is to display them vertically column-by-column. I've only experience annoyance due to this while trying to visit gitea instanced on mobile. This commit changes
    this behavior to use horizontal tabs, it uses less tabs and doesn't bloat 60% of your mobile screen with the repo headers.
  • A small fix added in this commit is to give some space around the repo buttons, current behavior is that they are too "close" to the repo title.

Before:

After:

- The current behavior of the repo header on mobile is to display them
vertically column-by-column. I've only experience annoyance due to this
while trying to visit gitea instanced on mobile. This commit changes
this behavior to use horizontal tabs, it uses less tabs and doesn't
bloat 60% of your mobile screen with the repo headers.
- A small fix added in this commit is to give some space around the repo
buttons, current behavior is that they are too "close" to the repo
title.
@Gusted Gusted added this to the 1.17.0 milestone Apr 22, 2022
@Gusted Gusted added type/enhancement An improvement of existing functionality topic/ui Change the appearance of the Gitea UI labels Apr 22, 2022
@GiteaBot GiteaBot added the lgtm/need 1 This PR needs approval from one additional maintainer to be merged. label Apr 23, 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 23, 2022
@6543 6543 merged commit 1f05417 into go-gitea:main Apr 23, 2022
@Gusted Gusted deleted the use-horizontal-bar branch April 23, 2022 16:57
@wULLSnpAXbWZGYDYyhWTKKspEQoaYxXyhoisqHf
Copy link
Contributor

this is absolutely brilliant, thanks for the fix! the old behaviour was bugging me as well..

zjjhot added a commit to zjjhot/gitea that referenced this pull request Apr 25, 2022
* giteaofficial/main:
  Simplify the code to get issue count (go-gitea#19380)
  use IsLoopback (go-gitea#19477)
  [skip ci] Updated translations via Crowdin
  Add RSS Feed buttons to Repo, User and Org pages (go-gitea#19370)
  [doctor] authorized-keys: fix displayed check name (go-gitea#19464)
  [skip ci] Updated translations via Crowdin
  Use horizontal tabs for repo header on mobile (go-gitea#19468)
Gusted pushed a commit to Gusted/gitea that referenced this pull request Apr 25, 2022
- While experimenting with using vertical tabs instead of horizontal
tabs on gitea for a better mobile experience, I made a recent
PR(go-gitea#19468) in order to see if
there was any objections to this new behavior for the repo headers(one
of the most annoying horizontal tabs). This PR had no objections and
even a user commenting that this change is brilliant.
- This PR now improves upon the previous PR by making this the de-facto
behavior for all menu's on mobile. The only exemption is the navbar
which also uses the menu but caught some layout errors with the changes.
techknowlogick pushed a commit that referenced this pull request Apr 26, 2022
* By default force vertical tabs on mobile

- While experimenting with using vertical tabs instead of horizontal
tabs on gitea for a better mobile experience, I made a recent
PR(#19468) in order to see if
there was any objections to this new behavior for the repo headers(one
of the most annoying horizontal tabs). This PR had no objections and
even a user commenting that this change is brilliant.
- This PR now improves upon the previous PR by making this the de-facto
behavior for all menu's on mobile. The only exemption is the navbar
which also uses the menu but caught some layout errors with the changes.

* Fix organisation

* Fix repo/wiki buttons

Co-authored-by: Lunny Xiao <[email protected]>
@Gusted Gusted mentioned this pull request Apr 29, 2022
AbdulrhmnGhanem pushed a commit to kitspace/gitea that referenced this pull request Aug 24, 2022
* Use horizontal tabs for repo header on mobile

- The current behavior of the repo header on mobile is to display them
vertically column-by-column. I've only experience annoyance due to this
while trying to visit gitea instanced on mobile. This commit changes
this behavior to use horizontal tabs, it uses less tabs and doesn't
bloat 60% of your mobile screen with the repo headers.
- A small fix added in this commit is to give some space around the repo
buttons, current behavior is that they are too "close" to the repo
title.

* Fix lint
AbdulrhmnGhanem pushed a commit to kitspace/gitea that referenced this pull request Aug 24, 2022
* By default force vertical tabs on mobile

- While experimenting with using vertical tabs instead of horizontal
tabs on gitea for a better mobile experience, I made a recent
PR(go-gitea#19468) in order to see if
there was any objections to this new behavior for the repo headers(one
of the most annoying horizontal tabs). This PR had no objections and
even a user commenting that this change is brilliant.
- This PR now improves upon the previous PR by making this the de-facto
behavior for all menu's on mobile. The only exemption is the navbar
which also uses the menu but caught some layout errors with the changes.

* Fix organisation

* Fix repo/wiki buttons

Co-authored-by: Lunny Xiao <[email protected]>
This was referenced Apr 24, 2023
@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.
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
Development

Successfully merging this pull request may close these issues.

5 participants