forked from
tangled.org/core
Monorepo for Tangled
1{{ define "repo/fragments/cloneDropdown" }}
2 {{ $knot := .RepoInfo.Knot }}
3 {{ if eq $knot "knot1.tangled.sh" }}
4 {{ $knot = "tangled.org" }}
5 {{ end }}
6
7 <button
8 popovertarget="clone-dropdown"
9 popovertargetaction="toggle"
10 class="btn-create cursor-pointer list-none flex items-center gap-2 px-4">
11 {{ i "download" "w-4 h-4" }}
12 <span class="hidden md:inline">code</span>
13 </button>
14 <div
15 popover
16 id="clone-dropdown"
17 class="
18 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-700
19 dark:text-white backdrop:bg-gray-400/50 dark:backdrop:bg-gray-800/50
20 w-96 md:w-[440px] p-4 rounded drop-shadow overflow-visible">
21
22 <input
23 type="checkbox"
24 id="permalink-toggle"
25 class="peer hidden m-0">
26
27 <div class="flex items-center justify-between">
28 <h3 class="text-sm font-semibold text-gray-900 dark:text-white">Clone this repository</h3>
29 <label for="permalink-toggle" class="flex items-center gap-1 text-xs text-gray-700 dark:text-gray-300 cursor-pointer normal-case font-normal">
30 {{ i "square-check-big" "checkbox-checked size-4" }}
31 {{ i "square" "checkbox-unchecked size-4" }}
32 <span>Use permalink</span>
33 </label>
34 </div>
35
36 {{ $repoOwnerHandle := resolve .RepoInfo.OwnerDid }}
37
38 {{ template "cloneUrlItem" (
39 dict
40 "Label" "HTTPS"
41 "HandleUrl" (printf "https://tangled.org/%s/%s" $repoOwnerHandle .RepoInfo.Name)
42 "PermaUrl" (printf "https://tangled.org/%s/%s" .RepoInfo.OwnerDid .RepoInfo.Name)
43 ) }}
44
45 {{ template "cloneUrlItem" (
46 dict
47 "Label" "SSH"
48 "HandleUrl" (printf "git@%s:%s/%s" (stripPort $knot) $repoOwnerHandle .RepoInfo.Name)
49 "PermaUrl" (printf "git@%s:%s/%s" (stripPort $knot) .RepoInfo.OwnerDid .RepoInfo.Name)
50 ) }}
51
52 <p class="text-xs text-gray-500 dark:text-gray-400 mt-2">
53 For self-hosted knots, clone URLs may differ based on your setup.
54 </p>
55
56 <a
57 href="/{{ .RepoInfo.FullName }}/archive/{{ .Ref | urlquery }}"
58 class="flex items-center btn-create w-full mt-4 gap-2 text-sm hover:no-underline hover:text-gray-100"
59 >
60 {{ i "download" "w-4 h-4" }}
61 Download tar.gz
62 </a>
63 </div>
64
65 <style>
66 .clone-url-did {
67 display: none;
68 }
69 .checkbox-checked {
70 display: none;
71 }
72 #permalink-toggle:checked ~ * .clone-url-handle {
73 display: none;
74 }
75 #permalink-toggle:checked ~ * .clone-url-did {
76 display: block;
77 }
78 #permalink-toggle:checked ~ * .checkbox-checked {
79 display: block;
80 }
81 #permalink-toggle:checked ~ * .checkbox-unchecked {
82 display: none;
83 }
84 </style>
85
86 <script>
87 function copyToClipboard(button, text) {
88 navigator.clipboard.writeText(text).then(() => {
89 const originalContent = button.innerHTML;
90 button.innerHTML = `{{ i "check" "w-4 h-4" }}`;
91 setTimeout(() => {
92 button.innerHTML = originalContent;
93 }, 2000);
94 });
95 }
96 </script>
97{{ end }}
98
99{{ define "cloneUrlItem" }}
100 <div class="mt-4">
101 <label class="block text-xs font-medium text-gray-700 dark:text-gray-300 mb-1 normal-case">{{ .Label }}</label>
102 <div class="flex items-stretch border border-gray-300 dark:border-gray-600 divide-x divide-gray-300 dark:divide-gray-600 rounded">
103 <span
104 class="clone-url-handle flex-1 px-3 py-2 text-sm text-gray-900 dark:text-gray-100 select-all cursor-pointer whitespace-nowrap overflow-x-auto font-mono bg-gray-200 dark:bg-gray-700"
105 onclick="window.getSelection().selectAllChildren(this)"
106 >{{ .HandleUrl }}</span>
107 <span
108 class="clone-url-did flex-1 px-3 py-2 text-sm text-gray-900 dark:text-gray-100 select-all cursor-pointer whitespace-nowrap overflow-x-auto font-mono bg-gray-200 dark:bg-gray-700"
109 onclick="window.getSelection().selectAllChildren(this)"
110 >{{ .PermaUrl }}</span>
111 <button
112 onclick="copyToClipboard(this, Array.from(this.parentElement.querySelectorAll('span')).find(s => getComputedStyle(s).display !== 'none').textContent)"
113 class="px-3 py-2 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200"
114 title="Copy to clipboard"
115 >
116 {{ i "copy" "w-4 h-4" }}
117 </button>
118 </div>
119 </div>
120{{ end }}
121