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

Fix all rounded borders, change affected tab menus to pills #30707

Merged
merged 24 commits into from Apr 29, 2024
Merged

Fix all rounded borders, change affected tab menus to pills #30707

merged 24 commits into from Apr 29, 2024

Conversation

silverwind
Copy link
Member

@silverwind silverwind commented Apr 25, 2024 •
edited

Fixes #30673, all 23 issues. Notes:

  • Tab bar menus had to change to pills because of unsolvable issue with the border-radius as tab bar renders a overlapping border onto the box below. And I think pills look better.
  • Added padding to code editor empty preview message
  • Hide monaco's built-in blue focus border, we don't need it and it never showed before either.
  • Label add menu is simplified, removing the nested segment.
Screenshot 2024-04-25 at 22 26 19 Screenshot 2024-04-25 at 22 28 00 Screenshot 2024-04-25 at 22 36 53 Screenshot 2024-04-25 at 22 56 09 Screenshot 2024-04-25 at 22 57 12

@GiteaBot GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Apr 25, 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 25, 2024
@github-actions github-actions bot added modifies/go Pull requests that update Go code modifies/templates This PR modifies the template files modifies/js labels Apr 25, 2024
@silverwind silverwind changed the title Fix all rounded borders, re-style tab menus Fix all rounded borders, change affected tab menus to pills Apr 25, 2024
lunny
lunny reviewed Apr 26, 2024
View reviewed changes
routers/web/repo/editor.go Outdated Show resolved Hide resolved
@lunny
Copy link
Member

lunny commented Apr 26, 2024

editor tabs are broken

image

@lunny
Copy link
Member

lunny commented Apr 26, 2024

If there is no extra branches except main branch.

image

@lunny

This comment was marked as off-topic.

Sign in to view
@lunny
Copy link
Member

lunny commented Apr 26, 2024

admin panel -> repositories
image

@silverwind
Copy link
Member Author

editor tabs are broken
image

That's intentional, read comment.

@lunny
Copy link
Member

lunny commented Apr 26, 2024

admin panel -> system notices
image

@silverwind

This comment was marked as off-topic.

Sign in to view
@silverwind
Copy link
Member Author

admin panel -> system notices image

Cannot reproduce:

image

@silverwind
Copy link
Member Author

admin panel -> repositories image

Also does not reproduce:

image

@silverwind
Copy link
Member Author

silverwind commented Apr 26, 2024 •
edited

If there is no tags
image

Fixed in 839700b by not rendering anything. This is consistent with release list.

image

delvh
delvh approved these changes Apr 28, 2024
View reviewed changes
web_src/js/features/repo-editor.js Show resolved Hide resolved
@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 28, 2024
@delvh delvh added type/bug topic/ui Change the appearance of the Gitea UI reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. labels Apr 29, 2024
@silverwind silverwind enabled auto-merge (squash) April 29, 2024 20:37
@silverwind
Copy link
Member Author

Would backport as enhancement.

@silverwind silverwind added the backport/v1.22 This PR should be backported to Gitea 1.22 label Apr 29, 2024
@silverwind silverwind merged commit a3d9f0d into go-gitea:main Apr 29, 2024
26 checks passed
@GiteaBot GiteaBot added this to the 1.23.0 milestone Apr 29, 2024
GiteaBot added a commit to GiteaBot/gitea that referenced this pull request Apr 29, 2024
@silverwind @wxiaoguang @GiteaBot
Fix all rounded borders, change affected tab menus to pills (go-gitea…
693e20a 
…#30707)

Fixes go-gitea#30673, all 23 issues.
Notes:

- Tab bar menus had to change to pills because of unsolvable issue with
the border-radius as tab bar renders a overlapping border onto the box
below. And I think pills look better.
- Added padding to code editor empty preview message
- Hide monaco's built-in blue focus border, we don't need it and it
never showed before either.
- Label add menu is simplified, removing the nested segment.

<img width="1322" alt="Screenshot 2024-04-25 at 22 26 19"
src="https://github.com/go-gitea/gitea/assets/115237/7e394e0c-b7ad-417d-8e9f-12f1dea93ed1">
<img width="1326" alt="Screenshot 2024-04-25 at 22 28 00"
src="https://github.com/go-gitea/gitea/assets/115237/66c8499f-aa9f-4d95-8cca-ef13dfa82c65">
<img width="997" alt="Screenshot 2024-04-25 at 22 36 53"
src="https://github.com/go-gitea/gitea/assets/115237/07896102-c71d-4246-8173-c2bc2e1d3cae">
<img width="832" alt="Screenshot 2024-04-25 at 22 56 09"
src="https://github.com/go-gitea/gitea/assets/115237/d83afc96-08ca-4adc-baf4-3d02804be57c">
<img width="361" alt="Screenshot 2024-04-25 at 22 57 12"
src="https://github.com/go-gitea/gitea/assets/115237/c7371a68-00b5-47d8-84d0-ddc5268b2b2c">

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: Giteabot <teabot@gitea.io>
@GiteaBot GiteaBot removed the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Apr 29, 2024
@GiteaBot GiteaBot mentioned this pull request Apr 29, 2024
Merged
@GiteaBot GiteaBot added the backport/done All backports for this PR have been created label Apr 29, 2024
silverwind added a commit that referenced this pull request Apr 29, 2024
@GiteaBot @silverwind @wxiaoguang
Fix all rounded borders, change affected tab menus to pills (#30707) (#…
6c86034 
…30769)

Backport #30707 by @silverwind

Fixes #30673, all 23 issues.
Notes:

- Tab bar menus had to change to pills because of unsolvable issue with
the border-radius as tab bar renders a overlapping border onto the box
below. And I think pills look better.
- Added padding to code editor empty preview message
- Hide monaco's built-in blue focus border, we don't need it and it
never showed before either.
- Label add menu is simplified, removing the nested segment.

<img width="1322" alt="Screenshot 2024-04-25 at 22 26 19"
src="https://github.com/go-gitea/gitea/assets/115237/7e394e0c-b7ad-417d-8e9f-12f1dea93ed1">
<img width="1326" alt="Screenshot 2024-04-25 at 22 28 00"
src="https://github.com/go-gitea/gitea/assets/115237/66c8499f-aa9f-4d95-8cca-ef13dfa82c65">
<img width="997" alt="Screenshot 2024-04-25 at 22 36 53"
src="https://github.com/go-gitea/gitea/assets/115237/07896102-c71d-4246-8173-c2bc2e1d3cae">
<img width="832" alt="Screenshot 2024-04-25 at 22 56 09"
src="https://github.com/go-gitea/gitea/assets/115237/d83afc96-08ca-4adc-baf4-3d02804be57c">
<img width="361" alt="Screenshot 2024-04-25 at 22 57 12"
src="https://github.com/go-gitea/gitea/assets/115237/c7371a68-00b5-47d8-84d0-ddc5268b2b2c">

Co-authored-by: silverwind <me@silverwind.io>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
@wxiaoguang
Copy link
Contributor

The new UI looks a little strange.

IMO these "tab buttons" should attach to the main content. GitHub also attaches these 2 parts together by backgrounds.

image

image

zjjhot added a commit to zjjhot/gitea that referenced this pull request Apr 30, 2024
@zjjhot
Merge remote-tracking branch 'giteaofficial/main'
5c24a90 
* giteaofficial/main:
  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)
@silverwind silverwind deleted the round branch April 30, 2024 12:37
@silverwind
Copy link
Member Author

Yes, we should add a header to the editor to hold these buttons.

@silverwind silverwind mentioned this pull request Apr 30, 2024
Closed
23 tasks
silverwind added a commit to silverwind/gitea that referenced this pull request Apr 30, 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 mentioned this pull request May 13, 2024
Merged
jolheiser pushed a commit that referenced this pull request May 15, 2024
@silverwind
Put web editor into a segment (#30966)
ea8e4ba 
Implement
#30707 (comment)

Diff without whitespace:
https://github.com/go-gitea/gitea/pull/30966/files?diff=unified&w=1

Might as well backport.
GiteaBot pushed a commit to GiteaBot/gitea that referenced this pull request May 16, 2024
@silverwind @GiteaBot
Put web editor into a segment (go-gitea#30966)
dfa82bd 
Implement
go-gitea#30707 (comment)

Diff without whitespace:
https://github.com/go-gitea/gitea/pull/30966/files?diff=unified&w=1

Might as well backport.
@GiteaBot GiteaBot mentioned this pull request May 16, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@wxiaoguang wxiaoguang wxiaoguang left review comments

@lunny lunny lunny 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/go Pull requests that update Go code modifies/js modifies/templates This PR modifies the template files size/L Denotes a PR that changes 100-499 lines, ignoring generated files. topic/ui Change the appearance of the Gitea UI type/bug
Projects
None yet
Milestone
1.23.0
Development

Successfully merging this pull request may close these issues.

UI border-radius inconsistent problems
5 participants
@silverwind @lunny @wxiaoguang @delvh @GiteaBot