diff --git a/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.css.ts b/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.css.ts index 66a268028923..8550d211f92b 100644 --- a/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.css.ts +++ b/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.css.ts @@ -46,3 +46,7 @@ export const yearSelectContainer = style({ md: { width: '204px' }, }), }) + +export const noWrap = style({ + flexWrap: 'nowrap', +}) diff --git a/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.tsx b/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.tsx index 143a47f3b0de..2dfab0c78d4e 100644 --- a/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.tsx +++ b/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculator.tsx @@ -50,6 +50,7 @@ import { GET_ORGANIZATION_PAGE_QUERY, GET_ORGANIZATION_QUERY, } from '../../queries' +import { PensionCalculatorTitle } from './PensionCalculatorTitle' import { PensionCalculatorWrapper } from './PensionCalculatorWrapper' import { translationStrings } from './translationStrings' import { @@ -554,16 +555,12 @@ const PensionCalculator: CustomScreen = ({ > - {isNewSystemActive && ( - - {title}
{titlePostfix}
-
- )} - {!isNewSystemActive && ( - - {title} {titlePostfix} - - )} + {formatMessage(translationStrings.isTurnedOff)}
@@ -584,16 +581,12 @@ const PensionCalculator: CustomScreen = ({ - {isNewSystemActive && ( - - {title}
{titlePostfix}
-
- )} - {!isNewSystemActive && ( - - {title} {titlePostfix} - - )} +
= ({ > - {isNewSystemActive && ( - - {title}
{titlePostfix}
-
- )} - {!isNewSystemActive && ( - - {title} {titlePostfix} - - )} + {formatMessage(translationStrings.isTurnedOff)} @@ -391,16 +388,12 @@ const PensionCalculatorResults: CustomScreen = ({ - {isNewSystemActive && ( - - {title}
{titlePostfix}
-
- )} - {!isNewSystemActive && ( - - {title} {titlePostfix} - - )} + {formatMessage( diff --git a/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculatorTitle.tsx b/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculatorTitle.tsx new file mode 100644 index 000000000000..4a61eb3b61fb --- /dev/null +++ b/apps/web/screens/Organization/SocialInsuranceAdministration/PensionCalculatorTitle.tsx @@ -0,0 +1,45 @@ +import { useIntl } from 'react-intl' + +import { GridColumn, GridRow, Text } from '@island.is/island-ui/core' + +import { translationStrings } from './translationStrings' +import * as styles from './PensionCalculator.css' + +interface PensionCalculatorTitleProps { + isNewSystemActive: boolean + title: string + titlePostfix: string + titleVariant: 'h1' | 'h2' +} + +export const PensionCalculatorTitle = ({ + isNewSystemActive, + title, + titlePostfix, + titleVariant, +}: PensionCalculatorTitleProps) => { + const { formatMessage } = useIntl() + if (isNewSystemActive) + return ( + + + + + + + {title}
{titlePostfix}
+
+
+
+ ) + return ( + + {title} {titlePostfix} + + ) +} diff --git a/apps/web/screens/Organization/SocialInsuranceAdministration/translationStrings.ts b/apps/web/screens/Organization/SocialInsuranceAdministration/translationStrings.ts index 8a273868f14b..89f5b13b9202 100644 --- a/apps/web/screens/Organization/SocialInsuranceAdministration/translationStrings.ts +++ b/apps/web/screens/Organization/SocialInsuranceAdministration/translationStrings.ts @@ -625,6 +625,13 @@ export const translationStrings = defineMessages({ defaultMessage: 'Eftir 1. september 2025', description: 'Eftir 1. september 2025', }, + after1stSeptember2025IconUrl: { + id: 'web.pensionCalculator:after1stSeptember2025IconUrl', + defaultMessage: + 'https://images.ctfassets.net/8k0h54kbe6bj/5RIwKVet87Nm4ycltkzjnX/9c594855a9b2f90dde63766ee87a09ca/58dd40fbf365769d984be22a9b64bc29.png', + description: + 'Mynd vinstra megin við titil "Reiknivél örorku- og endurhæfingargreiðslna eftir 1. september 2025"', + }, after1stSeptember2025Calculate: { id: 'web.pensionCalculator:after1stSeptember2025Calculate', defaultMessage: 'Reikna',