Skip to content

Commit e6b1c1b

Browse files
Ryuno-Kiwxiaoguangtechknowlogick
authored andcommitted
Improve UX on modal for deleting an access token (go-gitea#19894)
* Improve UX on modal for deleting an access token Before, both action buttons where coloured on hover. Otherwise they appeared as ghost buttons. UX tells us, that call to action must not be displayed as ghost button. Using red is perceived as warning colour in Western cultures. It was used for the non-destructive action before. This PR swaps the colour and turns the cancel button into a filled one, so it is saver to do nothing then to accidentally delete an access button. We want the person to do this consciously. In another iteration the wording here could be improved. See the associated issue for further details. Signed-off-by: André Jaenisch <andre.jaenisch@posteo.de> * Use tabs instead of spaces. Linter does not complain anymore. I was expecting the formatter to pick this up but it didn't. Signed-off-by: André Jaenisch <andre.jaenisch@posteo.de> Co-authored-by: wxiaoguang <wxiaoguang@gmail.com> Co-authored-by: techknowlogick <techknowlogick@gitea.io>
1 parent 0a023d7 commit e6b1c1b

File tree

1 file changed

+9
-3
lines changed

1 file changed

+9
-3
lines changed

templates/user/settings/applications.tmpl

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
<div class="content">
2424
<strong>{{.Name}}</strong>
2525
<div class="activity meta">
26-
<i>{{$.i18n.Tr "settings.add_on"}} <span>{{.CreatedUnix.FormatShort}}</span> — {{svg "octicon-info"}} {{if .HasUsed}}{{$.i18n.Tr "settings.last_used"}} <span {{if .HasRecentActivity}}class="green"{{end}}>{{.UpdatedUnix.FormatShort}}</span>{{else}}{{$.i18n.Tr "settings.no_activity"}}{{end}}</i>
26+
<i>{{$.i18n.Tr "settings.add_on"}} <span>{{.CreatedUnix.FormatShort}}</span> — {{svg "octicon-info"}} {{if .HasUsed}}{{$.i18n.Tr "settings.last_used"}} <span {{if .HasRecentActivity}}class="green"{{end}}>{{.UpdatedUnix.FormatShort}}</span>{{else}}{{$.i18n.Tr "settings.no_activity"}}{{end}}</i>
2727
</div>
2828
</div>
2929
</div>
@@ -55,6 +55,12 @@
5555
</div>
5656

5757
<div class="ui small basic delete modal" id="delete-token">
58+
{{/*
59+
The wording here is a bit confusing.
60+
The action asks for deleting an access token.
61+
Confirming is therefore the destructive option and
62+
should be deemphasized because it cannot be undone.
63+
*/}}
5864
<div class="ui icon header">
5965
{{svg "octicon-trash"}}
6066
{{.i18n.Tr "settings.access_token_deletion"}}
@@ -63,11 +69,11 @@
6369
<p>{{.i18n.Tr "settings.access_token_deletion_desc"}}</p>
6470
</div>
6571
<div class="actions">
66-
<div class="ui red basic inverted cancel button">
72+
<div class="ui cancel button">
6773
<i class="remove icon"></i>
6874
{{.i18n.Tr "modal.no"}}
6975
</div>
70-
<div class="ui green basic inverted ok button">
76+
<div class="ui red basic inverted ok button">
7177
<i class="checkmark icon"></i>
7278
{{.i18n.Tr "modal.yes"}}
7379
</div>

0 commit comments

Comments
 (0)