diff --git a/templates/repo/settings/deploy_keys.tmpl b/templates/repo/settings/deploy_keys.tmpl
index 68ab36b593b3..019a62b5f12f 100644
--- a/templates/repo/settings/deploy_keys.tmpl
+++ b/templates/repo/settings/deploy_keys.tmpl
@@ -4,16 +4,18 @@
{{template "repo/settings/navbar" .}}
<div class="ui container">
{{template "base/alert" .}}
- <div {{if not .HasError}}class="hide"{{end}} id="add-deploy-key-panel">
- <h4 class="ui top attached header">
- {{.i18n.Tr "repo.settings.add_deploy_key"}}
- <div class="ui right">
- <button class="ui red tiny hide-panel button" data-panel="#add-deploy-key-panel">
- {{.i18n.Tr "cancel"}}
- </button>
- </div>
- </h4>
- <div class="ui attached segment">
+ <h4 class="ui top attached header">
+ {{.i18n.Tr "repo.settings.deploy_keys"}}
+ <div class="ui right">
+ {{if not .DisableSSH}}
+ <div class="ui blue tiny show-panel button" data-panel="#add-deploy-key-panel">{{.i18n.Tr "repo.settings.add_deploy_key"}}</div>
+ {{else}}
+ <div class="ui blue tiny button disabled">{{.i18n.Tr "settings.ssh_disabled"}}</div>
+ {{end}}
+ </div>
+ </h4>
+ <div class="ui attached segment">
+ <div class="{{if not .HasError}}hide{{end}} mb-4" id="add-deploy-key-panel">
<form class="ui form" action="{{.Link}}" method="post">
{{.CsrfTokenHtml}}
<div class="field">
@@ -39,21 +41,11 @@
<button class="ui green button">
{{.i18n.Tr "repo.settings.add_deploy_key"}}
</button>
+ <button class="ui hide-panel button" data-panel="#add-deploy-key-panel">
+ {{.i18n.Tr "cancel"}}
+ </button>
</form>
</div>
- <br>
- </div>
- <h4 class="ui top attached header">
- {{.i18n.Tr "repo.settings.deploy_keys"}}
- <div class="ui right">
- {{if not .DisableSSH}}
- <div class="ui blue tiny show-panel button" data-panel="#add-deploy-key-panel">{{.i18n.Tr "repo.settings.add_deploy_key"}}</div>
- {{else}}
- <div class="ui blue tiny button disabled">{{.i18n.Tr "settings.ssh_disabled"}}</div>
- {{end}}
- </div>
- </h4>
- <div class="ui attached segment">
{{if .Deploykeys}}
<div class="ui key list">
{{range .Deploykeys}}
diff --git a/templates/user/settings/keys_gpg.tmpl b/templates/user/settings/keys_gpg.tmpl
index c840801e5acb..20ccea9f0066 100644
--- a/templates/user/settings/keys_gpg.tmpl
+++ b/templates/user/settings/keys_gpg.tmpl
@@ -5,7 +5,41 @@
</div>
</h4>
<div class="ui attached segment">
- <div class="ui key list">
+ <div class="{{if not .HasGPGError}}hide{{end}} mb-4" id="add-gpg-key-panel">
+ <form class="ui form{{if .HasGPGError}} error{{end}}" action="{{.Link}}" method="post">
+ {{.CsrfTokenHtml}}
+ <input type="hidden" name="title" value="none">
+ <div class="field {{if .Err_Content}}error{{end}}">
+ <label for="content">{{.i18n.Tr "settings.key_content"}}</label>
+ <textarea id="gpg-key-content" name="content" placeholder="{{.i18n.Tr "settings.key_content_gpg_placeholder"}}" required>{{.content}}</textarea>
+ </div>
+ {{if .Err_Signature}}
+ <div class="ui error message">
+ <p>{{.i18n.Tr "settings.gpg_token_required"}}</p>
+ </div>
+ <div class="field">
+ <label for="token">{{.i18n.Tr "setting.gpg_token"}}
+ <input readonly="" value="{{.TokenToSign}}">
+ <div class="help">
+ <p>{{.i18n.Tr "settings.gpg_token_help"}}</p>
+ <p><code>{{$.i18n.Tr "settings.gpg_token_code" .TokenToSign .KeyID}}</code></p>
+ </div>
+ </div>
+ <div class="field">
+ <label for="signature">{{.i18n.Tr "settings.gpg_token_signature"}}</label>
+ <textarea id="gpg-key-signature" name="signature" placeholder="{{.i18n.Tr "settings.key_signature_gpg_placeholder"}}" required>{{.signature}}</textarea>
+ </div>
+ {{end}}
+ <input name="type" type="hidden" value="gpg">
+ <button class="ui green button">
+ {{.i18n.Tr "settings.add_key"}}
+ </button>
+ <button class="ui hide-panel button" data-panel="#add-gpg-key-panel">
+ {{.i18n.Tr "cancel"}}
+ </button>
+ </form>
+ </div>
+ <div class="ui key list mt-0">
<div class="item">
{{.i18n.Tr "settings.gpg_desc"}}
</div>
@@ -76,42 +110,6 @@
</div>
<br>
<p>{{.i18n.Tr "settings.gpg_helper" "https://docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/about-commit-signature-verification#gpg-commit-signature-verification" | Str2html}}</p>
-<div {{if not .HasGPGError}}class="hide"{{end}} id="add-gpg-key-panel">
- <h4 class="ui top attached header">
- {{.i18n.Tr "settings.add_new_gpg_key"}}
- </h4>
- <div class="ui attached segment">
- <form class="ui form{{if .HasGPGError}} error{{end}}" action="{{.Link}}" method="post">
- {{.CsrfTokenHtml}}
- <input type="hidden" name="title" value="none">
- <div class="field {{if .Err_Content}}error{{end}}">
- <label for="content">{{.i18n.Tr "settings.key_content"}}</label>
- <textarea id="gpg-key-content" name="content" placeholder="{{.i18n.Tr "settings.key_content_gpg_placeholder"}}" required>{{.content}}</textarea>
- </div>
- {{if .Err_Signature}}
- <div class="ui error message">
- <p>{{.i18n.Tr "settings.gpg_token_required"}}</p>
- </div>
- <div class="field">
- <label for="token">{{.i18n.Tr "setting.gpg_token"}}
- <input readonly="" value="{{.TokenToSign}}">
- <div class="help">
- <p>{{.i18n.Tr "settings.gpg_token_help"}}</p>
- <p><code>{{$.i18n.Tr "settings.gpg_token_code" .TokenToSign .KeyID}}</code></p>
- </div>
- </div>
- <div class="field">
- <label for="signature">{{.i18n.Tr "settings.gpg_token_signature"}}</label>
- <textarea id="gpg-key-signature" name="signature" placeholder="{{.i18n.Tr "settings.key_signature_gpg_placeholder"}}" required>{{.signature}}</textarea>
- </div>
- {{end}}
- <input name="type" type="hidden" value="gpg">
- <button class="ui green button">
- {{.i18n.Tr "settings.add_key"}}
- </button>
- </form>
- </div>
-</div>
<div class="ui small basic delete modal" id="delete-gpg">
<div class="ui icon header">
diff --git a/templates/user/settings/keys_ssh.tmpl b/templates/user/settings/keys_ssh.tmpl
index 3d05578666c3..b87318c789de 100644
--- a/templates/user/settings/keys_ssh.tmpl
+++ b/templates/user/settings/keys_ssh.tmpl
@@ -1,15 +1,37 @@
<h4 class="ui top attached header">
{{.i18n.Tr "settings.manage_ssh_keys"}}
<div class="ui right">
- {{if not .DisableSSH }}
- <div class="ui blue tiny show-panel button" data-panel="#add-ssh-key-panel">{{.i18n.Tr "settings.add_key"}}</div>
- {{else}}
- <div class="ui blue tiny button disabled">{{.i18n.Tr "settings.ssh_disabled"}}</div>
- {{end}}
+ {{if not .DisableSSH }}
+ <div id="add-ssh-button" class="ui blue tiny show-panel button" data-panel="#add-ssh-key-panel">
+ {{.i18n.Tr "settings.add_key"}}
+ </div>
+ {{else}}
+ <div class="ui blue tiny button disabled">{{.i18n.Tr "settings.ssh_disabled"}}</div>
+ {{end}}
</div>
</h4>
<div class="ui attached segment">
- <div class="ui key list">
+ <div class="{{if not .HasSSHError}}hide{{end}} mb-4" id="add-ssh-key-panel">
+ <form class="ui form" action="{{.Link}}" method="post">
+ {{.CsrfTokenHtml}}
+ <div class="field {{if .Err_Title}}error{{end}}">
+ <label for="title">{{.i18n.Tr "settings.key_name"}}</label>
+ <input id="ssh-key-title" name="title" value="{{.title}}" autofocus required>
+ </div>
+ <div class="field {{if .Err_Content}}error{{end}}">
+ <label for="content">{{.i18n.Tr "settings.key_content"}}</label>
+ <textarea id="ssh-key-content" name="content" placeholder="{{.i18n.Tr "settings.key_content_ssh_placeholder"}}" required>{{.content}}</textarea>
+ </div>
+ <input name="type" type="hidden" value="ssh">
+ <button class="ui green button">
+ {{.i18n.Tr "settings.add_key"}}
+ </button>
+ <button id="cancel-ssh-button" class="ui hide-panel button" data-panel="#add-ssh-key-panel">
+ {{.i18n.Tr "cancel"}}
+ </button>
+ </form>
+ </div>
+ <div class="ui key list mt-0">
<div class="item">
{{.i18n.Tr "settings.ssh_desc"}}
</div>
@@ -38,28 +60,6 @@
</div>
<br>
<p>{{.i18n.Tr "settings.ssh_helper" "https://docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/connecting-to-github-with-ssh" "https://docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/troubleshooting-ssh" | Str2html}}</p>
-<div {{if not .HasSSHError}}class="hide"{{end}} id="add-ssh-key-panel">
- <h4 class="ui top attached header">
- {{.i18n.Tr "settings.add_new_key"}}
- </h4>
- <div class="ui attached segment">
- <form class="ui form" action="{{.Link}}" method="post">
- {{.CsrfTokenHtml}}
- <div class="field {{if .Err_Title}}error{{end}}">
- <label for="title">{{.i18n.Tr "settings.key_name"}}</label>
- <input id="ssh-key-title" name="title" value="{{.title}}" autofocus required>
- </div>
- <div class="field {{if .Err_Content}}error{{end}}">
- <label for="content">{{.i18n.Tr "settings.key_content"}}</label>
- <textarea id="ssh-key-content" name="content" placeholder="{{.i18n.Tr "settings.key_content_ssh_placeholder"}}" required>{{.content}}</textarea>
- </div>
- <input name="type" type="hidden" value="ssh">
- <button class="ui green button">
- {{.i18n.Tr "settings.add_key"}}
- </button>
- </form>
- </div>
-</div>
<div class="ui small basic delete modal" id="delete-ssh">
<div class="ui icon header">
diff --git a/web_src/js/features/common-global.js b/web_src/js/features/common-global.js
index b345afd4cf76..04d44d8142ab 100644
--- a/web_src/js/features/common-global.js
+++ b/web_src/js/features/common-global.js
@@ -288,8 +288,9 @@ export function initGlobalButtons() {
$($(this).data('panel')).show();
});
- $('.hide-panel.button').on('click', function () {
+ $('.hide-panel.button').on('click', function (event) {
$($(this).data('panel')).hide();
+ event.preventDefault();
});
$('.show-modal.button').on('click', function () {