diff options
author | Xinyu Zhou <i@sourcehut.net> | 2022-11-24 20:29:43 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-11-24 20:29:43 +0800 |
commit | 26f941fbdac73844a93c902ce6d1144175ff23ed (patch) | |
tree | 1b5f7948730c7d3239463dc3580bae1372287cd8 /templates | |
parent | b2269dedf20c1186b5348a659ef55c4d7ec69f44 (diff) | |
download | gitea-26f941fbdac73844a93c902ce6d1144175ff23ed.tar.gz gitea-26f941fbdac73844a93c902ce6d1144175ff23ed.zip |
Fix button in branch list, avoid unexpected page jump before restore branch actually done (#21562)
This patch:
- Use `<button>` replace anchor link `<a>` in **_Delete/Restore
Branch_** button to avoid unexpected page jump before restore branch
actually done.
- Also replace right side buttons with `<button>` in branch list, let
some screen readers know they are buttons.
## Before
click restore branch -> restore triggered -> page refreshed, but branch
status not update -> manually refresh page
<details>
https://user-images.githubusercontent.com/76462613/197389108-5a0bd259-0455-40b2-92ac-4326900276f8.mp4
</details>
## After
waiting restore done -> page refresh -> branch status update
<details>
https://user-images.githubusercontent.com/76462613/197428683-616fcbd2-70f9-4572-bf76-e0b7f77b6dd7.mp4
</details>
Signed-off-by: baronbunny <its@baronbunny.cn>
Co-authored-by: Lunny Xiao <xiaolunwen@gmail.com>
Co-authored-by: Lauris BH <lauris@nix.lv>
Diffstat (limited to 'templates')
-rw-r--r-- | templates/repo/branch/list.tmpl | 26 |
1 files changed, 15 insertions, 11 deletions
diff --git a/templates/repo/branch/list.tmpl b/templates/repo/branch/list.tmpl index 2e1878acc8..abce6591bd 100644 --- a/templates/repo/branch/list.tmpl +++ b/templates/repo/branch/list.tmpl @@ -22,18 +22,18 @@ </td> <td class="right aligned overflow-visible"> {{if and $.IsWriter (not $.Repository.IsArchived) (not .IsDeleted)}} - <div class="ui basic jump button icon tooltip show-create-branch-modal" data-content="{{$.locale.Tr "repo.branch.new_branch_from" ($.DefaultBranch)}}" data-branch-from="{{$.DefaultBranch}}" data-branch-from-urlcomponent="{{PathEscapeSegments $.DefaultBranch}}" data-modal="#create-branch-modal" data-position="top right"> + <button class="ui basic jump button icon tooltip show-create-branch-modal" data-content="{{$.locale.Tr "repo.branch.new_branch_from" ($.DefaultBranch)}}" data-branch-from="{{$.DefaultBranch}}" data-branch-from-urlcomponent="{{PathEscapeSegments $.DefaultBranch}}" data-modal="#create-branch-modal" data-position="top right"> {{svg "octicon-git-branch"}} - </div> + </button> {{end}} {{if not $.DisableDownloadSourceArchives}} - <div class="ui basic jump dropdown icon button tooltip" data-content="{{$.locale.Tr "repo.branch.download" ($.DefaultBranch)}}" data-position="top right"> + <button class="ui basic jump dropdown icon button tooltip" data-content="{{$.locale.Tr "repo.branch.download" ($.DefaultBranch)}}" data-position="top right"> {{svg "octicon-download"}} <div class="menu"> <a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.DefaultBranch}}.zip" rel="nofollow">{{svg "octicon-file-zip"}} ZIP</a> <a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.DefaultBranch}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip"}} TAR.GZ</a> </div> - </div> + </button> {{end}} </td> </tr> @@ -108,26 +108,30 @@ </td> <td class="three wide right aligned overflow-visible"> {{if and $.IsWriter (not $.Repository.IsArchived) (not .IsDeleted)}} - <div class="ui basic jump button icon tooltip show-create-branch-modal" data-branch-from="{{.Name}}" data-branch-from-urlcomponent="{{PathEscapeSegments .Name}}" data-content="{{$.locale.Tr "repo.branch.new_branch_from" .Name}}" data-position="top right" data-modal="#create-branch-modal" data-name="{{.Name}}"> + <button class="ui basic jump button icon tooltip show-create-branch-modal" data-branch-from="{{.Name}}" data-branch-from-urlcomponent="{{PathEscapeSegments .Name}}" data-content="{{$.locale.Tr "repo.branch.new_branch_from" .Name}}" data-position="top right" data-modal="#create-branch-modal" data-name="{{.Name}}"> {{svg "octicon-git-branch"}} - </div> + </button> {{end}} {{if and (not .IsDeleted) (not $.DisableDownloadSourceArchives)}} - <div class="ui basic jump dropdown icon button tooltip" data-content="{{$.locale.Tr "repo.branch.download" (.Name)}}" data-position="top right"> + <button class="ui basic jump dropdown icon button tooltip" data-content="{{$.locale.Tr "repo.branch.download" (.Name)}}" data-position="top right"> {{svg "octicon-download"}} <div class="menu"> <a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments .Name}}.zip" rel="nofollow">{{svg "octicon-file-zip"}} ZIP</a> <a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments .Name}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip"}} TAR.GZ</a> </div> - </div> + </button> {{end}} {{if and $.IsWriter (not $.IsMirror) (not $.Repository.IsArchived) (not .IsProtected)}} {{if .IsDeleted}} - <a class="ui basic jump button icon tooltip undo-button" href data-url="{{$.Link}}/restore?branch_id={{.DeletedBranch.ID}}&name={{.DeletedBranch.Name}}" data-content="{{$.locale.Tr "repo.branch.restore" (.Name)}}" data-position="top right"><span class="text blue">{{svg "octicon-reply"}}</span></a> + <button class="ui basic jump button icon tooltip undo-button" data-url="{{$.Link}}/restore?branch_id={{.DeletedBranch.ID}}&name={{.DeletedBranch.Name}}" data-content="{{$.locale.Tr "repo.branch.restore" (.Name)}}" data-position="top right"> + <span class="text blue"> + {{svg "octicon-reply"}} + </span> + </button> {{else}} - <a class="ui basic jump button icon tooltip delete-button delete-branch-button" href data-url="{{$.Link}}/delete?name={{.Name}}" data-content="{{$.locale.Tr "repo.branch.delete" (.Name)}}" data-position="top right" data-name="{{.Name}}"> + <button class="ui basic jump button icon tooltip delete-button delete-branch-button" data-url="{{$.Link}}/delete?name={{.Name}}" data-content="{{$.locale.Tr "repo.branch.delete" (.Name)}}" data-position="top right" data-name="{{.Name}}"> {{svg "octicon-trash"}} - </a> + </button> {{end}} {{end}} </td> |