address comments

Opentrons · Aug 9, 2024 · 01288df · 01288df
1 parent 1ec61f1
commit 01288df
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 4 deletions.
diff --git a/components/src/atoms/ListItem/ListItemChildren/ListItemDescriptor.tsx b/components/src/atoms/ListItem/ListItemChildren/ListItemDescriptor.tsx
@@ -1,6 +1,10 @@
 import * as React from 'react'
 import { Flex } from '../../../primitives'
-import { DIRECTION_ROW, JUSTIFY_SPACE_BETWEEN } from '../../../styles'
+import {
+  DIRECTION_ROW,
+  FLEX_AUTO,
+  JUSTIFY_SPACE_BETWEEN,
+} from '../../../styles'
 import { SPACING } from '../../../ui-style-constants'
 
 interface ListItemDescriptorProps {
@@ -21,11 +25,11 @@ export const ListItemDescriptor = (
       justifyContent={type === 'mini' ? JUSTIFY_SPACE_BETWEEN : 'none'}
       padding={
         type === 'mini'
-          ? `${SPACING.spacing8} ${SPACING.spacing4}`
+          ? `${SPACING.spacing4} ${SPACING.spacing8}`
           : SPACING.spacing12
       }
     >
-      <Flex width={type === 'mini' ? 'auto' : '30%'}>{description}</Flex>
+      <Flex width={type === 'mini' ? FLEX_AUTO : '30%'}>{description}</Flex>
       {content}
     </Flex>
   )

diff --git a/components/src/atoms/ListItem/index.tsx b/components/src/atoms/ListItem/index.tsx
@@ -3,6 +3,7 @@ import { css } from 'styled-components'
 import { Flex } from '../../primitives'
 import { RESPONSIVENESS, SPACING } from '../../ui-style-constants'
 import { BORDERS, COLORS } from '../../helix-design-system'
+import { FLEX_MAX_CONTENT } from '../../styles'
 import type { StyleProps } from '../../primitives'
 
 export type ListItemType = 'error' | 'noActive' | 'success' | 'warning'
@@ -43,7 +44,7 @@ export function ListItem(props: ListItemProps): JSX.Element {
   const LIST_ITEM_STYLE = css`
     background-color: ${listItemProps.backgroundColor};
     width: 100%;
-    height: max-content;
+    height: ${FLEX_MAX_CONTENT};
     padding: 0;
     border-radius: ${BORDERS.borderRadius4};