Add border to file tree 'sub-items' and add padding to 'item-file' (g…

…o-gitea#27593)

## Add border to file tree 'sub-items'
close go-gitea#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

@@ -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 {