Skip to content

Commit d272db4

Browse files
docs: fix homepage text wrapping — widen splash container
The shared theme's --sl-content-width (50rem/800px) is too narrow for the splash page feature sections which use side-by-side layouts with wide ASCII terminal art. The terminal tables blow out the flex layout and crush the text column to near-zero width. Fix: - Widen the splash page container to 68rem (~1088px) matching production - Add overflow: hidden + min-width: 0 on .feature-visual to prevent terminal content from expanding the flex item beyond 55%
1 parent 18c5cfc commit d272db4

1 file changed

Lines changed: 7 additions & 2 deletions

File tree

docs/src/styles/cli.css

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -141,9 +141,12 @@
141141
text-decoration: none;
142142
}
143143

144-
/* Stack container - page layout for splash */
144+
/* Stack container - page layout for splash.
145+
The splash page needs a wider container than the default
146+
--sl-content-width (50rem / 800px) because the feature sections
147+
use a side-by-side layout with wide terminal ASCII art. */
145148
[data-page-type="splash"] .sl-container {
146-
max-width: var(--sl-content-width);
149+
max-width: 68rem;
147150
margin: 0 auto;
148151
padding: 0 1.5rem;
149152
}
@@ -210,6 +213,7 @@
210213

211214
.feature-visual {
212215
flex: 0 0 55%;
216+
min-width: 0;
213217
min-height: 420px;
214218
margin: 0.5rem 0.75rem 0.75rem 0;
215219
padding: 10%;
@@ -221,6 +225,7 @@
221225
align-items: center;
222226
justify-content: center;
223227
box-sizing: border-box;
228+
overflow: hidden;
224229
}
225230

226231
.feature-section-inner.reverse .feature-visual {

0 commit comments

Comments
 (0)