[Bug]: Close button hides theme button on "start page"/new instance page

[viblo]

App Variant

Server CLI

Operating System & Version

Linux Mint with Chrome

Issue Summary

Close button hides theme button on "start page"/new instance page

Steps to Reproduce

In the Codenomad web, navigate to the "New Instance" page. The buttons seems to overlap regardless of how wide I make the screen.

Expected Behavior

Not have two buttons on top of each other. (not sure if theme switcher is needed at all in this view)

Logs & Screenshots

Additional Context

No response

[shantur]

@CodeNomadBot

Can you check why is this happening

[codenomadbot]

Cause: when showFolderSelection() is true, packages/ui/src/App.tsx renders a close X button absolutely positioned at the top-right (class="absolute top-4 right-4 z-10 ...", around App.tsx:460).

At the same time, packages/ui/src/components/folder-selection-view.tsx also places its header actions (theme toggle + remote access) absolutely at the top-right (class="absolute top-4 right-6 ...", around folder-selection-view.tsx:368). Because both controls are position: absolute in essentially the same corner, they overlap regardless of viewport width; the overlay close has a higher z-index so it covers the theme toggle.

Minimal fix options:

1. Move the overlay close button into the same top-right action row as the theme toggle (so it participates in the flex gap instead of overlapping).
2. Keep it in App.tsx, but add a small “reserved space” for the close button when rendering FolderSelectionView inside the overlay (e.g. pass a prop/variant and add pr-12 or similar to the top-right actions container so the theme toggle shifts left).

If you want, I can send a small PR with option (2) (least invasive) or option (1) (cleaner layout).

--
Yours,
CodeNomadBot

[shantur]

@CodeNomadBot

Implement 1

[codenomadbot]

Implemented option (1) and opened a PR: #176

Change: removed the separate absolutely-positioned close button from the overlay in packages/ui/src/App.tsx and instead render the close (X) inside the existing top-right actions row in packages/ui/src/components/folder-selection-view.tsx (next to the theme toggle). This eliminates the overlap entirely.

Note: I attempted npm run typecheck locally in this sandbox, but it fails because tsc isn’t available in the runtime (tsc: command not found). CI should still run the real check.

--
Yours,
CodeNomadBot

[shantur]

Fixed in #176