styles(autofix): Use scraps to layout explorer seer drawer #106294
Conversation
Remove use of styled to create layouts in the explorer seer drawer.
github-actions
bot
added
the
Scope: Frontend
![sentry[bot]](https://avatars.githubusercontent.com/in/12637?s=60&v=4){kind=small}
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
| <IconSeer animation={iconAnimation} size="md" /> | ||
| </HeaderContainer> | ||
| <ButtonWrapper> | ||
| <SeerDrawerNavigatorContainer justify="between" padding="sm 2xl"> |
There was a problem hiding this comment.
Navigator missing vertical alignment and background styling
Medium Severity
The SeerDrawerNavigatorContainer is missing align="center" and background="primary" props that were present in the original styled component. Without align="center", the header text/icon and button groups won't be vertically centered. Without background="primary", the navigator section will lack its intended background color and may appear transparent or blend incorrectly with surrounding content.
Additional Locations (1)
| <NavigationBreadcrumbs crumbs={breadcrumbs} /> | ||
| </DrawerHeader> | ||
| ); | ||
| } |
There was a problem hiding this comment.
Drawer header missing position and border style overrides
Medium Severity
The new SeerDrawerHeader function component wraps DrawerHeader without the style overrides that were present in the original styled component. The old version set position: unset, box-shadow: none, max-height, and border-bottom. Without these overrides, the header will now have sticky positioning (causing it to stick when scrolling), display an unwanted box-shadow, lack the intended border-bottom, and have no height constraint.
| <Placeholder height="10rem" /> | ||
| <Placeholder height="15rem" /> | ||
| </PlaceholderStack> | ||
| </Stack> |
There was a problem hiding this comment.
Loading state Stack missing top margin spacing
Low Severity
The Stack component used in the loading state is missing marginTop="xl" that was present in the original PlaceholderStack styled component. This will cause the placeholder content to appear closer to the navigator section above, reducing the visual spacing during the loading state.
roaga
left a comment
roaga
left a comment
There was a problem hiding this comment.
I think this is causing some weird background and border colors?
Remove use of styled to create layouts in the explorer seer drawer.