fix(homepage): set fixed width for learning panel to prevent layout shift
Changed the "What You'll Learn" panel from maxW to a fixed width (420px) on desktop screens to prevent it from shifting when switching between tutorials with different text lengths. Also added minW: '0' to the tutorial panel to allow proper flex shrinking. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -163,7 +163,7 @@ export default function HomePage() {
|
||||
})}
|
||||
>
|
||||
{/* Tutorial on the left */}
|
||||
<div className={css({ flex: '1' })}>
|
||||
<div className={css({ flex: '1', minW: '0' })}>
|
||||
<TutorialPlayer
|
||||
key={selectedTutorial.id}
|
||||
tutorial={selectedTutorial}
|
||||
@@ -181,8 +181,7 @@ export default function HomePage() {
|
||||
<div
|
||||
className={css({
|
||||
flex: '0 0 auto',
|
||||
minW: '340px',
|
||||
maxW: { base: '100%', md: '420px' },
|
||||
w: { base: '100%', md: '420px' },
|
||||
})}
|
||||
>
|
||||
<h3
|
||||
|
||||
Reference in New Issue
Block a user