@lunit/oui/dist/components/ProductLabel/ProductLabel.styled.js

Lunit Oncology UI components

import { styled, Typography, Box, Dialog, DialogContent } from '@mui/material';
import { Button } from '../Button';
export const ProductName = styled(Typography)(({ theme }) => ({
    ...theme.typography.body_b1,
    marginBottom: '12px',
}));
export const LabelRow = styled(Box)({
    display: 'flex',
    flexDirection: 'row',
    marginBottom: 12,
    alignItems: 'flex-start',
});
export const LabelColumn = styled(Box)({ flex: 0 });
export const LabelValue = styled(Box)({
    flex: 1,
    marginLeft: 16,
});
export const FramedText = styled(Typography)({
    border: '1px solid #000',
    padding: 2,
    fontSize: 12,
    lineHeight: '16px',
    fontWeight: 700,
    wordBreak: 'normal',
});
export const LabelSubBox = styled(Box)({
    marginLeft: '11.5px',
    marginBottom: '4px',
});
export const LabelContainer = styled(Dialog)({
    '& .MuiPaper-root': {
        width: 540,
        backgroundColor: '#fff',
        border: '2px solid #000',
        borderRadius: '8px',
        padding: 0,
    },
});
export const LabelContent = styled(DialogContent)(({ theme }) => ({
    padding: '30px',
    color: theme.palette.neutralGrey[90],
}));
export const LabelCloseButton = styled(Button)({
    position: 'absolute',
    right: '30px',
    top: '30px',
    padding: 0,
    color: '#4E4E50',
    '&:hover': {
        backgroundColor: 'transparent',
    },
});