diff --git a/packages/documentation/.storybook/blocks/footer.tsx b/packages/documentation/.storybook/blocks/footer.tsx index a64503e76b..24b9c5d6eb 100644 --- a/packages/documentation/.storybook/blocks/footer.tsx +++ b/packages/documentation/.storybook/blocks/footer.tsx @@ -1,15 +1,15 @@ import React from 'react'; -interface Developer { +interface ITeamMember { name: string; title: string; avatar: string; } -const DEVELOPERS: Developer[] = [ +const TEAM_MEMBERS: ITeamMember[] = [ { name: 'Philipp Gfeller', - title: 'Lead UI Developer', + title: 'Lead Potato', avatar: 'https://avatars.githubusercontent.com/u/1659006?v=4', }, { @@ -19,9 +19,54 @@ const DEVELOPERS: Developer[] = [ }, { name: 'Oliver Schürch', - title: 'UI Developer', + title: 'Señor Developer', avatar: 'https://avatars.githubusercontent.com/u/9716662?v=4', }, + { + name: 'Myrta Sakellariou', + title: 'UI Developer', + avatar: 'https://avatars.githubusercontent.com/u/66249294?v=4', + }, + { + name: 'Lea Gardavaud', + title: 'UI Developer', + avatar: 'https://avatars.githubusercontent.com/u/183501002?v=4', + }, + { + name: 'Alona Zherdetska', + title: 'Cookie Master', + avatar: 'https://avatars.githubusercontent.com/u/138328641?v=4', + }, + { + name: 'Tim Schär', + title: 'UI Developer', + avatar: 'https://avatars.githubusercontent.com/u/59233938?v=4', + }, + { + name: 'Rouven Steiger', + title: 'Art Guy EDK', + avatar: 'https://avatars.githubusercontent.com/u/104423005?v=4', + }, + { + name: 'Christian Zundel', + title: 'UX Designer', + avatar: 'https://avatars.githubusercontent.com/u/119845956?v=4', + }, + { + name: 'Alessio Travaglini', + title: 'Token Orchestrator', + avatar: 'https://avatars.githubusercontent.com/u/158268546?v=4', + }, + { + name: 'Sandra Hohl', + title: 'UX Designer', + avatar: 'https://avatars.githubusercontent.com/u/175929675?v=4', + }, + { + name: 'Romain Veya', + title: 'UI Developer', + avatar: 'https://avatars.githubusercontent.com/u/111903046?v=4', + }, ]; const BASEURL = 'https://github.com/swisspost/design-system/tree/main/packages/documentation'; @@ -43,16 +88,16 @@ export default (params: { pathToStoryFile?: String }) => (
-

Support

-
- {DEVELOPERS.sort(() => (Math.random() > 0.5 ? 1 : -1)).map((developer, index) => ( +

Design System Team Members

+
+ {TEAM_MEMBERS.sort(() => (Math.random() > 0.5 ? 1 : -1)).map((developer, index) => (

- {developer.name} + {developer.title}

-

{developer.title}

+

{developer.name}

))} diff --git a/packages/documentation/.storybook/blocks/layout/layout.scss b/packages/documentation/.storybook/blocks/layout/layout.scss index 9e4525f84a..a1f8ea0bf8 100644 --- a/packages/documentation/.storybook/blocks/layout/layout.scss +++ b/packages/documentation/.storybook/blocks/layout/layout.scss @@ -42,15 +42,21 @@ .docs-footer { .avatar { display: flex; - align-items: flex-start; + align-items: center; p { - margin-bottom: 0.25rem; + font-size: 1rem; + line-height: 1; + + &:first-child { + font-size: 0.85rem; + margin-bottom: 0.25rem; + } } } .profile-picture { - width: 5rem; + width: 4rem; border-radius: 50%; margin-right: 1rem; }