fix(listview): fix search input clipping and match antd option height

Remove overflow:hidden from PanelContainer so the Input focus ring
is not clipped at the panel boundary.

Set OptionItem line-height to theme.lineHeight and derive the vertical
padding from antd's exact formula (controlHeight - fontSize * lineHeight) / 2,
matching the height of antd Select dropdown options in Explore.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
kasiazjc
2026-05-20 14:55:46 +00:00
committed by Amin Ghadersohi
parent ade1a0e5e2
commit 94aa03bd3d

View File

@@ -57,7 +57,6 @@ const PanelContainer = styled.div`
display: flex;
flex-direction: column;
border-radius: ${theme.borderRadiusLG}px;
overflow: hidden;
background: ${theme.colorBgElevated};
box-shadow: ${theme.boxShadowSecondary};
padding: 0 0 ${theme.paddingXXS}px;
@@ -86,7 +85,9 @@ const OptionItem = styled.li<{ $active: boolean }>`
display: flex;
align-items: center;
justify-content: space-between;
padding: 5px ${theme.sizeUnit * 3}px;
padding: ${(theme.controlHeight - theme.fontSize * theme.lineHeight) /
2}px ${theme.controlPaddingHorizontal}px;
line-height: ${theme.lineHeight};
cursor: pointer;
font-size: ${theme.fontSize}px;
color: ${theme.colorText};