salvacybersec/CodeNomad
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(ui): prevent settings modal overflow on phones

Browse Source
This commit is contained in:
Shantur Rathore
2026-04-09 21:00:17 +01:00
parent d50c00afb4
commit c7d4f99e48
2 changed files with 37 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
packages/ui/src/styles/components/settings-screen.css
View File

@@ -526,14 +526,49 @@
@media (max-width: 640px) {
.settings-screen-frame {
padding: 0;
overflow: hidden;
}
.modal-surface.settings-screen-shell {
width: 100%;
max-width: 100%;
height: 100%;
max-height: none;
min-height: 100%;
border-radius: 0;
overflow-x: hidden;
}
.modal-surface.settings-screen-shell .settings-screen-nav,
.modal-surface.settings-screen-shell .settings-screen-nav-list,
.modal-surface.settings-screen-shell .settings-screen-content,
.modal-surface.settings-screen-shell .settings-screen-scroll,
.modal-surface.settings-screen-shell .settings-section-stack,
.modal-surface.settings-screen-shell .settings-stack,
.modal-surface.settings-screen-shell .settings-card,
.modal-surface.settings-screen-shell .settings-card-content,
.modal-surface.settings-screen-shell .settings-toggle-row,
.modal-surface.settings-screen-shell .settings-toggle-row > * {
min-width: 0;
}
.modal-surface.settings-screen-shell .selector-trigger,
.modal-surface.settings-screen-shell .selector-input,
.modal-surface.settings-screen-shell .selector-button {
min-width: 0;
max-width: 100%;
}
.modal-surface.settings-screen-shell .settings-toggle-caption,
.modal-surface.settings-screen-shell .settings-inline-note,
.modal-surface.settings-screen-shell .remote-address-url,
.modal-surface.settings-screen-shell code {
overflow-wrap: anywhere;
word-break: break-word;
}
.modal-surface.settings-screen-shell .whitespace-nowrap {
white-space: normal;
}
.settings-screen-content-header,