Skip to content

Improve repo button row layout#30668

Merged
silverwind merged 5 commits into
go-gitea:mainfrom
silverwind:btnrow
May 2, 2024
Merged

Improve repo button row layout#30668
silverwind merged 5 commits into
go-gitea:mainfrom
silverwind:btnrow

Conversation

@silverwind
Copy link
Copy Markdown
Member

@silverwind silverwind commented Apr 23, 2024 •
edited
Loading

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
@silverwind silverwind changed the title Repo button row tweaks Improve repo button row layout Apr 23, 2024
@delvh
Copy link
Copy Markdown
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
Copy Markdown
Member Author

silverwind commented Apr 23, 2024

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
Copy Markdown
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
Copy Markdown
Member Author

silverwind commented Apr 24, 2024

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
Copy Markdown
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
Copy Markdown
Member Author

silverwind commented Apr 24, 2024

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
Copy Markdown
Contributor

wxiaoguang commented Apr 24, 2024

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
Copy Markdown
Member Author

silverwind commented Apr 24, 2024

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

@silverwind
Copy link
Copy Markdown
Member Author

silverwind commented Apr 24, 2024 •
edited
Loading

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
Copy Markdown
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
Copy Markdown
Member Author

silverwind commented Apr 29, 2024

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

@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
Copy Markdown
Member Author

silverwind commented Apr 30, 2024

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

@silverwind
Copy link
Copy Markdown
Member Author

silverwind commented Apr 30, 2024

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

image

@silverwind
Copy link
Copy Markdown
Member Author

silverwind commented Apr 30, 2024

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
@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)
  ...
@wxiaoguang wxiaoguang mentioned this pull request May 11, 2024
Closed
@wxiaoguang
Copy link
Copy Markdown
Contributor

wxiaoguang commented May 11, 2024

Regression: repo directory path styles #30940

@silverwind silverwind deleted the btnrow branch May 11, 2024 18:40
@go-gitea go-gitea locked as resolved and limited conversation to collaborators Aug 1, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

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 lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore.

Projects

None yet

Milestone

1.23.0

Development

Successfully merging this pull request may close these issues.

6 participants

@silverwind @delvh @lunny @wxiaoguang @techknowlogick @GiteaBot