Skip to content

Commit 75c6205

Browse files
wxiaoguangsilverwind
wxiaoguang
and
silverwind
authored
Improve some modal action buttons (#24289)
Follow #24097 and #24285 And add a devtest page for modal action button testing. http://localhost:3000/devtest/fomantic-modal Now the `modal_actions_confirm.tmpl` could support: green / blue / yellow positive buttons, the negative button is "secondary". ps: this PR is only a small improvement, there are still a lot of buttons not having proper colors. In the future these buttons could be improved by this approach. These buttons could also be improved according to the conclusion of #24285 in the future. ![image](https://user-images.githubusercontent.com/2114189/233847773-a6d6b29b-7b5c-490e-8425-40dfd0ad2529.png) And add GitHub-like single danger button (context: #24285 (comment)) ![image](https://user-images.githubusercontent.com/2114189/233891566-055d7611-894d-4d5a-baf5-f6369180bf8d.png) --------- Co-authored-by: silverwind <me@silverwind.io>
1 parent 47748df commit 75c6205

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

58 files changed

+173
-129
lines changed

‎docs/content/doc/contributing/guidelines-frontend.en-us.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@ We recommend [Google HTML/CSS Style Guide](https://google.github.io/styleguide/h
4949
9. Avoid unnecessary `!important` in CSS, add comments to explain why it's necessary if it can't be avoided.
5050
10. Avoid mixing different events in one event listener, prefer to use individual event listeners for every event.
5151
11. Custom event names are recommended to use `ce-` prefix.
52+
12. Gitea's tailwind-style CSS classes use `gt-` prefix (`gt-relative`), while Gitea's own private framework-level CSS classes use `g-` prefix (`g-modal-confirm`).
5253

5354
### Accessibility / ARIA
5455

‎templates/admin/auth/edit.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -436,7 +436,7 @@
436436
</div>
437437
</div>
438438

439-
<div class="ui gitea-confirm-modal delete modal">
439+
<div class="ui g-modal-confirm delete modal">
440440
<div class="header">
441441
{{svg "octicon-trash"}}
442442
{{.locale.Tr "admin.auths.delete_auth_title"}}

‎templates/admin/emails/list.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@
7070

7171
{{template "base/paginate" .}}
7272

73-
<div class="ui gitea-confirm-modal modal" id="change-email-modal">
73+
<div class="ui g-modal-confirm modal" id="change-email-modal">
7474
<div class="header">
7575
{{.locale.Tr "admin.emails.change_email_header"}}
7676
</div>

‎templates/admin/monitor.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@
3434
{{template "admin/process" .}}
3535
</div>
3636

37-
<div class="ui gitea-confirm-modal delete modal">
37+
<div class="ui g-modal-confirm delete modal">
3838
<div class="header">
3939
{{.locale.Tr "admin.monitor.process.cancel"}}
4040
</div>

‎templates/admin/packages/list.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@
7676
{{template "base/paginate" .}}
7777
</div>
7878

79-
<div class="ui gitea-confirm-modal delete modal">
79+
<div class="ui g-modal-confirm delete modal">
8080
<div class="header">
8181
{{svg "octicon-trash"}}
8282
{{.locale.Tr "packages.settings.delete"}}

‎templates/admin/queue.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -178,7 +178,7 @@
178178
</div>
179179
</div>
180180

181-
<div class="ui gitea-confirm-modal delete modal">
181+
<div class="ui g-modal-confirm delete modal">
182182
<div class="header">
183183
{{.locale.Tr "admin.monitor.queue.pool.cancel"}}
184184
</div>

‎templates/admin/repo/list.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@
9191
{{template "base/paginate" .}}
9292
</div>
9393

94-
<div class="ui gitea-confirm-modal delete modal">
94+
<div class="ui g-modal-confirm delete modal">
9595
<div class="header">
9696
{{svg "octicon-trash"}}
9797
{{.locale.Tr "repo.settings.delete"}}

‎templates/admin/repo/unadopted.tmpl

Lines changed: 4 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@
2626
<span class="name">{{$dir}}</span>
2727
<div class="right floated content">
2828
<button class="ui button submit tiny green adopt show-modal" data-modal="#adopt-unadopted-modal-{{$dirI}}"><span class="icon">{{svg "octicon-plus"}}</span><span class="label">{{$.locale.Tr "repo.adopt_preexisting_label"}}</span></button>
29-
<div class="ui gitea-confirm-modal modal" id="adopt-unadopted-modal-{{$dirI}}">
29+
<div class="ui g-modal-confirm modal" id="adopt-unadopted-modal-{{$dirI}}">
3030
<div class="header">
3131
<span class="label">{{$.locale.Tr "repo.adopt_preexisting"}}</span>
3232
</div>
@@ -39,20 +39,11 @@
3939
<input type="hidden" name="action" value="adopt">
4040
<input type="hidden" name="q" value="{{$.Keyword}}">
4141
<input type="hidden" name="page" value="{{$.CurrentPage}}">
42-
<div class="actions">{{/* TODO: Convert to base/modal_actions_confirm */}}
43-
<button class="ui red basic inverted cancel button">
44-
{{svg "octicon-trash" 16 "gt-mr-2"}}
45-
{{$.locale.Tr "modal.no"}}
46-
</button>
47-
<button class="ui green basic inverted ok button">
48-
{{svg "octicon-check" 16 "gt-mr-2"}}
49-
{{$.locale.Tr "modal.yes"}}
50-
</button>
51-
</div>
42+
{{template "base/modal_actions_confirm" (dict "locale" $.locale)}}
5243
</form>
5344
</div>
5445
<button class="ui button submit tiny red delete show-modal" data-modal="#delete-unadopted-modal-{{$dirI}}"><span class="icon">{{svg "octicon-x"}}</span><span class="label">{{$.locale.Tr "repo.delete_preexisting_label"}}</span></button>
55-
<div class="ui gitea-confirm-modal modal" id="delete-unadopted-modal-{{$dirI}}">
46+
<div class="ui g-modal-confirm modal" id="delete-unadopted-modal-{{$dirI}}">
5647
<div class="header">
5748
<span class="label">{{$.locale.Tr "repo.delete_preexisting"}}</span>
5849
</div>
@@ -65,16 +56,7 @@
6556
<input type="hidden" name="action" value="delete">
6657
<input type="hidden" name="q" value="{{$.Keyword}}">
6758
<input type="hidden" name="page" value="{{$.CurrentPage}}">
68-
<div class="actions">{{/* TODO: Convert to base/modal_actions_confirm */}}
69-
<button class="ui red basic inverted cancel button">
70-
{{svg "octicon-trash" 16 "gt-mr-2"}}
71-
{{$.locale.Tr "modal.no"}}
72-
</button>
73-
<button class="ui green basic inverted ok button">
74-
{{svg "octicon-check" 16 "gt-mr-2"}}
75-
{{$.locale.Tr "modal.yes"}}
76-
</button>
77-
</div>
59+
{{template "base/modal_actions_confirm" (dict "locale" $.locale "ModalButtonColors" "yellow")}}
7860
</form>
7961
</div>
8062
</div>

‎templates/admin/stacktrace.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
</div>
1616
</div>
1717

18-
<div class="ui gitea-confirm-modal delete modal">
18+
<div class="ui g-modal-confirm delete modal">
1919
<div class="header">
2020
{{.locale.Tr "admin.monitor.process.cancel"}}
2121
</div>

‎templates/admin/user/edit.tmpl

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -192,7 +192,7 @@
192192
</div>
193193
</div>
194194

195-
<div class="ui gitea-confirm-modal delete modal" id="delete-user-modal">
195+
<div class="ui g-modal-confirm delete modal" id="delete-user-modal">
196196
<div class="header">
197197
{{svg "octicon-trash"}}
198198
{{.locale.Tr "settings.delete_account_title"}}

0 commit comments

Comments
 (0)