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

Improve repo button row layout #30668

Merged
merged 5 commits into from May 2, 2024
Merged

Improve repo button row layout #30668

merged 5 commits into from May 2, 2024

Conversation

silverwind
Copy link
Member

@silverwind silverwind commented Apr 23, 2024 •
edited

Since there is now a second <input> in the repo buttons, we can make a better-looking layout with no empty space, except on mobile.

Also I fixed one bug with focus border on clone panel.

Large

Screenshot 2024-04-23 at 22 25 22

Medium

Screenshot 2024-04-23 at 22 25 34

Mobile

Screenshot 2024-04-23 at 22 25 52

@GiteaBot GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Apr 23, 2024
@pull-request-size pull-request-size bot added the size/M Denotes a PR that changes 30-99 lines, ignoring generated files. label Apr 23, 2024
@github-actions github-actions bot added the modifies/templates This PR modifies the template files label Apr 23, 2024
@silverwind silverwind changed the title Repo button row tweaks Improve repo button row layout Apr 23, 2024
@delvh
Copy link
Member

delvh commented Apr 23, 2024

To me at least, it looks like we should switch the button bars around…
Don't know how others see it.

@silverwind
Copy link
Member Author

PS: I tried to stretch the branch button on mobile, but it's a major pain to do so, so I'm skipping that for now.

To me at least, it looks like we should switch the button bars around…

You mean swap? What exactly?

@silverwind

This comment was marked as outdated.

Sign in to view
@delvh
Copy link
Member

delvh commented Apr 23, 2024

You mean swap? What exactly?

grafik

Effectively the whole horizontal bar of arrow 1 with the one of arrow 2

@silverwind
Copy link
Member Author

You mean swap? What exactly?

grafik

Effectively the whole horizontal bar of arrow 1 with the one of arrow 2

Hmm I still don't get it. Maybe sketch it up.

@lunny
Copy link
Member

lunny commented Apr 24, 2024

I think #27931 will move the clone address bar to the right. So then it will have no problem here.

@silverwind
Copy link
Member Author

What's the problem here? It looks almost the same as before on desktop, and in wraps nicer when screen gets smaller now.

@wxiaoguang
Copy link
Contributor

Missed this one. I just proposed Fix code search input for different views #30678 , maybe the work could be done together.

The "repo bar" UI is really complex, various "if" blocks for different pages.

@silverwind
Copy link
Member Author

Your fix will likely require some changes here, but I don't see why it couldn't be made to work.

@silverwind
Copy link
Member Author

silverwind commented Apr 24, 2024 •
edited

The "repo bar" UI is really complex, various "if" blocks for different pages.

Yes, the problem with this template is that it's actually "too shared" (a rare problem in Gitea). Imho, we should have separate templates for repo homepage, subfolder, wiki, empty repo.

@lunny
Copy link
Member

lunny commented Apr 26, 2024

Please resolve the conflicts.

@silverwind silverwind marked this pull request as draft April 26, 2024 19:27
@silverwind
Copy link
Member Author

Will revisit soon now that #30678 is in. Imho this is important enough to go into 1.22.

@silverwind silverwind added the backport/v1.22 This PR should be backported to Gitea 1.22 label Apr 29, 2024
@silverwind
Merge remote-tracking branch 'origin/main' into btnrow
3ec0b96 
* origin/main: (55 commits)
  Fix dashboard commit status null access (go-gitea#30771)
  Fix tautological conditions (go-gitea#30735)
  Get repo assignees and reviewers should ignore deactivated users (go-gitea#30770)
  Right align the "Settings" menu item in overflow-menu (go-gitea#30764)
  Fix duplicate status check contexts (go-gitea#30660)
  Fix issue label rendering in the issue popup (go-gitea#30763)
  Fix all rounded borders, change affected tab menus to pills (go-gitea#30707)
  Rename CodeIndexerEnabled to IsRepoIndexerEnabled (go-gitea#30762)
  Remove fomantic dimmer module (go-gitea#30723)
  Resolve lint for unused parameter and unnecessary type arguments (go-gitea#30750)
  Add support for npm bundleDependencies (go-gitea#30751)
  Fix cross-compilation errors when CGO_CFLAGS/CGO_LDFLAGS is set (go-gitea#30749)
  [skip ci] Updated licenses and gitignores
  add built js files to eslint ignore (go-gitea#30737)
  Gitea with first upper case + typos (go-gitea#30739)
  Fix documentation build problems because of MDX syntax conflicts (go-gitea#30744)
  Remove disk-clean workflow (go-gitea#30741)
  Bump `github.com/google/go-github` to v61 (go-gitea#30738)
  Fix nil dereference on error (go-gitea#30740)
  Use `ProtonMail/go-crypto` for `opengpg` in tests (go-gitea#30736)
  ...
@silverwind silverwind marked this pull request as ready for review April 30, 2024 14:31
@silverwind
Copy link
Member Author

Conflict fixed. Rendering still looks like in the original screenshots above.

@silverwind
Copy link
Member Author

I see one issue in subdirectory view with alignment of the history button, will fix:

image

@silverwind
Copy link
Member Author

Fixed and moved styles to css:

image Screenshot 2024-04-30 at 16 36 33

@GiteaBot GiteaBot added lgtm/need 1 This PR needs approval from one additional maintainer to be merged. and removed lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. labels May 2, 2024
@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 May 2, 2024
@silverwind silverwind added the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label May 2, 2024
@silverwind silverwind enabled auto-merge (squash) May 2, 2024 18:40
@silverwind silverwind merged commit c445a85 into go-gitea:main May 2, 2024
26 checks passed
@GiteaBot GiteaBot added this to the 1.23.0 milestone May 2, 2024
@GiteaBot GiteaBot removed the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label May 2, 2024
GiteaBot pushed a commit to GiteaBot/gitea that referenced this pull request May 2, 2024
@silverwind @GiteaBot
Improve repo button row layout (go-gitea#30668)
84111c6 
Since there is now a second `<input>` in the repo buttons, we can make a
better-looking layout with no empty space, except on mobile.

Also I fixed one bug with focus border on clone panel.

## Large

<img width="1163" alt="Screenshot 2024-04-23 at 22 25 22"
src="https://github.com/go-gitea/gitea/assets/115237/8135a572-aa67-4672-ad49-b76b06890b52">

## Medium
<img width="870" alt="Screenshot 2024-04-23 at 22 25 34"
src="https://github.com/go-gitea/gitea/assets/115237/9e93f61c-3315-4a78-8328-8cefad5b50fa">

## Mobile
<img width="416" alt="Screenshot 2024-04-23 at 22 25 52"
src="https://github.com/go-gitea/gitea/assets/115237/859e341f-807a-48e6-8bcf-31715963216c">
@GiteaBot GiteaBot mentioned this pull request May 2, 2024
Merged
@GiteaBot GiteaBot added the backport/done All backports for this PR have been created label May 2, 2024
silverwind added a commit that referenced this pull request May 2, 2024
@GiteaBot @silverwind
Improve repo button row layout (#30668) (#30839)
41f8ef8 
Backport #30668 by @silverwind

Since there is now a second `<input>` in the repo buttons, we can make a
better-looking layout with no empty space, except on mobile.

Also I fixed one bug with focus border on clone panel.

## Large

<img width="1163" alt="Screenshot 2024-04-23 at 22 25 22"
src="https://github.com/go-gitea/gitea/assets/115237/8135a572-aa67-4672-ad49-b76b06890b52">

## Medium
<img width="870" alt="Screenshot 2024-04-23 at 22 25 34"
src="https://github.com/go-gitea/gitea/assets/115237/9e93f61c-3315-4a78-8328-8cefad5b50fa">

## Mobile
<img width="416" alt="Screenshot 2024-04-23 at 22 25 52"
src="https://github.com/go-gitea/gitea/assets/115237/859e341f-807a-48e6-8bcf-31715963216c">

Co-authored-by: silverwind <me@silverwind.io>
zjjhot added a commit to zjjhot/gitea that referenced this pull request May 3, 2024
@zjjhot
Merge remote-tracking branch 'giteaofficial/main'
6e5359c 
* giteaofficial/main: (30 commits)
  Improve grep search (go-gitea#30843)
  Don't only list code-enabled repositories when using repository API (go-gitea#30817)
  Fix no edit history after editing issue's title and content (go-gitea#30814)
  Ignore useless error message "broken pipe" (go-gitea#30801)
  Fix JS error on pull request page (go-gitea#30838)
  Fix body margin shifting with modals, fix error on project column edit (go-gitea#30831)
  Improve repo button row layout (go-gitea#30668)
  refactor: merge ListActionTasks func to action.go file (go-gitea#30811)
  Prevent automatic OAuth grants for public clients (go-gitea#30790)
  Catch and handle unallowed file type errors in issue attachment API (go-gitea#30791)
  Fix incorrect message id for releaes email (go-gitea#30825)
  Add hover outline to heatmap squares (go-gitea#30828)
  Remove external API calls in `TestPassword` (go-gitea#30716)
  Upgrade chi-binding (go-gitea#30826)
  Improve context popup rendering (go-gitea#30824)
  Fix activity heat map padding & locale (go-gitea#30823)
  Fix issue card layout (go-gitea#30800)
  Fix branch selector UI (go-gitea#30803)
  Fix rounded border for segment followed by pagination (go-gitea#30809)
  Skip gzip for some well-known compressed file types (go-gitea#30796)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@techknowlogick techknowlogick techknowlogick approved these changes

@delvh delvh delvh approved these changes

Assignees
No one assigned
Labels
backport/done All backports for this PR have been created backport/v1.22 This PR should be backported to Gitea 1.22 lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. modifies/templates This PR modifies the template files size/M Denotes a PR that changes 30-99 lines, ignoring generated files.
Projects
None yet
Milestone
1.23.0
Development

Successfully merging this pull request may close these issues.

None yet
6 participants
@silverwind @delvh @lunny @wxiaoguang @techknowlogick @GiteaBot