fix(ui): avoid Monaco overlay dimming on phone

This commit is contained in:
Shantur Rathore
2026-02-10 20:37:41 +00:00
parent 16c2eeca3e
commit d291c2f074
2 changed files with 4 additions and 42 deletions

View File

@@ -1631,23 +1631,6 @@ const InstanceShell2: Component<InstanceShellProps> = (props) => {
<Show when={isPhoneLayout()}>
<Show when={changesListOpen()}>
<div class="file-list-overlay" role="dialog" aria-label="Changes">
<div class="file-list-overlay-header">
<span class="files-tab-selected-path" title={selectedFileData?.file || ""}>
{selectedFileData?.file || ""}
</span>
<button
type="button"
class="files-toggle-button"
onClick={() => {
setChangesListTouched(true)
setChangesListOpen(false)
persistListOpen("changes", false)
}}
aria-label="Close files"
>
Close
</button>
</div>
<div class="file-list-scroll">
<For each={sorted}>
{(item) => (
@@ -1881,23 +1864,6 @@ const InstanceShell2: Component<InstanceShellProps> = (props) => {
<Show when={isPhoneLayout()}>
<Show when={filesListOpen()}>
<div class="file-list-overlay" role="dialog" aria-label="Files">
<div class="file-list-overlay-header">
<span class="files-tab-selected-path" title={browserPath()}>
{browserPath()}
</span>
<button
type="button"
class="files-toggle-button"
onClick={() => {
setFilesListTouched(true)
setFilesListOpen(false)
persistListOpen("files", false)
}}
aria-label="Close files"
>
Close
</button>
</div>
<div class="file-list-scroll">
<Show when={parent}>
{(p) => (

View File

@@ -117,6 +117,7 @@
.files-tab-body {
@apply flex flex-col flex-1 min-h-0;
position: relative;
isolation: isolate;
}
.file-list-overlay {
@@ -126,16 +127,11 @@
flex-direction: column;
background-color: var(--surface-secondary);
border-left: 1px solid var(--border-base);
z-index: 5;
/* Monaco uses layered positioned elements; keep overlay well above it. */
z-index: 200;
}
.file-list-overlay-header {
@apply flex items-center justify-between gap-2 px-3 py-2 border-b;
border-color: var(--border-base);
background-color: var(--surface-secondary);
}
/* Overlay title intentionally unused; header shows current path instead. */
/* Phone overlay: header removed; use main header toggle. */
.files-tab-stats {
@apply flex items-center gap-3 text-[11px];