jprdonnelly/nebula.js
1
0
Fork 0
mirror of https://github.com/qlik-oss/nebula.js.git synced 2026-05-26 13:00:24 -04:00
Code Issues Projects Releases Wiki Activity

fix: add box-shadow to scrollbar when focus (#1234)

Browse Source
This commit is contained in:
Daniel Sjöstrand
2023-04-24 14:08:21 +02:00
committed by GitHub
parent 564336231a
commit 0cea2be537
1 changed files with 6 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
apis/nucleus/src/components/listbox/ListBoxInline.jsx
View File

@@ -31,8 +31,8 @@ const classes = {
listboxWrapper: `${PREFIX}-listboxWrapper`,
};
const StyledGrid = styled(Grid, { shouldForwardProp: (p) => !['containerPadding'].includes(p) })(
({ theme, containerPadding }) => ({
const StyledGrid = styled(Grid, { shouldForwardProp: (p) => !['containerPadding', 'isGridMode'].includes(p) })(
({ theme, containerPadding, isGridMode }) => ({
backgroundColor: theme.listBox?.backgroundColor ?? theme.palette.background.default,
[`& .${classes.listBoxHeader}`]: {
alignSelf: 'center',
@@ -50,6 +50,9 @@ const StyledGrid = styled(Grid, { shouldForwardProp: (p) => !['containerPadding'
'&:focus': {
boxShadow: `inset 0 0 0 2px ${theme.palette.custom.focusBorder} !important`,
},
'&:focus ::-webkit-scrollbar-track': {
boxShadow: !isGridMode ? 'inset -2px -2px 0px #3F8AB3' : undefined,
},
'&:focus-visible': {
outline: 'none',
},
@@ -326,6 +329,7 @@ function ListBoxInline({ options, layout }) {
containerRef.current = el;
containerRectRef(el);
}}
isGridMode={isGridMode}
>
{showToolbarWithTitle && (
<Grid