diff --git a/frontend/src/components/Pages/InspectionReportPage/InspectionOverview.tsx b/frontend/src/components/Pages/InspectionReportPage/InspectionOverview.tsx index 13c60696..83124011 100644 --- a/frontend/src/components/Pages/InspectionReportPage/InspectionOverview.tsx +++ b/frontend/src/components/Pages/InspectionReportPage/InspectionOverview.tsx @@ -7,7 +7,8 @@ import { StyledInspectionCards, StyledInspectionContent, StyledInspectionData, - StyledSection, + StyledInspectionOverviewDialogView, + StyledInspectionOverviewSection, } from './InspectionStyles' import { Typography } from '@equinor/eds-core-react' import { GetInspectionImage } from './InspectionReportUtilities' @@ -59,31 +60,17 @@ export const InspectionOverviewSection = ({ tasks }: { tasks: Task[] }) => { const { TranslateText } = useLanguageContext() return ( - + {TranslateText('Last completed inspection')} - + ) } export const InspectionOverviewDialogView = ({ tasks }: { tasks: Task[] }) => { return ( - + - + ) } diff --git a/frontend/src/components/Pages/InspectionReportPage/InspectionStyles.tsx b/frontend/src/components/Pages/InspectionReportPage/InspectionStyles.tsx index 2d15a5f5..97d1bece 100644 --- a/frontend/src/components/Pages/InspectionReportPage/InspectionStyles.tsx +++ b/frontend/src/components/Pages/InspectionReportPage/InspectionStyles.tsx @@ -60,7 +60,7 @@ export const StyledInfoContent = styled.div` align-items: flex-start; ` -export const StyledSection = styled.div` +export const StyledInspectionOverviewSection = styled.div` display: flex; padding: 24px; min-width: 240px; @@ -68,8 +68,17 @@ export const StyledSection = styled.div` align-items: flex-start; gap: 8px; border-radius: 6px; - border: 1.194px solid ${tokens.colors.ui.background__medium.hex}; + border: 1px solid ${tokens.colors.ui.background__medium.hex}; background: ${tokens.colors.ui.background__default.hex}; +` + +export const StyledInspectionOverviewDialogView = styled.div` + display: flex; + max-height: 60vh; + width: 350px; + flex-direction: column; + align-items: flex-start; + gap: 8px; overflow-y: scroll; `