Merged in feat/LOY-311-New-Avatar-Component (pull request #2694)

Feat(LOY-311) Create avatar design system component

* feat(LOY-311): Creat & use New Avatar Design System Component

* refactor(LOY-311): replace avatar used in app header with design system component

* fix(LOY-311): use correct space vars


Approved-by: Erik Tiekstra

apps/scandic-web/components/Blocks/DynamicContent/Overview/index.tsx

@@ -16,6 +16,7 @@ import Hero from "./Friend/Hero"
 import MembershipNumber from "./Friend/MembershipNumber"
 import Friend from "./Friend"
 import Stats from "./Stats"
+import UserBaseInfo from "./UserBaseInfo"
 
 import styles from "./overview.module.css"
 
@@ -57,6 +58,8 @@ export default async function Overview({
           </>
         </TeamMemberCardTrigger>
       </DigitalTeamMemberCard>
+      {env.ENABLE_NEW_OVERVIEW_SECTION ? <UserBaseInfo user={user} /> : null}
+      {/*TODO: Replace Hero Section Cards with New ones. */}
       <Hero color="red">
         <Friend membership={user.membership} name={user.name}>
           <MembershipNumber color="burgundy" membership={user.membership} />