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={isPhoneLayout()}>
<Show when={changesListOpen()}> <Show when={changesListOpen()}>
<div class="file-list-overlay" role="dialog" aria-label="Changes"> <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"> <div class="file-list-scroll">
<For each={sorted}> <For each={sorted}>
{(item) => ( {(item) => (
@@ -1881,23 +1864,6 @@ const InstanceShell2: Component<InstanceShellProps> = (props) => {
<Show when={isPhoneLayout()}> <Show when={isPhoneLayout()}>
<Show when={filesListOpen()}> <Show when={filesListOpen()}>
<div class="file-list-overlay" role="dialog" aria-label="Files"> <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"> <div class="file-list-scroll">
<Show when={parent}> <Show when={parent}>
{(p) => ( {(p) => (

View File

@@ -117,6 +117,7 @@
.files-tab-body { .files-tab-body {
@apply flex flex-col flex-1 min-h-0; @apply flex flex-col flex-1 min-h-0;
position: relative; position: relative;
isolation: isolate;
} }
.file-list-overlay { .file-list-overlay {
@@ -126,16 +127,11 @@
flex-direction: column; flex-direction: column;
background-color: var(--surface-secondary); background-color: var(--surface-secondary);
border-left: 1px solid var(--border-base); 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 { /* Phone overlay: header removed; use main header toggle. */
@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. */
.files-tab-stats { .files-tab-stats {
@apply flex items-center gap-3 text-[11px]; @apply flex items-center gap-3 text-[11px];