diff options
| author | David Hill <[email protected]> | 2026-01-26 19:01:25 +0000 |
|---|---|---|
| committer | David Hill <[email protected]> | 2026-01-26 19:47:58 +0000 |
| commit | c6febd8ddd521822c38fc9c7f34f20af1debe594 (patch) | |
| tree | 92df6a9ca65906260495aa563e5d2e465fa1b987 /packages/app/src | |
| parent | 010ed55590534feaff2094145597154d79da3324 (diff) | |
| download | opencode-c6febd8ddd521822c38fc9c7f34f20af1debe594.tar.gz opencode-c6febd8ddd521822c38fc9c7f34f20af1debe594.zip | |
fix(app): fade filetree guide lines on hover
Diffstat (limited to 'packages/app/src')
| -rw-r--r-- | packages/app/src/components/file-tree.tsx | 6 | ||||
| -rw-r--r-- | packages/app/src/pages/session.tsx | 2 |
2 files changed, 4 insertions, 4 deletions
diff --git a/packages/app/src/components/file-tree.tsx b/packages/app/src/components/file-tree.tsx index 83a39a16c..b7f8316d0 100644 --- a/packages/app/src/components/file-tree.tsx +++ b/packages/app/src/components/file-tree.tsx @@ -198,9 +198,9 @@ export default function FileTree(props: { <Collapsible.Content class="relative pt-0.5"> <div classList={{ - "absolute top-0 bottom-0 w-px pointer-events-none bg-border-weak-base": true, - "opacity-100": expanded() && deep() === level, - "opacity-50": !(expanded() && deep() === level), + "absolute top-0 bottom-0 w-px pointer-events-none bg-border-weak-base opacity-0 transition-opacity duration-150 ease-out motion-reduce:transition-none": true, + "group-hover/filetree:opacity-100": expanded() && deep() === level, + "group-hover/filetree:opacity-50": !(expanded() && deep() === level), }} style={`left: ${Math.max(0, 8 + level * 12 - 4) + 8}px`} /> diff --git a/packages/app/src/pages/session.tsx b/packages/app/src/pages/session.tsx index 41d940505..d717cc3d8 100644 --- a/packages/app/src/pages/session.tsx +++ b/packages/app/src/pages/session.tsx @@ -2626,7 +2626,7 @@ export default function Page() { <Show when={layout.fileTree.opened()}> <div class="relative shrink-0 h-full" style={{ width: `${layout.fileTree.width()}px` }}> - <div class="h-full border-l border-border-weak-base flex flex-col overflow-hidden"> + <div class="h-full border-l border-border-weak-base flex flex-col overflow-hidden group/filetree"> <Tabs variant="pill" value={fileTreeTab()} |