From 3602a1987db58da13ee2baa33bb0c36a60e27608 Mon Sep 17 00:00:00 2001
From: Nanguan Lin <70063547+lng2020@users.noreply.github.com>
Date: Wed, 25 Oct 2023 18:00:53 +0800
Subject: [PATCH] Add border to file tree 'sub-items' and add padding to
 'item-file' (#27593)

## Add border to file tree 'sub-items'
close #24766
view in `gitea-light`
<img width="275" alt="image"
src="https://github.com/go-gitea/gitea/assets/70063547/f1bf8736-2db3-454f-86f5-d050a2fae3eb">
view in `gitea-dark`
<img width="296" alt="image"
src="https://github.com/go-gitea/gitea/assets/70063547/053e2e6e-28f7-41d2-a139-1dae4df45929">
## Change the 'item-file' padding
Before that the 'item-file' only have padding when they in
'item-directory', which is too compact when 'item-file' after
'item-directory'
<details>

![)RW`SDJ_UQL@$}0
PL(3DS7](https://github.com/go-gitea/gitea/assets/70063547/5fa523a4-44c3-4cb9-a882-a3ea6d944673)

---------

Co-authored-by: silverwind <me@silverwind.io>
---
 web_src/js/components/DiffFileTreeItem.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/web_src/js/components/DiffFileTreeItem.vue b/web_src/js/components/DiffFileTreeItem.vue
index 22c23f3ca0..9d7ab4afc5 100644
--- a/web_src/js/components/DiffFileTreeItem.vue
+++ b/web_src/js/components/DiffFileTreeItem.vue
@@ -61,11 +61,12 @@ a, a:hover {
   display: flex;
   flex-direction: column;
   gap: 1px;
-  padding-left: 8px;
+  margin-left: 13px;
+  border-left: 1px solid var(--color-secondary);
 }
 
 .sub-items .item-file {
-  padding-left: 24px;
+  padding-left: 18px;
 }
 
 .item-file.selected {