Giorgio Gilestro
8ec4ea1c72
User reported the page rendering at ~3x viewport width on Android Chrome with overflow-x:hidden clipping off most of the content. Root cause: CSS grid items default to min-width:min-content, and the indicator table inside the indicators panel has white-space:nowrap cells. A long Symbol/Label value forces the table wider than its panel; the panel propagates that minimum width up the grid; the grid expands the .app-main; .app-main pushes the page wider than the viewport. overflow-x:hidden then just chops the right portion off. Fix has three parts: 1. .app and .app-main get min-width:0 and max-width:100vw so the shell can't be wider than the viewport regardless of descendants. 2. Every direct child of .app-main (each panel) gets min-width:0 on mobile so individual panels can shrink past their min-content. 3. table.dense drops white-space:nowrap on text cells at ≤480px — long symbols wrap to two lines instead of forcing the table wide. Numeric cells keep nowrap (negative percentages reading as "−12\n.34%" would be unreadable). Also adds an overflow-x:auto fallback on .panel-body pre/code so any code block in AI output scrolls within the panel instead of blowing the page out. |
||
|---|---|---|
| .. | ||
| css | ||
| images | ||
| js | ||