From c91caee0934f827e5a981cbf185372e709aa9ed3 Mon Sep 17 00:00:00 2001
From: Akshay <nerdy@peppe.rs>
Date: Thu, 17 Apr 2025 14:12:55 +0100
Subject: [PATCH] appview: fix file-path overflow in diff view

---
 .../pages/templates/repo/fragments/diff.html  | 69 ++++++++++---------
 1 file changed, 35 insertions(+), 34 deletions(-)

diff --git a/appview/pages/templates/repo/fragments/diff.html b/appview/pages/templates/repo/fragments/diff.html
index 65aac0d5..e237f56b 100644
--- a/appview/pages/templates/repo/fragments/diff.html
+++ b/appview/pages/templates/repo/fragments/diff.html
@@ -37,41 +37,42 @@
         <details open>
           <summary class="list-none cursor-pointer sticky top-0">
             <div id="diff-file-header" class="rounded cursor-pointer bg-white dark:bg-gray-800 flex justify-between">
-              <div id="left-side-items" class="p-2 flex gap-2 items-center overflow-x-auto" style="direction: rtl;">
-                {{ $markerstyle := "diff-type p-1 mr-1 font-mono text-sm rounded select-none" }}
+              <div id="left-side-items" class="p-2 flex gap-2 items-center overflow-x-auto">
+                <div class="flex gap-1 items-center" style="direction: ltr;">
+                  {{ $markerstyle := "diff-type p-1 mr-1 font-mono text-sm rounded select-none" }}
+                  {{ if .IsNew }}
+                  <span class="bg-green-100 text-green-700 dark:bg-green-800/50 dark:text-green-400 {{ $markerstyle }}">ADDED</span>
+                  {{ else if .IsDelete }}
+                  <span class="bg-red-100 text-red-700 dark:bg-red-800/50 dark:text-red-400 {{ $markerstyle }}">DELETED</span>
+                  {{ else if .IsCopy }}
+                  <span class="bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 {{ $markerstyle }}">COPIED</span>
+                  {{ else if .IsRename }}
+                  <span class="bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 {{ $markerstyle }}">RENAMED</span>
+                  {{ else }}
+                  <span class="bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 {{ $markerstyle }}">MODIFIED</span>
+                  {{ end }}
 
-                <div class="flex gap-2 items-center" style="direction: ltr;">
-                {{ if .IsNew }}
-                <span class="bg-green-100 text-green-700 dark:bg-green-800/50 dark:text-green-400 {{ $markerstyle }}">ADDED</span>
-                {{ else if .IsDelete }}
-                <span class="bg-red-100 text-red-700 dark:bg-red-800/50 dark:text-red-400 {{ $markerstyle }}">DELETED</span>
-                {{ else if .IsCopy }}
-                <span class="bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 {{ $markerstyle }}">COPIED</span>
-                {{ else if .IsRename }}
-                <span class="bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 {{ $markerstyle }}">RENAMED</span>
-                {{ else }}
-                <span class="bg-gray-100 text-gray-700 dark:bg-gray-700 dark:text-gray-300 {{ $markerstyle }}">MODIFIED</span>
-                {{ end }}
-
-                {{ block "statPill" .Stats }} {{ end }}
+                  {{ block "statPill" .Stats }} {{ end }}
+                </div>
 
-                {{ if .IsDelete }}
-                <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $this }}href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.Old }}"{{end}}>
-                  {{ .Name.Old }}
-                </a>
-                {{ else if (or .IsCopy .IsRename) }}
-                <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $parent}}href="/{{ $repo }}/blob/{{ $parent }}/{{ .Name.Old }}"{{end}}>
-                  {{ .Name.Old }}
-                </a>
-                {{ i "arrow-right" "w-4 h-4" }}
-                <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $this}}href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}"{{end}}>
-                  {{ .Name.New }}
-                </a>
-                {{ else }}
-                <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $this}}href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}"{{end}}>
-                  {{ .Name.New }}
-                </a>
-                {{ end }}
+                <div class="flex gap-2 items-center overflow-x-auto" style="direction: rtl;">
+                  {{ if .IsDelete }}
+                  <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $this }}href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.Old }}"{{end}}>
+                    {{ .Name.Old }}
+                  </a>
+                  {{ else if (or .IsCopy .IsRename) }}
+                  <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $parent}}href="/{{ $repo }}/blob/{{ $parent }}/{{ .Name.Old }}"{{end}}>
+                    {{ .Name.Old }}
+                  </a>
+                  {{ i "arrow-right" "w-4 h-4" }}
+                  <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $this}}href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}"{{end}}>
+                    {{ .Name.New }}
+                  </a>
+                  {{ else }}
+                  <a class="dark:text-white whitespace-nowrap overflow-x-auto" {{if $this}}href="/{{ $repo }}/blob/{{ $this }}/{{ .Name.New }}"{{end}}>
+                    {{ .Name.New }}
+                  </a>
+                  {{ end }}
                 </div>
               </div>
 
@@ -172,4 +173,4 @@
       <span class="rounded p-1 select-none bg-red-100 text-red-700 dark:bg-red-800/50 dark:text-red-400">-{{ .Deletions }}</span>
     {{ end }}
   </div>
-{{ end }}
\ No newline at end of file
+{{ end }}
-- 
2.54.0