Projets/ObsiGate
1
1
Fork 0
Code Issues 16 Pull Requests Actions Packages Projects Releases 20 Wiki Activity

Fix: mobile help guide width overflow, box-sizing and max-width constraints
CI / lint (push) Failing after 4s
Details
CI / test (push) Has been skipped
Details
CI / build (push) Has been skipped
Details
CI / security (push) Successful in 9s
Details

Browse Source
This commit is contained in:
bruno
2026-06-03 11:32:43 -04:00
parent 227e157793
commit e9685651cf
1 changed files with 31 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/style.css
+31 -7
View File
@@ -6426,11 +6426,14 @@ body.popup-mode .content-area {
/* ── Help Modal: Mobile responsive ── */ /* ── Help Modal: Mobile responsive ── */
@media (max-width: 768px) { @media (max-width: 768px) {
.help-container { .help-container,
max-width: 100%; .editor-container.help-container {
max-width: 100vw;
width: 100vw;
height: 100vh; height: 100vh;
max-height: 100vh; max-height: 100vh;
border-radius: 0; border-radius: 0;
box-sizing: border-box;
} }
.help-hamburger { .help-hamburger {
@@ -6441,7 +6444,8 @@ body.popup-mode .content-area {
.help-nav { .help-nav {
position: static; position: static;
width: 100%; width: 100%;
min-width: 100%; min-width: 0;
max-width: 100%;
max-height: none; max-height: none;
height: auto; height: auto;
z-index: auto; z-index: auto;
@@ -6451,7 +6455,8 @@ body.popup-mode .content-area {
border-bottom: 1px solid var(--border); border-bottom: 1px solid var(--border);
box-shadow: none; box-shadow: none;
flex-shrink: 0; flex-shrink: 0;
display: none; /* hidden by default on mobile */ display: none;
box-sizing: border-box;
} }
.help-nav-header { .help-nav-header {
padding: 10px 16px 6px; padding: 10px 16px 6px;
@@ -6463,14 +6468,19 @@ body.popup-mode .content-area {
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
padding: 0; padding: 0;
width: 100%;
box-sizing: border-box;
} }
.help-content { .help-content {
padding: 14px 16px 40px; padding: 14px 14px 40px;
flex: 1; flex: 1;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
word-break: break-word; word-break: break-word;
width: 100%;
max-width: 100%;
box-sizing: border-box;
} }
.help-content pre, .help-content code, .help-content table { .help-content pre, .help-content code, .help-content table {
max-width: 100%; max-width: 100%;
@@ -6481,14 +6491,28 @@ body.popup-mode .content-area {
flex-direction: column; flex-direction: column;
gap: 16px; gap: 16px;
min-width: 0; min-width: 0;
width: 100%;
box-sizing: border-box;
padding: 20px 16px;
}
.help-hero-copy {
min-width: 0;
width: 100%;
} }
.help-hero-copy { min-width: 0; }
.help-badges { .help-badges {
flex-wrap: wrap; flex-wrap: wrap;
gap: 6px; gap: 6px;
} }
.help-badge {
white-space: normal;
}
.help-hero-visual { display: none; } .help-hero-visual { display: none; }
.help-section { padding: 20px 0 16px; min-width: 0; } .help-section {
padding: 20px 0 16px;
min-width: 0;
width: 100%;
box-sizing: border-box;
}
.help-nav-link { .help-nav-link {
padding: 10px 12px; padding: 10px 12px;
font-size: 0.88rem; font-size: 0.88rem;