Skip to content

Commit cade9ca

Browse files
authored
fix(stories): remove header scrollbar (#95175)
Fixes overflow issue in stories header. Also tweaks the sidebar scrollbar for better visuals. **Before** <img width="844" alt="header-before" src="https://github.com/user-attachments/assets/6dc701ea-abd3-46c1-af36-1b437c50b896" /> <img width="273" alt="scroll-after" src="https://github.com/user-attachments/assets/523cfa94-d3ef-4a58-8433-7764cd7047db" /> **After** <img width="835" alt="header-after" src="https://github.com/user-attachments/assets/09e391cf-2635-4535-9634-08f5de5e610f" /> <img width="273" alt="scroll-after" src="https://github.com/user-attachments/assets/16f60f29-bb31-4c9f-9ab6-e6a00dc77728" />
1 parent 9365812 commit cade9ca

File tree

2 files changed

+2
-2
lines changed

2 files changed

+2
-2
lines changed

static/app/stories/view/storyExports.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -181,8 +181,6 @@ const StoryContainer = styled('div')`
181181
flex-direction: column;
182182
gap: ${space(4)};
183183
padding-inline: ${space(2)};
184-
overflow-y: auto;
185-
height: 100%;
186184
`;
187185

188186
const StoryContent = styled('main')`

static/app/stories/view/storySidebar.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,8 @@ const SidebarContainer = styled('nav')`
8383
width: 256px;
8484
background: ${p => p.theme.tokens.background.primary};
8585
overflow-y: auto;
86+
scrollbar-width: thin;
87+
scrollbar-color: ${p => p.theme.tokens.border.primary} ${p => p.theme.background};
8688
ul,
8789
li {
8890
list-style: none;

0 commit comments

Comments
 (0)