diff --git a/app/src/atoms/Modal/ModalHeader.tsx b/app/src/atoms/Modal/ModalHeader.tsx index 5eb6a701341f..d16e67cf0615 100644 --- a/app/src/atoms/Modal/ModalHeader.tsx +++ b/app/src/atoms/Modal/ModalHeader.tsx @@ -8,6 +8,7 @@ import { ALIGN_CENTER, JUSTIFY_SPACE_BETWEEN, SPACING, + JUSTIFY_CENTER, } from '@opentrons/components' import { StyledText } from '../text' @@ -23,9 +24,9 @@ export interface ModalHeaderProps { const closeIconStyles = css` display: flex; - justify-content: center; - align-items: center; - border-radius: 14px; + justify-content: ${JUSTIFY_CENTER}; + align-items: ${ALIGN_CENTER}; + border-radius: 0.875rem; width: ${SPACING.spacingL}; height: ${SPACING.spacingL}; &:hover { @@ -64,7 +65,7 @@ export const ModalHeader = (props: ModalHeaderProps): JSX.Element => { }`} > diff --git a/app/src/atoms/Modal/index.tsx b/app/src/atoms/Modal/index.tsx index 87efd3fe1272..efd09aa28e21 100644 --- a/app/src/atoms/Modal/index.tsx +++ b/app/src/atoms/Modal/index.tsx @@ -3,7 +3,6 @@ import { css } from 'styled-components' import { Btn, Icon, - Box, BaseModal, BaseModalProps, TYPOGRAPHY, @@ -15,11 +14,8 @@ import { BORDERS, } from '@opentrons/components' -import { useFeatureFlag } from '../../redux/config' import { StyledText } from '../text' import { Divider } from '../structure' -import { ModalShell } from './ModalShell' -import { ModalHeader } from './ModalHeader' import type { IconProps } from '@opentrons/components' type ModalType = 'info' | 'warning' | 'error' @@ -61,7 +57,6 @@ export const Modal = (props: ModalProps): JSX.Element => { children, maxHeight, } = props - const liquidSetupEnabled = useFeatureFlag('enableLiquidSetup') const defaultHeader = title != null ? ( <> @@ -103,41 +98,8 @@ export const Modal = (props: ModalProps): JSX.Element => { ) : null - const modalHeader = ( - - ) - return liquidSetupEnabled ? ( - - - {children} - - - ) : ( + return (