{{ define "repo/fragments/unifiedDiff" }}
{{ $name := .Id }}
<div class="overflow-x-auto font-mono leading-normal"><div class="overflow-x-auto"><div class="inline-flex flex-col min-w-full">{{- range .TextFragments -}}<span class="block bg-gray-100 dark:bg-gray-700 text-gray-500 dark:text-gray-400 select-none text-center">&middot;&middot;&middot;</span>
 {{- $oldStart := .OldPosition -}}
 {{- $newStart := .NewPosition -}}
 {{- $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" -}}
 {{- $linkStyle := "text-gray-400 dark:text-gray-500 hover:underline" -}}
 {{- $lineNrSepStyle1 := "" -}}
 {{- $lineNrSepStyle2 := "pr-2 border-r border-gray-200 dark:border-gray-700" -}}
 {{- $containerStyle := "inline-flex w-full items-center target:border target:rounded-sm target:border-yellow-200 target:dark:border-yellow-700 scroll-mt-20" -}}
 {{- $addStyle := "bg-green-100 dark:bg-green-800/30 text-green-700 dark:text-green-400 " -}}
 {{- $delStyle := "bg-red-100 dark:bg-red-800/30 text-red-700 dark:text-red-400 " -}}
 {{- $ctxStyle := "bg-white dark:bg-gray-800 text-gray-500 dark:text-gray-400" -}}
 {{- $opStyle := "w-5 flex-shrink-0 select-none text-center" -}}
 {{- range .Lines -}}
   {{- if eq .Op.String "+" -}}
     <span class="{{ $addStyle }} {{ $containerStyle }}" id="{{$name}}-N{{$newStart}}">
       <span class="{{$lineNrStyle}} {{$lineNrSepStyle1}}"><span aria-hidden="true" class="invisible">{{$newStart}}</span></span>
       <span class="{{$lineNrStyle}} {{$lineNrSepStyle2}}"><a class="{{$linkStyle}}" href="#{{$name}}-N{{$newStart}}">{{ $newStart }}</a></span>
       <span class="{{ $opStyle }}">{{ .Op.String }}</span>
       <span class="px-2 whitespace-pre">{{ .Line }}</span>
     </span>
     {{- $newStart = add64 $newStart 1 -}}
   {{- end -}}
   {{- if eq .Op.String "-" -}}
     <span class="{{ $delStyle }} {{ $containerStyle }}" id="{{$name}}-O{{$oldStart}}">
       <span class="{{$lineNrStyle}} {{$lineNrSepStyle1}}"><a class="{{$linkStyle}}" href="#{{$name}}-O{{$oldStart}}">{{ $oldStart }}</a></span>
       <span class="{{$lineNrStyle}} {{$lineNrSepStyle2}}"><span aria-hidden="true" class="invisible">{{$oldStart}}</span></span>
       <span class="{{ $opStyle }}">{{ .Op.String }}</span>
       <span class="px-2 whitespace-pre">{{ .Line }}</span>
     </span>
     {{- $oldStart = add64 $oldStart 1 -}}
   {{- end -}}
   {{- if eq .Op.String " " -}}
     <span class="{{ $ctxStyle }} {{ $containerStyle }}" id="{{$name}}-O{{$oldStart}}-N{{$newStart}}">
       <span class="{{$lineNrStyle}} {{$lineNrSepStyle1}}"><a class="{{$linkStyle}}" href="#{{$name}}-O{{$oldStart}}-N{{$newStart}}">{{ $oldStart }}</a></span>
       <span class="{{$lineNrStyle}} {{$lineNrSepStyle2}}"><a class="{{$linkStyle}}" href="#{{$name}}-O{{$oldStart}}-N{{$newStart}}">{{ $newStart }}</a></span>
       <span class="{{ $opStyle }}">{{ .Op.String }}</span>
       <span class="px-2 whitespace-pre">{{ .Line }}</span>
     </span>
     {{- $newStart = add64 $newStart 1 -}}
     {{- $oldStart = add64 $oldStart 1 -}}
   {{- end -}}
 {{- end -}}
 {{- end -}}</div></div></div>
{{ end }}