monadical/opencode
14
0
Fork 0
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

fix(app): refine filetree row spacing and indent

Browse Source
This commit is contained in:
David Hill
2026-01-26 18:30:58 +00:00
parent fca0825b71
commit 99cd7f3468
1 changed files with 3 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
packages/app/src/components/file-tree.tsx
View File

@@ -97,12 +97,12 @@ export default function FileTree(props: {
<Dynamic <Dynamic
component={local.as ?? "div"} component={local.as ?? "div"}
classList={{ classList={{
"w-full min-w-0 h-6 flex items-center justify-start gap-x-2 rounded-md px-2 py-0 text-left hover:bg-surface-raised-base-hover active:bg-surface-base-active transition-colors cursor-pointer": true, "w-full min-w-0 h-6 flex items-center justify-start gap-x-1.5 rounded-md px-2 py-0 text-left hover:bg-surface-raised-base-hover active:bg-surface-base-active transition-colors cursor-pointer": true,
...(local.classList ?? {}), ...(local.classList ?? {}),
[local.class ?? ""]: !!local.class, [local.class ?? ""]: !!local.class,
[props.nodeClass ?? ""]: !!props.nodeClass, [props.nodeClass ?? ""]: !!props.nodeClass,
}} }}
style={`padding-left: ${8 + level * 12}px`} style={`padding-left: ${Math.max(0, 8 + level * 12 - (local.node.type === "file" ? 24 : 0))}px`}
draggable={draggable()} draggable={draggable()}
onDragStart={(e: DragEvent) => { onDragStart={(e: DragEvent) => {
if (!draggable()) return if (!draggable()) return
@@ -175,10 +175,9 @@ export default function FileTree(props: {
<Collapsible.Trigger> <Collapsible.Trigger>
<Wrapper> <Wrapper>
<Node node={node}> <Node node={node}>
<div class="ml-1 size-4 flex items-center justify-center text-icon-weak"> <div class="size-4 flex items-center justify-center text-icon-weak">
<Icon name={expanded() ? "chevron-down" : "chevron-right"} size="small" /> <Icon name={expanded() ? "chevron-down" : "chevron-right"} size="small" />
</div> </div>
<FileIcon node={node} expanded={expanded()} class="text-icon-weak -ml-1 size-4" />
</Node> </Node>
</Wrapper> </Wrapper>
</Collapsible.Trigger> </Collapsible.Trigger>