Monorepo for Tangled
tangled.org
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.Slug)
42 "PermaUrl" (printf "https://tangled.org/%s" .RepoInfo.RepoDid)
43 ) }}
44
45 {{ template "cloneUrlItem" (
46 dict
47 "Label" "SSH"
48 "HandleUrl" (printf "git@%s:%s/%s" (stripPort $knot) $repoOwnerHandle .RepoInfo.Slug)
49 "PermaUrl" (printf "git@%s:%s" (stripPort $knot) .RepoInfo.RepoDid)
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 <br/>
57 <hr/>
58
59 <div class="flex gap-2 mt-4">
60 <a
61 href="/{{ .RepoInfo.FullName }}/archive/{{ .Ref | urlquery }}?format=tar.gz"
62 class="btn flex-1"
63 >
64 {{ i "download" "w-4 h-4" }}
65 Download tar.gz
66 </a>
67 <a
68 href="/{{ .RepoInfo.FullName }}/archive/{{ .Ref | urlquery }}?format=zip"
69 class="btn flex-1"
70 >
71 {{ i "download" "w-4 h-4" }}
72 Download .zip
73 </a>
74 </div>
75 </div>
76
77 <style>
78 .clone-url-did {
79 display: none;
80 }
81 .checkbox-checked {
82 display: none;
83 }
84 #permalink-toggle:checked ~ * .clone-url-handle {
85 display: none;
86 }
87 #permalink-toggle:checked ~ * .clone-url-did {
88 display: block;
89 }
90 #permalink-toggle:checked ~ * .checkbox-checked {
91 display: block;
92 }
93 #permalink-toggle:checked ~ * .checkbox-unchecked {
94 display: none;
95 }
96 </style>
97
98 <script>
99 function copyToClipboard(button, text) {
100 navigator.clipboard.writeText(text).then(() => {
101 const originalContent = button.innerHTML;
102 button.innerHTML = `{{ i "check" "w-4 h-4" }}`;
103 setTimeout(() => {
104 button.innerHTML = originalContent;
105 }, 2000);
106 });
107 }
108 </script>
109{{ end }}
110
111{{ define "cloneUrlItem" }}
112 <div class="mt-4">
113 <label class="block text-xs font-medium text-gray-700 dark:text-gray-300 mb-1 normal-case">{{ .Label }}</label>
114 <div class="flex items-stretch border border-gray-300 dark:border-gray-600 divide-x divide-gray-300 dark:divide-gray-600 rounded">
115 <span
116 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"
117 onclick="window.getSelection().selectAllChildren(this)"
118 >{{ .HandleUrl }}</span>
119 <span
120 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"
121 onclick="window.getSelection().selectAllChildren(this)"
122 >{{ .PermaUrl }}</span>
123 <button
124 onclick="copyToClipboard(this, Array.from(this.parentElement.querySelectorAll('span')).find(s => getComputedStyle(s).display !== 'none').textContent)"
125 class="px-3 py-2 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200"
126 title="Copy to clipboard"
127 >
128 {{ i "copy" "w-4 h-4" }}
129 </button>
130 </div>
131 </div>
132{{ end }}
133