this repo has no description
tangled.org
1{{ define "repo/fragments/diff" }}
2{{ $repo := index . 0 }}
3{{ $diff := index . 1 }}
4{{ $opts := index . 2 }}
5
6{{ $commit := $diff.Commit }}
7{{ $diff := $diff.Diff }}
8{{ $isSplit := $opts.Split }}
9{{ $this := $commit.This }}
10{{ $parent := $commit.Parent }}
11
12 {{ $last := sub (len $diff) 1 }}
13 {{ range $idx, $hunk := $diff }}
14 {{ with $hunk }}
15 <section class="mt-4 border border-gray-200 dark:border-gray-700 w-full mx-auto rounded bg-white dark:bg-gray-800 drop-shadow-sm">
16 <div id="file-{{ .Name.New }}">
17 <div id="diff-file">
18 <details open>
19 <summary class="list-none cursor-pointer sticky top-0">
20 <div id="diff-file-header" class="rounded cursor-pointer bg-white dark:bg-gray-800 flex justify-between">
21 <div id="left-side-items" class="p-2 flex gap-2 items-center overflow-x-auto">
22 <div class="flex gap-1 items-center">
23 {{ $markerstyle := "diff-type p-1 mr-1 font-mono text-sm rounded select-none" }}
24 {{ if .IsNew }}
25 <span class="bg-green-100 text-green-700 dark:bg-green-800/50 dark:text-green-400 {{ $markerstyle }}">ADDED</span>
26 {{ else if .IsDelete }}
27 <span class="bg-red-100 text-red-700 dark:bg-red-800/50 dark:text-red-400 {{ $markerstyle }}">DELETED</span>
28 {{ else if .IsCopy }}
29 <span class="bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 {{ $markerstyle }}">COPIED</span>
30 {{ else if .IsRename }}
31 <span class="bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 {{ $markerstyle }}">RENAMED</span>
32 {{ else }}
33 <span class="bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 {{ $markerstyle }}">MODIFIED</span>
34 {{ end }}
35
36 {{ template "repo/fragments/diffStatPill" .Stats }}
37 </div>
38
39 <div class="flex gap-2 items-center overflow-x-auto">
40 {{ if .IsDelete }}
41 <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $this }}href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.Old }}"{{end}}>
42 {{ .Name.Old }}
43 </a>
44 {{ else if (or .IsCopy .IsRename) }}
45 <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $parent}}href="/{{ $repo }}/blob/{{ $parent }}/{{ .Name.Old }}"{{end}}>
46 {{ .Name.Old }}
47 </a>
48 {{ i "arrow-right" "w-4 h-4" }}
49 <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $this}}href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}"{{end}}>
50 {{ .Name.New }}
51 </a>
52 {{ else }}
53 <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $this}}href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}"{{end}}>
54 {{ .Name.New }}
55 </a>
56 {{ end }}
57 </div>
58 </div>
59
60 {{ $iconstyle := "p-1 mx-1 hover:bg-gray-100 dark:hover:bg-gray-700 rounded" }}
61 <div id="right-side-items" class="p-2 flex items-center">
62 <a title="top of file" href="#file-{{ .Name.New }}" class="{{ $iconstyle }}">{{ i "arrow-up-to-line" "w-4 h-4" }}</a>
63 {{ if gt $idx 0 }}
64 {{ $prev := index $diff (sub $idx 1) }}
65 <a title="previous file" href="#file-{{ $prev.Name.New }}" class="{{ $iconstyle }}">{{ i "arrow-up" "w-4 h-4" }}</a>
66 {{ end }}
67
68 {{ if lt $idx $last }}
69 {{ $next := index $diff (add $idx 1) }}
70 <a title="next file" href="#file-{{ $next.Name.New }}" class="{{ $iconstyle }}">{{ i "arrow-down" "w-4 h-4" }}</a>
71 {{ end }}
72 </div>
73
74 </div>
75 </summary>
76
77 <div class="transition-all duration-700 ease-in-out">
78 {{ if .IsDelete }}
79 <p class="text-center text-gray-400 dark:text-gray-500 p-4">
80 This file has been deleted.
81 </p>
82 {{ else if .IsCopy }}
83 <p class="text-center text-gray-400 dark:text-gray-500 p-4">
84 This file has been copied.
85 </p>
86 {{ else if .IsBinary }}
87 <p class="text-center text-gray-400 dark:text-gray-500 p-4">
88 This is a binary file and will not be displayed.
89 </p>
90 {{ else }}
91 {{ if $isSplit }}
92 {{- template "repo/fragments/splitDiff" .Split -}}
93 {{ else }}
94 {{- template "repo/fragments/unifiedDiff" . -}}
95 {{ end }}
96 {{- end -}}
97 </div>
98
99 </details>
100
101 </div>
102 </div>
103 </section>
104 {{ end }}
105 {{ end }}
106{{ end }}
107
108{{ define "unifiedDiffLines" }}
109{{ $name := .Name.New }}
110<pre class="overflow-x-auto"><div class="overflow-x-auto"><div class="min-w-full inline-block">{{- range .TextFragments -}}<div class="bg-gray-100 dark:bg-gray-700 text-gray-500 dark:text-gray-400 select-none text-center">···</div>
111 {{- $oldStart := .OldPosition -}}
112 {{- $newStart := .NewPosition -}}
113 {{- $lineNrStyle := "min-w-[3.5rem] flex-shrink-0 select-none text-right bg-white dark:bg-gray-800 target:bg-yellow-200 target:dark:bg-yellow-600" -}}
114 {{- $linkStyle := "text-gray-400 dark:text-gray-500 hover:underline" -}}
115 {{- $lineNrSepStyle1 := "" -}}
116 {{- $lineNrSepStyle2 := "pr-2 border-r border-gray-200 dark:border-gray-700" -}}
117 {{- $containerStyle := "flex min-w-full items-center target:border target:rounded-sm target:border-yellow-200 target:dark:border-yellow-700 scroll-mt-20" -}}
118 {{- $addStyle := "bg-green-100 dark:bg-green-800/30 text-green-700 dark:text-green-400 " -}}
119 {{- $delStyle := "bg-red-100 dark:bg-red-800/30 text-red-700 dark:text-red-400 " -}}
120 {{- $ctxStyle := "bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400" -}}
121 {{- $opStyle := "w-5 flex-shrink-0 select-none text-center" -}}
122 {{- range .Lines -}}
123 {{- if eq .Op.String "+" -}}
124 <div class="{{ $addStyle }} {{ $containerStyle }}" id="{{$name}}-N{{$newStart}}">
125 <div class="{{$lineNrStyle}} {{$lineNrSepStyle1}}"><span aria-hidden="true" class="invisible">{{$newStart}}</span></div>
126 <div class="{{$lineNrStyle}} {{$lineNrSepStyle2}}"><a class="{{$linkStyle}}" href="#{{$name}}-N{{$newStart}}">{{ $newStart }}</a></div>
127 <div class="{{ $opStyle }}">{{ .Op.String }}</div>
128 <div class="px-2">{{ .Line }}</div>
129 </div>
130 {{- $newStart = add64 $newStart 1 -}}
131 {{- end -}}
132 {{- if eq .Op.String "-" -}}
133 <div class="{{ $delStyle }} {{ $containerStyle }}" id="{{$name}}-O{{$oldStart}}">
134 <div class="{{$lineNrStyle}} {{$lineNrSepStyle1}}"><a class="{{$linkStyle}}" href="#{{$name}}-O{{$oldStart}}">{{ $oldStart }}</a></div>
135 <div class="{{$lineNrStyle}} {{$lineNrSepStyle2}}"><span aria-hidden="true" class="invisible">{{$oldStart}}</span></div>
136 <div class="{{ $opStyle }}">{{ .Op.String }}</div>
137 <div class="px-2">{{ .Line }}</div>
138 </div>
139 {{- $oldStart = add64 $oldStart 1 -}}
140 {{- end -}}
141 {{- if eq .Op.String " " -}}
142 <div class="{{ $ctxStyle }} {{ $containerStyle }}" id="{{$name}}-O{{$oldStart}}-N{{$newStart}}">
143 <div class="{{$lineNrStyle}} {{$lineNrSepStyle1}}"><a class="{{$linkStyle}}" href="#{{$name}}-O{{$oldStart}}-N{{$newStart}}">{{ $oldStart }}</a></div>
144 <div class="{{$lineNrStyle}} {{$lineNrSepStyle2}}"><a class="{{$linkStyle}}" href="#{{$name}}-O{{$oldStart}}-N{{$newStart}}">{{ $newStart }}</a></div>
145 <div class="{{ $opStyle }}">{{ .Op.String }}</div>
146 <div class="px-2">{{ .Line }}</div>
147 </div>
148 {{- $newStart = add64 $newStart 1 -}}
149 {{- $oldStart = add64 $oldStart 1 -}}
150 {{- end -}}
151 {{- end -}}
152 {{- end -}}</div></div></pre>
153{{ end }}
154
155{{ define "splitDiffLines" }}
156{{ $name := .Name.New }}
157{{- $lineNrStyle := "min-w-[3.5rem] flex-shrink-0 select-none text-right bg-white dark:bg-gray-800" -}}
158{{- $linkStyle := "text-gray-400 dark:text-gray-500 hover:underline" -}}
159{{- $lineNrSepStyle := "pr-2 border-r border-gray-200 dark:border-gray-700" -}}
160{{- $containerStyle := "flex min-w-full items-center target:border target:rounded-sm target:border-yellow-200 target:dark:border-yellow-700 scroll-mt-20" -}}
161{{- $emptyStyle := "bg-gray-200/30 dark:bg-gray-700/30" -}}
162{{- $addStyle := "bg-green-100 dark:bg-green-800/30 text-green-700 dark:text-green-400" -}}
163{{- $delStyle := "bg-red-100 dark:bg-red-800/30 text-red-700 dark:text-red-400 " -}}
164{{- $ctxStyle := "bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400" -}}
165{{- $opStyle := "w-5 flex-shrink-0 select-none text-center" -}}
166<div class="grid grid-cols-2 divide-x divide-gray-200 dark:divide-gray-700">
167<pre class="overflow-x-auto col-span-1"><div class="overflow-x-auto"><div class="min-w-full inline-block">{{- range .TextFragments -}}<div class="bg-gray-100 dark:bg-gray-700 text-gray-500 dark:text-gray-400 select-none text-center">···</div>
168 {{- range .LeftLines -}}
169 {{- if .IsEmpty -}}
170 <div class="{{ $emptyStyle }} {{ $containerStyle }}">
171 <div class="{{$lineNrStyle}} {{$lineNrSepStyle}}"><span aria-hidden="true" class="invisible">{{.LineNumber}}</span></div>
172 <div class="{{ $opStyle }}"><span aria-hidden="true" class="invisible">{{ .Op.String }}</span></div>
173 <div class="px-2 invisible" aria-hidden="true">{{ .Content }}</div>
174 </div>
175 {{- else if eq .Op.String "-" -}}
176 <div class="{{ $delStyle }} {{ $containerStyle }}" id="{{$name}}-O{{.LineNumber}}">
177 <div class="{{ $lineNrStyle }} {{ $lineNrSepStyle }}"><a class="{{$linkStyle}}" href="#{{$name}}-O{{.LineNumber}}">{{ .LineNumber }}</a></div>
178 <div class="{{ $opStyle }}">{{ .Op.String }}</div>
179 <div class="px-2">{{ .Content }}</div>
180 </div>
181 {{- else if eq .Op.String " " -}}
182 <div class="{{ $ctxStyle }} {{ $containerStyle }}" id="{{$name}}-O{{.LineNumber}}">
183 <div class="{{ $lineNrStyle }} {{ $lineNrSepStyle }}"><a class="{{$linkStyle}}" href="#{{$name}}-O{{.LineNumber}}">{{ .LineNumber }}</a></div>
184 <div class="{{ $opStyle }}">{{ .Op.String }}</div>
185 <div class="px-2">{{ .Content }}</div>
186 </div>
187 {{- end -}}
188 {{- end -}}
189 {{- end -}}</div></div></pre>
190
191<pre class="overflow-x-auto col-span-1"><div class="overflow-x-auto"><div class="min-w-full inline-block">{{- range .TextFragments -}}<div class="bg-gray-100 dark:bg-gray-700 text-gray-500 dark:text-gray-400 select-none text-center">···</div>
192 {{- range .RightLines -}}
193 {{- if .IsEmpty -}}
194 <div class="{{ $emptyStyle }} {{ $containerStyle }}">
195 <div class="{{$lineNrStyle}} {{$lineNrSepStyle}}"><span aria-hidden="true" class="invisible">{{.LineNumber}}</span></div>
196 <div class="{{ $opStyle }}"><span aria-hidden="true" class="invisible">{{ .Op.String }}</span></div>
197 <div class="px-2 invisible" aria-hidden="true">{{ .Content }}</div>
198 </div>
199 {{- else if eq .Op.String "+" -}}
200 <div class="{{ $addStyle }} {{ $containerStyle }}" id="{{$name}}-N{{.LineNumber}}">
201 <div class="{{$lineNrStyle}} {{$lineNrSepStyle}}"><a class="{{$linkStyle}}" href="#{{$name}}-N{{.LineNumber}}">{{ .LineNumber }}</a></div>
202 <div class="{{ $opStyle }}">{{ .Op.String }}</div>
203 <div class="px-2" >{{ .Content }}</div>
204 </div>
205 {{- else if eq .Op.String " " -}}
206 <div class="{{ $ctxStyle }} {{ $containerStyle }}" id="{{$name}}-N{{.LineNumber}}">
207 <div class="{{$lineNrStyle}} {{$lineNrSepStyle}}"><a class="{{$linkStyle}}" href="#{{$name}}-N{{.LineNumber}}">{{ .LineNumber }}</a></div>
208 <div class="{{ $opStyle }}">{{ .Op.String }}</div>
209 <div class="px-2">{{ .Content }}</div>
210 </div>
211 {{- end -}}
212 {{- end -}}
213 {{- end -}}</div></div></pre>
214</div>
215{{ end }}
216
217{{ define "statPill" }}
218 <div class="flex items-center font-mono text-sm">
219 {{ if and .Insertions .Deletions }}
220 <span class="rounded-l p-1 select-none bg-green-100 text-green-700 dark:bg-green-800/50 dark:text-green-400">+{{ .Insertions }}</span>
221 <span class="rounded-r p-1 select-none bg-red-100 text-red-700 dark:bg-red-800/50 dark:text-red-400">-{{ .Deletions }}</span>
222 {{ else if .Insertions }}
223 <span class="rounded p-1 select-none bg-green-100 text-green-700 dark:bg-green-800/50 dark:text-green-400">+{{ .Insertions }}</span>
224 {{ else if .Deletions }}
225 <span class="rounded p-1 select-none bg-red-100 text-red-700 dark:bg-red-800/50 dark:text-red-400">-{{ .Deletions }}</span>
226 {{ end }}
227 </div>
228{{ end }}
229