Skip to content

Commit 20a916f

Browse files
BlenderDefenderBlenderDefender
committed
Rearrange Clone Panel
Move all parts of the clone panel to a (now larger) dropdown, that can be opened with a primary button called "Code".
1 parent 7a5af25 commit 20a916f

File tree

5 files changed

+81
-20
lines changed

5 files changed

+81
-20
lines changed

‎options/locale/locale_en-US.ini‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -868,6 +868,8 @@ already_forked = You've already forked %s
868868
fork_to_different_account = Fork to a different account
869869
fork_visibility_helper = The visibility of a forked repository cannot be changed.
870870
use_template = Use this template
871+
clone_https_description = Use Git or checkout with SVN using the web URL.
872+
clone_ssh_description = Use a password protected SSH key.
871873
clone_in_vsc = Clone in VS Code
872874
download_zip = Download ZIP
873875
download_tar = Download TAR.GZ
@@ -1030,7 +1032,6 @@ unstar = Unstar
10301032
star = Star
10311033
fork = Fork
10321034
download_archive = Download Repository
1033-
more_operations = More Operations
10341035

10351036
no_desc = No Description
10361037
quick_guide = Quick Guide

‎templates/repo/clone_panel.tmpl‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
<div class="menu gt-mt-3 clone dropdown">
2+
<div class="ui input">
3+
{{svg "octicon-terminal" 16}}
4+
<strong id="clone-heading" class="gt-ml-3">Clone</strong>
5+
</div>
6+
<div class="ui input gt-mb-0">
7+
<!-- there is always at least one button (by context/repo.go) -->
8+
{{if $.CloneButtonShowHTTPS}}
9+
<div class="ui clone tabs gt-no-transition" id="repo-clone-https" data-link="{{$.CloneButtonOriginLink.HTTPS}}" data-description="{{.locale.Tr "repo.clone_https_description"}}">
10+
{{if UseHTTPS}}HTTPS{{else}}HTTP{{end}}
11+
</div>
12+
{{end}}
13+
{{if $.CloneButtonShowSSH}}
14+
<div class="ui clone tabs gt-no-transition" id="repo-clone-ssh" data-link="{{$.CloneButtonOriginLink.SSH}}" data-description="{{.locale.Tr "repo.clone_ssh_description"}}">
15+
SSH
16+
</div>
17+
{{end}}
18+
</div>
19+
<div class="ui input tiny action gt-mt-4 gt-mb-0">
20+
<input id="repo-clone-url" size="20" class="js-clone-url" value="{{$.CloneButtonOriginLink.HTTPS}}" readonly>
21+
<div class="ui basic small compact icon button tooltip" id="clipboard-btn" data-content="{{.locale.Tr "copy_url"}}" data-clipboard-target="#repo-clone-url" aria-label="{{.locale.Tr "copy_url"}}">
22+
{{svg "octicon-copy" 14}}
23+
</div>
24+
</div>
25+
<div id="repo-clone-method-description" class="ui input text tiny grey gt-mt-3"></div>
26+
<div class="ui text input gt-my-3">{{.locale.Tr "repo.editor.or"}}</div>
27+
<a class="item js-clone-url-vsc" href="vscode://vscode.git/clone?url={{.CloneButtonOriginLink.HTTPS}}">{{svg "gitea-vscode" 16 "gt-mr-3"}}{{.locale.Tr "repo.clone_in_vsc"}}</a>
28+
29+
{{if not $.DisableDownloadSourceArchives}}
30+
<div class="ui divider"></div>
31+
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.zip" rel="nofollow">{{svg "octicon-file-zip" 16 "gt-mr-3"}}{{.locale.Tr "repo.download_zip"}}</a>
32+
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip" 16 "gt-mr-3"}}{{.locale.Tr "repo.download_tar"}}</a>
33+
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.bundle" rel="nofollow">{{svg "octicon-package" 16 "gt-mr-3"}}{{.locale.Tr "repo.download_bundle"}}</a>
34+
{{if .CitiationExist}}
35+
<a class="item" id="cite-repo-button">{{svg "octicon-cross-reference" 16 "gt-mr-3"}}{{.locale.Tr "repo.cite_this_repo"}}</a>
36+
{{end}}
37+
{{end}}
38+
</div>

‎templates/repo/clone_script.tmpl‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,16 @@
1010
const sshBtn = document.getElementById('repo-clone-ssh');
1111
const value = localStorage.getItem('repo-clone-protocol') || 'https';
1212
const isSSH = value === 'ssh' && sshBtn || value !== 'ssh' && !httpsBtn;
13+
const methodDesc = document.getElementById("repo-clone-method-description");
1314

1415
if (httpsBtn) httpsBtn.classList[!isSSH ? 'add' : 'remove']('primary');
1516
if (sshBtn) sshBtn.classList[isSSH ? 'add' : 'remove']('primary');
1617

1718
const btn = isSSH ? sshBtn : httpsBtn;
1819
if (!btn) return;
1920

21+
methodDesc.innerText = btn.dataset.description;
22+
2023
let link = btn.getAttribute('data-link');
2124
if (link.startsWith('http://') || link.startsWith('https://')) {
2225
// use current protocol/host as the clone link

‎templates/repo/home.tmpl‎

Lines changed: 6 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -116,20 +116,13 @@
116116
<!-- Only show clone panel in repository home page -->
117117
{{if eq $n 0}}
118118
<div class="ui action tiny input" id="clone-panel">
119-
{{template "repo/clone_buttons" .}}
120-
<button id="more-btn" class="ui basic small compact jump dropdown icon button tooltip" data-content="{{.locale.Tr "repo.more_operations"}}" data-position="top right">
121-
{{svg "octicon-kebab-horizontal"}}
122-
<div class="menu">
123-
{{if not $.DisableDownloadSourceArchives}}
124-
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.zip" rel="nofollow">{{svg "octicon-file-zip" 16 "gt-mr-3"}}{{.locale.Tr "repo.download_zip"}}</a>
125-
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.tar.gz" rel="nofollow">{{svg "octicon-file-zip" 16 "gt-mr-3"}}{{.locale.Tr "repo.download_tar"}}</a>
126-
<a class="item archive-link" href="{{$.RepoLink}}/archive/{{PathEscapeSegments $.RefName}}.bundle" rel="nofollow">{{svg "octicon-package" 16 "gt-mr-3"}}{{.locale.Tr "repo.download_bundle"}}</a>
127-
{{if .CitiationExist}}
128-
<a class="item" id="cite-repo-button">{{svg "octicon-cross-reference" 16 "gt-mr-3"}}{{.locale.Tr "repo.cite_this_repo"}}</a>
129-
{{end}}
130-
{{end}}
131-
<a class="item js-clone-url-vsc" href="vscode://vscode.git/clone?url={{.CloneButtonOriginLink.HTTPS}}">{{svg "gitea-vscode" 16 "gt-mr-3"}}{{.locale.Tr "repo.clone_in_vsc"}}</a>
119+
<button id="more-btn" class="ui basic small compact jump dropdown icon button primary" data-position="top right">
120+
<div>
121+
{{svg "octicon-code" 16}}
122+
<span>Code</span>
123+
{{svg "octicon-chevron-down"}}
132124
</div>
125+
{{template "repo/clone_panel" .}}
133126
</button>
134127
{{template "repo/clone_script" .}}{{/* the script will update `.js-clone-url` and related elements */}}
135128
</div>

‎web_src/less/_repository.less‎

Lines changed: 32 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -193,16 +193,42 @@
193193
border-right: none;
194194
}
195195

196-
#more-btn {
197-
border-left: none;
196+
#clone-heading {
197+
font-size: 1rem;
198198
}
199199

200-
button:first-of-type {
201-
border-radius: var(--border-radius) 0 0 var(--border-radius) !important;
200+
.clone.dropdown::before {
201+
content: "";
202+
203+
left: auto;
204+
right: 9px;
205+
top: -16px;
206+
207+
border: 8px solid #0000;
208+
border-bottom: 8px solid var(--color-shadow);
209+
210+
display: inline-block;
211+
position: absolute;
202212
}
203213

204-
button:last-of-type {
205-
border-radius: 0 var(--border-radius) var(--border-radius) 0 !important;
214+
.clone.tabs {
215+
cursor: pointer;
216+
217+
border-bottom: 3px solid;
218+
border-color: transparent;
219+
220+
font-weight: 600;
221+
font-size: 1rem;
222+
223+
padding: 0.5rem;
224+
}
225+
226+
.clone.tabs.primary {
227+
border-color: var(--color-primary);
228+
}
229+
230+
button {
231+
border-radius: var(--border-radius) !important;
206232
}
207233

208234
.dropdown .menu {

0 commit comments

Comments
 (0)