Skip to content

Commit

Permalink
fix(app): fix scrollbar style on LPC results table on ODD
Browse files Browse the repository at this point in the history
Only show scrollbar if content exceeds container. Style scrollbar to be consistent with other
designs.
  • Loading branch information
ncdiehl11 committed May 10, 2024
1 parent a78ea71 commit 81ceb99
Showing 1 changed file with 13 additions and 2 deletions.
15 changes: 13 additions & 2 deletions app/src/organisms/LabwarePositionCheck/ResultsSummary.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import * as React from 'react'
import styled from 'styled-components'
import styled, { css } from 'styled-components'
import { useSelector } from 'react-redux'
import isEqual from 'lodash/isEqual'
import { useTranslation } from 'react-i18next'
Expand All @@ -25,6 +25,7 @@ import {
JUSTIFY_SPACE_BETWEEN,
LocationIcon,
MODULE_ICON_NAME_BY_TYPE,
OVERFLOW_AUTO,
PrimaryButton,
RESPONSIVENESS,
SPACING,
Expand Down Expand Up @@ -155,7 +156,17 @@ export const ResultsSummary = (
<Flex
flexDirection={DIRECTION_COLUMN}
maxHeight="20rem"
overflowY="scroll"
css={css`
overflow-y: ${OVERFLOW_AUTO};
&::-webkit-scrollbar {
width: 0.75rem;
background-color: transparent;
}
&::-webkit-scrollbar-thumb {
background: ${COLORS.grey50};
border-radius: 11px;
}
`}
>
<Header>{t('new_labware_offset_data')}</Header>
{isLabwareOffsetCodeSnippetsOn ? (
Expand Down

0 comments on commit 81ceb99

Please sign in to comment.