Skip to content

Commit 88a7ab2

Browse files
quickbeardclaude
andcommitted
fix(app): show the pointer cursor on Work's mount buttons
Both ways into the Mount project dialog from the sidebar looked unclickable: the icon button beside Projects and the prompt shown while a sandbox has no folders both kept the arrow cursor on hover. The icon button needs the important modifier. icon-button-v2.css sets `cursor: default` on every icon button, and that file is unlayered while Tailwind's utilities live in @layer utilities — unlayered CSS wins over any layered rule regardless of specificity, so a plain `cursor-pointer` would have been silently dropped. `enabled:` keeps the disabled state on the not-allowed cursor the variant already gives it, which is what the button shows while its sandbox is unhealthy. The prompt is a plain button with no component CSS competing, so it needs no modifier. Work only: this is the button that mounts a host folder into the sandbox. The same element on Code is upstream's Add project, which is left alone. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
1 parent 629a245 commit 88a7ab2

2 files changed

Lines changed: 11 additions & 2 deletions

File tree

‎packages/app/src/components/app-sidebar.tsx‎

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,16 @@ export function AppSidebar(props: { class?: string; debugTools?: { visible: bool
117117
data-action={side() === "work" ? "work-mount-project" : "home-add-project"}
118118
variant="ghost-muted"
119119
size="large"
120-
class="titlebar-icon [&_[data-slot=icon-svg]]:text-v2-icon-icon-muted"
120+
class={`titlebar-icon [&_[data-slot=icon-svg]]:text-v2-icon-icon-muted${
121+
// Fork: icon-button-v2.css sets cursor: default on every icon
122+
// button, and Tailwind utilities sit in @layer utilities, so
123+
// the unlayered component rule wins without the important
124+
// modifier. `enabled:` leaves the disabled state on the
125+
// not-allowed cursor the variant already gives it. Work only:
126+
// this is the button that mounts a folder into the sandbox,
127+
// and Code's Add project is upstream's, untouched.
128+
side() === "work" ? " enabled:cursor-pointer!" : ""
129+
}`}
121130
icon={<IconV2 name="folder-add-left" />}
122131
disabled={global.servers.health[ServerConnection.key(sideServers()[0]!)]?.healthy === false}
123132
onClick={() => {

‎packages/app/src/sandbox/mount-prompt.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export function SandboxMountPrompt(props: { server: ServerConnection.Any }) {
1818
<button
1919
type="button"
2020
data-action="sandbox-mount-prompt"
21-
class="flex items-center gap-1.5 text-12-medium text-v2-text-text-base underline [&>[data-slot=icon-svg]]:text-v2-icon-icon-muted"
21+
class="flex cursor-pointer items-center gap-1.5 text-12-medium text-v2-text-text-base underline [&>[data-slot=icon-svg]]:text-v2-icon-icon-muted"
2222
onClick={() => {
2323
// Lazy, like every other route to this dialog: it is desktop-only and
2424
// pulls the whole mounts editor in with it.

0 commit comments

Comments
 (0)