Proposal : Improve left tree view #10861

New Issue

GiteaMirror · 2025-11-02T09:20:15-06:00

GiteaMirror commented

2025-11-02 09:20:15 -06:00

Originally created by @Kiiow on GitHub (May 17, 2023).

Description

The current tree view that we can see on PRs and commits is really cool and help navigate in different files esaily, but it's hard to spot in which folder level a file is.

It would be interesting to improve the padding on the list and add guideline to see faster in which folder a file is.

Screenshots

I've made the modification directly in the browser using the devtools, but i don't know which css files need to be edited to get something like that.

What i've done is:

/* Remove */
.item.filewrapper {
  padding-left: 18px!important;
}
/* Add */
.ui.list .list:not(.icon) {
  padding-left: 0.75em;
  margin-left: 10px;
  border-left: 1px solid #679169;
}

Gitea Version

1.19.0+62-g809225113

Can you reproduce the bug on the Gitea demo site?

Yes

Operating System

Windows

Browser Version

Brave Version 1.51.114 Chromium: 113.0.5672.92

Originally created by @Kiiow on GitHub (May 17, 2023). ### Description The current tree view that we can see on PRs and commits is really cool and help navigate in different files esaily, but it's hard to spot in which folder level a file is. It would be interesting to improve the padding on the list and add guideline to see faster in which folder a file is. ### Screenshots ![before](https://github.com/go-gitea/gitea/assets/31588247/02c847b3-db56-4799-b51b-938f8bbe6002) I've made the modification directly in the browser using the devtools, but i don't know which css files need to be edited to get something like that. What i've done is: ```css /* Remove */ .item.filewrapper { padding-left: 18px!important; } /* Add */ .ui.list .list:not(.icon) { padding-left: 0.75em; margin-left: 10px; border-left: 1px solid #679169; } ``` ![after_insepct_improve](https://github.com/go-gitea/gitea/assets/31588247/13dd84ca-1f75-4fb1-847b-c875fc821c09) ### Gitea Version 1.19.0+62-g809225113 ### Can you reproduce the bug on the Gitea demo site? Yes ### Operating System Windows ### Browser Version Brave Version 1.51.114 Chromium: 113.0.5672.92

GiteaMirror added the type/enhancement proposal/accepted topic/ui labels 2025-11-02 09:20:15 -06:00

GiteaMirror closed this issue

2025-11-02 09:20:15 -06:00

GiteaMirror commented

2025-11-02 09:20:16 -06:00

@silverwind commented on GitHub (May 17, 2023):

I agree we can add these, but we should use a subtle secondary color. For reference, GitHub also has these, but their color is a bit too subtle. Also we should not increase indendation too much. Space is limited and we need to support deeply nested structures.

@silverwind commented on GitHub (May 17, 2023): I agree we can add these, but we should use a subtle secondary color. For reference, GitHub also has these, but their color is a bit too subtle. Also we should not increase indendation too much. Space is limited and we need to support deeply nested structures. <img width="371" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/ed7e776d-e636-43a6-9819-ac5a982e019a">

GiteaMirror commented

2025-11-02 09:20:16 -06:00

@lozn00 commented on GitHub (Sep 5, 2023):

how to use?

@lozn00 commented on GitHub (Sep 5, 2023): how to use?

GiteaMirror commented

2025-11-02 09:20:16 -06:00

@lunny commented on GitHub (Sep 5, 2023):

how to use?

In PR files changed page

@lunny commented on GitHub (Sep 5, 2023): > how to use? In PR files changed page

GiteaMirror commented

2025-11-02 09:20:17 -06:00

@lozn00 commented on GitHub (Sep 5, 2023):

@lunny
意思是没有正式发布嘛？我的docker 中没有看到相关效果
Does it mean it hasn't been officially released? I didn't see any related effects in my Docker

@lozn00 commented on GitHub (Sep 5, 2023): @lunny 意思是没有正式发布嘛？我的docker 中没有看到相关效果 Does it mean it hasn't been officially released? I didn't see any related effects in my Docker

GiteaMirror commented

2025-11-02 09:20:17 -06:00

@lunny commented on GitHub (Sep 5, 2023):

@lunny 意思是没有正式发布嘛？我的docker 中没有看到相关效果 Does it mean it hasn't been officially released? I didn't see any related effects in my Docker

Click on the icon on your pull request files changed UI.

@lunny commented on GitHub (Sep 5, 2023): > @lunny 意思是没有正式发布嘛？我的docker 中没有看到相关效果 Does it mean it hasn't been officially released? I didn't see any related effects in my Docker Click on the icon on your pull request files changed UI. <img width="37" alt="图片" src="https://github.com/go-gitea/gitea/assets/81045/c7c95c3c-01a1-43b4-9936-1d34d0546795">

GiteaMirror commented

2025-11-02 09:20:17 -06:00

@lozn00 commented on GitHub (Sep 5, 2023):

https://gitea.com/gitea/awesome-gitea ,how to close issues

@lozn00 commented on GitHub (Sep 5, 2023): https://gitea.com/gitea/awesome-gitea ,how to close issues

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github-starred/gitea#10861