From 5a2092962cb3740b2e4a613550c1034be66bf4b2 Mon Sep 17 00:00:00 2001 From: janrembold Date: Tue, 20 Feb 2024 11:02:54 +0100 Subject: [PATCH 1/8] fix: decode logo string --- src/utils/useTenantTheming.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/utils/useTenantTheming.ts b/src/utils/useTenantTheming.ts index 131355801..a7528a47c 100644 --- a/src/utils/useTenantTheming.ts +++ b/src/utils/useTenantTheming.ts @@ -239,6 +239,9 @@ const useTenantTheming = () => { const decodedTenant = JSON.parse(JSON.stringify(tenant)); decodedTenant.theming.logo = decodeHTML(tenant.theming.logo); + decodedTenant.theming.associationLogo = decodeHTML( + tenant.theming.associationLogo + ); decodedTenant.theming.favicon = decodeHTML( tenant.theming.favicon ); From 4c7366c56fc80860664a766fcf84a649a20b0f29 Mon Sep 17 00:00:00 2001 From: janrembold Date: Tue, 20 Feb 2024 11:03:33 +0100 Subject: [PATCH 2/8] feat: add associationLogo to types --- src/globalState/interfaces/TenantDataInterface.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/globalState/interfaces/TenantDataInterface.ts b/src/globalState/interfaces/TenantDataInterface.ts index d2b993e52..b36e27040 100644 --- a/src/globalState/interfaces/TenantDataInterface.ts +++ b/src/globalState/interfaces/TenantDataInterface.ts @@ -3,6 +3,7 @@ export interface TenantDataInterface { name: string; theming: { logo: string; + associationLogo: string | null; favicon: string; primaryColor: string; secondaryColor: string; From f695729abe259a16fcba5723142c6ce75dcb2f96 Mon Sep 17 00:00:00 2001 From: janrembold Date: Wed, 21 Feb 2024 10:48:13 +0100 Subject: [PATCH 3/8] feat: add agency logo type --- src/globalState/interfaces/UserDataInterface.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/globalState/interfaces/UserDataInterface.ts b/src/globalState/interfaces/UserDataInterface.ts index 944d03496..60b688afc 100644 --- a/src/globalState/interfaces/UserDataInterface.ts +++ b/src/globalState/interfaces/UserDataInterface.ts @@ -53,6 +53,7 @@ export interface AgencyDataInterface { agencySpecificPrivacy?: string; consultingTypeRel?: ConsultingTypeInterface; topicIds?: number[]; + agencyLogo?: string | null; } export interface ConsultingTypeDataInterface { From 55a602edf41bb1dd399af154e0459dc318858b59 Mon Sep 17 00:00:00 2001 From: janrembold Date: Wed, 21 Feb 2024 10:50:14 +0100 Subject: [PATCH 4/8] refactor: boyscout class name with clsx --- .../components/ProposedAgencies/ProposedAgencies.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/src/containers/registration/components/ProposedAgencies/ProposedAgencies.tsx b/src/containers/registration/components/ProposedAgencies/ProposedAgencies.tsx index d1763000b..9aa2e8e61 100644 --- a/src/containers/registration/components/ProposedAgencies/ProposedAgencies.tsx +++ b/src/containers/registration/components/ProposedAgencies/ProposedAgencies.tsx @@ -19,6 +19,7 @@ import { useTranslation } from 'react-i18next'; import { PreselectedAgency } from '../PreSelectedAgency/PreselectedAgency'; import { FormAccordionData } from '../../../../components/registration/RegistrationForm'; import { UrlParamsContext } from '../../../../globalState/provider/UrlParamsProvider'; +import clsx from 'clsx'; interface ProposedAgenciesProps { formAccordionData: FormAccordionData; @@ -183,9 +184,9 @@ export const ProposedAgencies = ({ return (
{!autoSelectPostcode && ( )} + {agencySelectionNote && (
)} + {consultingTypes.length > 1 && (
Date: Wed, 21 Feb 2024 10:50:36 +0100 Subject: [PATCH 5/8] feat: add optional agency logo --- .../components/AgencySelection/index.tsx | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/src/containers/registration/components/AgencySelection/index.tsx b/src/containers/registration/components/AgencySelection/index.tsx index 79ebf0910..5fcbc65f8 100644 --- a/src/containers/registration/components/AgencySelection/index.tsx +++ b/src/containers/registration/components/AgencySelection/index.tsx @@ -35,6 +35,7 @@ export const AgencySelection = ({ ns: 'agencies' })} +
- + +
+ {agency.agencyLogo && ( + {t([`agency.${agency.id}.name`, + )} + +
); }; From 25a5921378953b3bd2a027ddba6bdb4f1ccb73ea Mon Sep 17 00:00:00 2001 From: janrembold Date: Wed, 21 Feb 2024 10:50:52 +0100 Subject: [PATCH 6/8] fix: align content in agency selection --- .../components/PostCodeSelection/index.tsx | 12 ++++--- .../proposedAgencies.styles.scss | 36 +++++++++++++++++-- 2 files changed, 40 insertions(+), 8 deletions(-) diff --git a/src/containers/registration/components/PostCodeSelection/index.tsx b/src/containers/registration/components/PostCodeSelection/index.tsx index 5c2e7eaf3..9ba28eb0d 100644 --- a/src/containers/registration/components/PostCodeSelection/index.tsx +++ b/src/containers/registration/components/PostCodeSelection/index.tsx @@ -88,11 +88,13 @@ export const PostCodeSelection = ({ - onChange(e.target.value)} - onKeyDown={(e) => onKeyDown?.(e)} - /> +
+ onChange(e.target.value)} + onKeyDown={(e) => onKeyDown?.(e)} + /> +
); }; diff --git a/src/containers/registration/components/ProposedAgencies/proposedAgencies.styles.scss b/src/containers/registration/components/ProposedAgencies/proposedAgencies.styles.scss index e87764faa..fb653a19d 100644 --- a/src/containers/registration/components/ProposedAgencies/proposedAgencies.styles.scss +++ b/src/containers/registration/components/ProposedAgencies/proposedAgencies.styles.scss @@ -18,6 +18,15 @@ $infoIconSize: 16px; animation: fadeIn linear 0.2s; width: 100%; + .radioButton__label { + padding-left: 16px; + } + + .agencyLanguages { + margin-left: 0; + margin-top: 0; + } + &__intro { > .text__infoLargeAlternative { font-weight: $font-weight-medium; @@ -27,8 +36,8 @@ $infoIconSize: 16px; margin-top: $grid-base; ul { - margin: 0; - padding-left: 15px; + margin: 10px 0 0; + padding-left: 65px; font-size: $font-size-primary; color: $text-high-emphasis; } @@ -44,8 +53,14 @@ $infoIconSize: 16px; } } - .inputField { + &__inputContainer { margin-top: $grid-base-three; + margin-left: 44px; + + .inputField { + margin-top: 0; + margin-left: 0; + } } &__note { @@ -106,6 +121,21 @@ $infoIconSize: 16px; &__container { display: flex; } + + &__content { + display: flex; + flex-direction: row; + justify-content: flex-start; + margin-left: 44px; + } + + &__logo { + max-width: 60px; + max-height: 60px; + margin-right: 16px; + object-fit: contain; + object-position: center left; + } } h5 { From 290d35e41e9da7c0041a1b46641f186b6ec31a0a Mon Sep 17 00:00:00 2001 From: janrembold Date: Wed, 21 Feb 2024 13:28:15 +0100 Subject: [PATCH 7/8] feat: add association logo --- src/components/header/Header.tsx | 19 +++++++++++++++---- src/components/header/header.styles.scss | 8 ++++++++ 2 files changed, 23 insertions(+), 4 deletions(-) diff --git a/src/components/header/Header.tsx b/src/components/header/Header.tsx index 803269a5a..53001fc40 100644 --- a/src/components/header/Header.tsx +++ b/src/components/header/Header.tsx @@ -10,6 +10,9 @@ import { LocaleSwitch } from '../localeSwitch/LocaleSwitch'; export const Header = ({ showLocaleSwitch = false }) => { const { t: translate } = useTranslation(); const { tenant } = useContext(TenantContext); + const hasAssociationLogo = !!tenant?.theming.associationLogo; + + console.log({ tenant }); return (
@@ -18,10 +21,18 @@ export const Header = ({ showLocaleSwitch = false }) => { text={tenant?.name || translate('app.title')} />
- + {hasAssociationLogo ? ( + {`Logo + ) : ( + + )} {showLocaleSwitch && }
diff --git a/src/components/header/header.styles.scss b/src/components/header/header.styles.scss index 53f904ff1..cb5c604a0 100644 --- a/src/components/header/header.styles.scss +++ b/src/components/header/header.styles.scss @@ -24,4 +24,12 @@ display: flex; align-items: center; } + + &__logo { + max-width: 240px; + max-height: 60px; + object-fit: contain; + object-position: center right; + margin-right: 10px; + } } From 50d3eba022bde114109da8602ada5cbf8efd4f55 Mon Sep 17 00:00:00 2001 From: janrembold Date: Wed, 21 Feb 2024 13:42:15 +0100 Subject: [PATCH 8/8] chore: remove log --- src/components/header/Header.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/components/header/Header.tsx b/src/components/header/Header.tsx index 53001fc40..8ff3ebb76 100644 --- a/src/components/header/Header.tsx +++ b/src/components/header/Header.tsx @@ -12,8 +12,6 @@ export const Header = ({ showLocaleSwitch = false }) => { const { tenant } = useContext(TenantContext); const hasAssociationLogo = !!tenant?.theming.associationLogo; - console.log({ tenant }); - return (