Skip to content

Fix circular spin animation direction #35785

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
Merged
merged 8 commits into from
Nov 2, 2025
Merged

Fix circular spin animation direction #35785

merged 8 commits into from
Nov 2, 2025
+12 −14

Conversation

@lutinglt
Copy link
Contributor

@lutinglt lutinglt commented Oct 30, 2025 •
edited
Loading

Wait for the status icon to rotate clockwise instead of counterclockwise

before:
GIF 2025-10-30 10-50-07

after:
GIF 2025-10-30 10-50-43

This can be merged to 1.25

@GiteaBot GiteaBot added the lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. label Oct 30, 2025
@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 Oct 30, 2025
@wxiaoguang
Copy link
Contributor

wxiaoguang commented Oct 30, 2025 •
edited
Loading

Please read and fix the comment

image

@wxiaoguang wxiaoguang marked this pull request as draft October 30, 2025 03:30
@github-actions github-actions bot added the modifies/templates This PR modifies the template files label Oct 30, 2025
@lutinglt
Copy link
Contributor Author

Please read and fix the comment

image

Now, we have our own icon that can rotate clockwise (
GIF 2025-10-30 12-26-28

@wxiaoguang wxiaoguang marked this pull request as ready for review October 30, 2025 04:37
@wxiaoguang
Copy link
Contributor

@silverwind what do you think about the new change? It looks good to me.

@lutinglt
Copy link
Contributor Author

@silverwind what do you think about the new change? It looks good to me.

I have a better idea. 'octicon sync' is a counterclockwise icon used to represent the state of rollback or rerun. If it is a rollback or rerun, we should use a counterclockwise icon and a counterclockwise rotation animation. If it is ongoing, first-time, or one-time execution, we should use a clockwise icon and a clockwise rotation animation. This can be a bit troublesome because I am not very clear about the specific purpose of some pages.

@wxiaoguang
Copy link
Contributor

Maybe no need to make it that complex. When it is a static icon, I guess few people would really look carefully at it to see whether it is clockwise or counterclockwise

@lutinglt
Copy link
Contributor Author

lutinglt commented Oct 30, 2025 •
edited
Loading

Maybe no need to make it that complex. When it is a static icon, I guess few people would really look carefully at it to see whether it is clockwise or counterclockwise

image image

Emmm, Maybe it's still quite obvious?

image image

@silverwind
Copy link
Member

silverwind commented Oct 30, 2025 •
edited
Loading

  1. Maybe we should just use the dot-in-circle icon in all cases where we had animate the other one, which would make it never spin, and therefor we would not need to have the flipped icon being animated.
  2. Can we rename the animation to rotate-clockwise?

@lutinglt lutinglt marked this pull request as draft October 30, 2025 08:07
@lutinglt
Copy link
Contributor Author

  1. Maybe we should just use the dot-in-circle icon in all cases where we had animate the other one, which would make it never spin, and therefor we would not need to have the flipped icon being animated.
  2. Can we rename the animation to rotate-clockwise?

I agree, but I can't see the specific page. It seems like there's no problem looking at the code? If possible, I will modify and submit it like this.

@silverwind
Copy link
Member

Should be safe to replace "blindly" if the icon size is the same.

@github-actions github-actions bot added modifies/templates This PR modifies the template files and removed modifies/templates This PR modifies the template files labels Oct 31, 2025
@lutinglt
Copy link
Contributor Author

The viewBox for octicon-sync and gitea-running is the same. I will replace the octicon-sync icon with gitea-running for the circular-pine animation and rename the circular-pine animation class name to rotate-clockwise

@lutinglt lutinglt marked this pull request as ready for review October 31, 2025 07:39
@lutinglt lutinglt requested a review from silverwind October 31, 2025 07:48
@GiteaBot GiteaBot added lgtm/need 2 This PR needs two approvals by maintainers to be considered for merging. and removed lgtm/need 1 This PR needs approval from one additional maintainer to be merged. labels Oct 31, 2025
@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 Oct 31, 2025
@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 Nov 2, 2025
@lunny lunny added the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Nov 2, 2025
@lunny lunny enabled auto-merge (squash) November 2, 2025 07:54
GiteaBot pushed a commit to GiteaBot/gitea that referenced this pull request Nov 2, 2025
@lutinglt @wxiaoguang @GiteaBot
Fix circular spin animation direction (go-gitea#35785)
c5ed7e1 
Wait for the status icon to rotate clockwise instead of counterclockwise

before:
![GIF 2025-10-30
10-50-07](https://github.com/user-attachments/assets/3771b0bf-44e4-45a0-bde5-1b2b3dd8ba2a)

after:
![GIF 2025-10-30
10-50-43](https://github.com/user-attachments/assets/c45307fe-39a4-4e60-b48e-9d922c407565)

---------

Signed-off-by: 鲁汀 <131967983+lutinglt@users.noreply.github.com>
Signed-off-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: lutinglt <lutinglt@users.noreply.github.com>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
@GiteaBot GiteaBot mentioned this pull request Nov 2, 2025
Merged
@GiteaBot GiteaBot added the backport/done All backports for this PR have been created label Nov 2, 2025
@lunny lunny merged commit f2d7931 into go-gitea:main Nov 2, 2025
26 checks passed
@GiteaBot GiteaBot added this to the 1.26.0 milestone Nov 2, 2025
@GiteaBot GiteaBot removed the reviewed/wait-merge This pull request is part of the merge queue. It will be merged soon. label Nov 2, 2025
zjjhot added a commit to zjjhot/gitea that referenced this pull request Nov 3, 2025
@zjjhot
Merge remote-tracking branch 'giteaofficial/main'
df5ab5b 
* giteaofficial/main:
  Add cache to container build (go-gitea#35697)
  Revert gomail to v0.7.0 to fix sending mail failed (go-gitea#35816)
  Fix circular spin animation direction (go-gitea#35785)
  Fix clone mixed bug (go-gitea#35810)
  [skip ci] Updated translations via Crowdin
  Remove unnecessary function parameter (go-gitea#35765)
  Fix cli "Before" handling (go-gitea#35797)
  Add test for ExtendCommentTreePathLength migration and fix bugs (go-gitea#35791)
  Fix file extension on gogs.png (go-gitea#35793)
  Improve and fix markup code preview rendering (go-gitea#35777)
silverwind pushed a commit that referenced this pull request Nov 3, 2025
@GiteaBot @lutinglt @wxiaoguang
Fix circular spin animation direction (#35785) (#35823)
74dfadb 
Backport #35785 by @lutinglt

Wait for the status icon to rotate clockwise instead of counterclockwise

before:
![GIF 2025-10-30
10-50-07](https://github.com/user-attachments/assets/3771b0bf-44e4-45a0-bde5-1b2b3dd8ba2a)

after:
![GIF 2025-10-30
10-50-43](https://github.com/user-attachments/assets/c45307fe-39a4-4e60-b48e-9d922c407565)

This can be merged to 1.25

Signed-off-by: 鲁汀 <131967983+lutinglt@users.noreply.github.com>
Signed-off-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: 鲁汀 <131967983+lutinglt@users.noreply.github.com>
Co-authored-by: lutinglt <lutinglt@users.noreply.github.com>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@lunny lunny lunny approved these changes

@silverwind silverwind silverwind approved these changes

Assignees

No one assigned

Labels

backport/done All backports for this PR have been created backport/v1.25 lgtm/done This PR has enough approvals to get merged. There are no important open reservations anymore. modifies/frontend modifies/templates This PR modifies the template files

Projects

None yet

Milestone

1.26.0

Development

Successfully merging this pull request may close these issues.

5 participants

@lutinglt @wxiaoguang @silverwind @lunny @GiteaBot