feature(website): initial version of our-work page

shared/locales/de/website-common.json

@@ -8,13 +8,15 @@
 		"how-it-works-description": "Untertitel...",
 		"contributors": "Spender:innen",
 		"contributors-description": "Wer ist dabei?",
-
+		"recipients": "Empfänger:innen",
+		"recipients-description": "Subtitle...",
+		"whats-next": "Was kommt als nächstes?",
+		"whats-next-description": "Subtitle...",
 		"transparency": "Transparenz",
 		"finances": "Finanzen",
 		"finances-description": "Untertitel...",
 		"recipient-selection": "Selektion der Empfänger:innen",
 		"recipient-selection-description": "Untertitel...",
-
 		"my-profile": "Mein Profil"
 	}
 }

shared/locales/de/website-our-work.json

@@ -1,11 +1,88 @@
 {
-	"section-our-work": {
+	"our-work": {
 		"title-1": "Wir bauen das Fundament für echte Veränderung. ",
 		"title-2": "Zeitgemäss. Digital. Gemeinsam.",
+		"subtitle": "Social Income ist ein neuer Weg, um die Armut im globalen Süden zu bekämpfen. Einfach, effizient und digital.",
 		"vimeo-video-id": "488184818"
 	},
-	"section-how-it-works": {
-		"title": "Ein solidarischer Beitrag, von Mensch zu Mensch. So einfach.",
-		"subtitle": "Mach einen Unterschied in weniger als 1 Minute."
+	"how-it-works": {
+		"header": "So funkioniert's",
+		"title-1": "Ein solidarischer Beitrag, von Mensch zu Mensch. ",
+		"title-2": "So einfach.",
+		"subtitle": "Mach einen Unterschied in weniger als 1 Minute.",
+		"item-1": "Individuelle Beiträge werden zu 100% an Empfänger:innen ausbezahlt",
+		"item-2": "Flexible Zahlungspläne. Modifiziere oder kündige jederzeit",
+		"item-3": "Social Income-Überweisungen werden direkt auf die Mobiltelefone der Empfänger:innen transferiert",
+		"item-4": "Die Höhe des ausbezahlten Betrags basiert auf dem Durchschnittssalär, wo die Empfänger:innen leben."
+	},
+	"contributors": {
+		"header-1": "Spender:innen",
+		"title-1": "Menschen aus allen Lebensschichten leisten einen Beitrag.",
+		"text-1": "Wir erhalten u.a. regelmässige individuelle Spenden von Angestellten aus folgenden Organisationen und Unternehmen:",
+		"header-2": "Wieso Mitmachen?",
+		"title-2": "Ein Ziel. Mehr soziale Gerechtigkeit.",
+		"text-2": "Menschen, die 1% ihres Einkommens an Social Income spenden, haben ganz unterschiedliche Beweggründe:",
+		"portraits": {
+			"carlos": "Wir leben in einer Welt voller Möglichkeiten. Lasst uns dieses Privileg teilen.",
+			"vanja": "Ein grossartiges Beispiel dafür, wie sich Wohlstand umverteilen lässt, basierend auf Solidarität und ermöglicht durch die heutige Technologie.",
+			"ruben": "Ich unterstütze Social Income nicht nur, weil es einfach ist, sondern weil die Forschung gezeigt hat, dass der Ansatz extrem effektiv ist.",
+			"han": "Die Frage ist nicht, warum man sich engagieren sollte, sondern vielmehr, warum man es bleiben lässt. Social Income ist eine dringende Notwendigkeit in unserer Gesellschaft.",
+			"claudia": "Die heutige globale Ungleichheit ist die Folge jahrhundertelanger ungleicher Fortschritte. Social Income ist ein neuer Weg, diese Ungleichheit anzugehen."
+		}
+	},
+	"recipients": {
+		"header": "Empfänger:innen",
+		"title-1": "Wir arbeiten dort, wo wir die grösste Wirkung entfalten können. ",
+		"title-2": "Sierra Leone.",
+		"subtitle": "Seit März 2020, erhalten alle Empfänger:innen in Sierra Leone 30 US Dollar pro Monat, garantiert für drei Jahre.",
+		"our-criteria": "Unsere Kriterien",
+		"item-1": {
+			"title": "Land mit niedrigem Einkommen",
+			"text": "Wir starteten in Sierra Leone, einem der ärmsten Länder der Welt. Hier kann eine kleine Spende viel bewirken.",
+			"caption": "Das Durchschnittseinkommen in Sierra Leone beträgt USD 42.5 pro Monat – Weltbank, 2022 (BNE pro Kopf, Atlas-Methode und Kaufkraftparität)"
+		},
+		"item-2": {
+			"title": "Einkommensschwache Communities",
+			"text": "Für die Auswahl der Empfänger:innen arbeiten wir mit lokalen NGOs zusammen, die besonders marginalisierte Bevölkerungsgruppen unterstützen.",
+			"caption": "Partner: Aurora Foundation, Jamil & Nyanga Jaward Foundation, Reachout Salone, Equal Rights Alliance, Polio B&S Organisation, Freetown City Council"
+		},
+		"item-3": {
+			"title": "Alter und Geschlechterparität",
+			"text": "Die Empfänger:innen müssen älter als 16 Jahre sein. Wir garantieren ausserdem ein ausgeglichenes Geschlechterverhältnis.",
+			"caption": ""
+		},
+		"voices": "Stimmen",
+		"portraits": {
+			"kai": "Ich brauche Social Income um meine Finanzen zu verwalten. Mit der ersten Überweisung konnte ich mir neue Krücken kaufen, die ich seither benutze.",
+			"aminata": "Fürs tägliche Brot zerkleinere ich Steine zu Kies. Es ist harte Arbeit und mit dem Lohn ist es nicht leicht, vier Kinder grosszuziehen. Ich möchte mich für die monatliche Unterstützung bedanken.",
+			"gbassay": "Social Income ermöglichte es mir, Schulmaterial zu kaufen und meine Kinder zur Schule zu schicken. Danke für alles, was ihr getan habt, um zu helfen.",
+			"lamin": "Social Income hilft sowohl mir als auch meiner ganzen Familie.",
+			"onikeh": "Social Income hat mir enorm geholfen. Es dient als Quelle, aus der wir zusätzliche Kraft für unser tägliches Leben schöpfen können. Es ist ein grossartiges Gefühl, dass uns Menschen unterstützen und an unsere Träume glauben.",
+			"neneh": "Ich brauche mein monatliches Social Income um in mein kleines Unternehmen zu investieren und um das Mittagessen an der Schule meiner Kinder zu bezahlen. Es macht mich so glücklich, ich könnte weinen."
+		}
+	},
+	"whats-next": {
+		"header": "Was kommt als Nächstes?",
+		"title-1": "Wir gehen die Dinge ",
+		"title-2": "Schritt für Schritt an.",
+		"subtitle": "Das langfristige Ziel von Social Income besteht darin, für bedürftige Menschen ein globales System der Wohlstands(um)verteilung zu kreieren – basierend auf freiwilligen Spender*innen aus aller Welt. Das Projekt ist ambitioniert. Für die Skalierung braucht es entsprechend Zeit.",
+		"timeline": {
+			"item-1": {
+				"title": "März 2020",
+				"text": "In der Pilotphase zahlten wir die ersten Beiträge an eine kleine Gemeinschaft in Freetown, Sierra Leone."
+			},
+			"item-2": {
+				"title": "September 2021",
+				"text": "In der Entwicklungsphase erhöhten wir die Anzahl der Empfänger:innen und verbesserten den Zahlungsprozess."
+			},
+			"item-3": {
+				"title": "Januar 2022",
+				"text": "Seit Beginn dieses Jahres können wir Social Income kontinuierlich für immer mehr Empfänger:innen und Spender:innen ausrollen."
+			},
+			"item-4": {
+				"title": "Anstehend: Wirkungsmessung",
+				"text": "Um die Wirksamkeit von Social Income messbar zu machen, haben wir eine Methode und eine Reihe an quantitativen und qualitativen Indikatoren entwickelt. Momentan sammeln wir Daten und optimieren unsere Vorgehensweise mit Hilfe der Empfänger:innen."
+			}
+		}
 	}
 }

shared/locales/en/website-common.json

@@ -10,13 +10,13 @@
 		"contributors-description": "Subtitle...",
 		"recipients": "Recipients",
 		"recipients-description": "Subtitle...",
-
+		"whats-next": "What's next?",
+		"whats-next-description": "Subtitle...",
 		"transparency": "Transparency",
 		"finances": "Finanzen",
 		"finances-description": "Subtitle...",
 		"recipient-selection": "Recipient Selection",
 		"recipient-selection-description": "Subtitle...",
-
 		"my-profile": "My Profile"
 	}
 }

shared/locales/en/website-home.json

@@ -136,5 +136,10 @@
 			"description": "Reduce inequality within and among countries.",
 			"paragraph-1": "Reducing inequalities and ensuring that no one is left behind is integral to achieving the Sustainable Development Goals. Despite some positive signs toward reducing inequality in some dimensions (e.g reducing relative income inequality in some countries and preferential trade status benefiting lower-income countries), many inequalities continue to persist or are even increasing."
 		}
+	},
+	"section-7": {
+		"title-1": "We are proud that we’ve been ",
+		"title-2": "recognized.",
+		"subtitle": "Social Income has received funding and support from various accelerator and development programs, including the following organisations:"
 	}
 }

shared/locales/en/website-our-work.json

@@ -1,24 +1,89 @@
 {
-	"section-our-work": {
+	"our-work": {
 		"title-1": "Our work is made possible by you. Make a ",
 		"title-2": "change with us.",
+		"subtitle": "Social Income is a new way to fight poverty in the Global South, creating real change, from human to human.",
 		"vimeo-video-id": "433937157"
 	},
-	"section-how-it-works": {
-		"title": "From you to someone in need. This is solidarity.",
+	"how-it-works": {
+		"header": "How it works",
+		"title-1": "From you to someone in need. ",
+		"title-2": "This is solidarity.",
+		"text": "We are convinced that people in poverty know best how to improve their living conditions.",
 		"subtitle": "Make a difference in under a minute.",
 		"item-1": "100% of individual contributions are paid out to recipients",
 		"item-2": "Flexible payment schedules. Adjust or cancel anytime",
 		"item-3": "Social Income payments are sent directly to recipients’ mobile phones.",
 		"item-4": "The amount disbursed is determined by the average salary where recipients live."
 	},
-	"section-contributors": {
+	"contributors": {
 		"header-1": "Contributors",
 		"title-1": "People from all walks of life contribute.",
 		"text-1": "We receive, amongst others, regular individual contributions from employees at the following organisations and companies:",
-
 		"header-2": "Why contribute?",
 		"title-2": "One goal. Greater social justice.",
-		"text-2": "Our contributors want to help people for a variety of reasons. Here are just a few driving forces behind the humanitarians who contribute their 1% to Social Income:"
+		"text-2": "Our contributors want to help people for a variety of reasons. Here are just a few driving forces behind the humanitarians who contribute their 1% to Social Income:",
+		"portraits": {
+			"carlos": "We are living in a world of opportunities, let's make sure we share this privilege with everyone else.",
+			"vanja": "It’s a great example of redistribution of wealth based on solidarity and enabled by today's technology.",
+			"ruben": "I contribute to Social Income not only because it's simple, but because research has shown it's extremely effective.",
+			"han": "The question is not why to get involved, but how to possibly abide not doing so. Social Income is an urgent necessity in contemporary society.",
+			"claudia": "Today's global inequality is the consequence of centuries of unequal progress. Social Income is a new way to address this."
+		}
+	},
+	"recipients": {
+		"header": "Recipients",
+		"title-1": "We work where we can make an impact. ",
+		"title-2": "Sierra Leone.",
+		"subtitle": "As of March 2020, recipients in Sierra Leone each get USD 30 per month, guaranteed for three years.",
+		"our-criteria": "Our criteria",
+		"item-1": {
+			"title": "Low-Income Country",
+			"text": "We've started helping recipients in Sierra Leone, one of the poorest countries on Earth. There, a small donation can go a long way.",
+			"caption": "Average income in Sierra Leone is USD 42.5 per month – World Bank, 2022 (GNI per capita, Atlas method and PPP)"
+		},
+		"item-2": {
+			"title": "Low-Income Community",
+			"text": "For the selection of recipients, we collaborate with local NGOs who support vulnerable and disadvantaged communities.",
+			"caption": "Partners: Aurora, Jamil & Nyanga Jaward, Reachout Salone, Equal Rights Alliance, Polio B&S Organisation, Freetown City Council"
+		},
+		"item-3": {
+			"title": "Age and Gender Parity",
+			"text": "Recipients have to be older than 16 years old. We also strive for gender equality among recipients.",
+			"caption": ""
+		},
+		"voices": "Voices",
+		"portraits": {
+			"kai": "I use Social Income to help manage my finances. With the first payment I received, I was able to buy new crutches that I’ve used ever since.",
+			"aminata": "I crush stones into gravel for a living. This is hard work with a salary that doesn’t make it easy to raise four children with. I just want to say thank you for the monthly support.",
+			"gbassay": "Social Income made it possible for me to buy school supplies and send my child to school. Thank you for everything you’ve done to help!",
+			"lamin": "Social Income helps both me and my entire family.",
+			"onikeh": "Social Income has helped me immensely. It serves as an extra source of strength to draw from in our everyday lives. It feels amazing to have people support and believe in your dreams.",
+			"neneh": "I use my monthly Social Income to invest in my small business and pay for lunch for my kids at school. It makes me so happy I could cry!"
+		}
+	},
+	"whats-next": {
+		"header": "What's next?",
+		"title-1": "We take things ",
+		"title-2": "one step at a time.",
+		"subtitle": "Social Income’s long-term goal is to create a global system of wealth redistribution for people in need, with the help of contributors from all around the world. Like any ambitious project, it takes time to scale.",
+		"timeline": {
+			"item-1": {
+				"title": "March 2020",
+				"text": "We started our Pilot Phase and paid out the first installments to a small community in Freetown, Sierra Leone."
+			},
+			"item-2": {
+				"title": "September 2021",
+				"text": "We started our Development Phase and optimized our payment process."
+			},
+			"item-3": {
+				"title": "January 2022",
+				"text": "We reached our Public Phase and have since been progressively rolling out Social Income to recipients and contributors on a larger scale."
+			},
+			"item-4": {
+				"title": "Upcoming: Impact Measurement",
+				"text": "We have established a method and a set of qualitative and quantitative criteria to measure the project’s impact. We are now collecting essential data and refining our method with the help of our recipients."
+			}
+		}
 	}
 }

ui/src/components/typography/typography.tsx

@@ -7,45 +7,53 @@ import IntrinsicElements = React.JSX.IntrinsicElements;
 
 export type FontSize = Extract<Size, 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl'>;
 const FONT_SIZE_MAP: { [key in FontSize]: string } = {
-	'5xl': 'text-5xl lg:text-6xl lg:tracking-tight xl:text-7xl',
-	'4xl': 'text-4xl lg:text-4xl lg:tracking-tight xl:text-5xl',
-	'3xl': 'text-3xl lg:text-3xl lg:tracking-tight',
-	'2xl': 'text-2xl tracking-tight',
+	'5xl': 'text-5xl',
+	'4xl': 'text-4xl',
+	'3xl': 'text-3xl',
+	'2xl': 'text-2xl',
 	xl: 'text-xl',
 	lg: 'text-lg',
 	md: 'text-base',
 	sm: 'text-sm',
 	xs: 'text-xs',
 };
 
-const FONT_WEIGHTS = ['normal', 'medium', 'bold'] as const;
+const FONT_WEIGHTS = ['normal', 'medium', 'semibold', 'bold'] as const;
 export type FontWeight = (typeof FONT_WEIGHTS)[number];
 const FONT_WEIGHT_MAP: { [key in FontWeight]: string } = {
 	normal: 'font-normal',
 	medium: 'font-medium',
+	semibold: 'font-semibold',
 	bold: 'font-bold',
 };
 
 const FONT_COLOR_MAP: { [key in FontColor]: string } = {
+	background: 'text-background',
 	foreground: 'text-foreground',
+	'si-yellow': 'text-si-yellow',
+	primary: 'text-primary',
 	'primary-foreground': 'text-primary-foreground',
+	secondary: 'text-secondary',
 	'secondary-foreground': 'text-secondary-foreground',
+	accent: 'text-accent',
 	'accent-foreground': 'text-accent-foreground',
+	destructive: 'text-destructive',
 	'destructive-foreground': 'text-destructive-foreground',
+	muted: 'text-muted',
 	'muted-foreground': 'text-muted-foreground',
+	popover: 'text-popover',
 	'popover-foreground': 'text-popover-foreground',
-	'card-foreground': 'text-card-foreground',
 };
 
 const LINE_HEIGHTS = ['none', 'tight', 'snug', 'normal', 'relaxed', 'loose'] as const;
 export type LineHeight = (typeof LINE_HEIGHTS)[number];
 const LINE_HEIGHT_MAP: { [key in LineHeight]: string } = {
-	none: 'xs:leading-none sm:leading-none md:leading-none lg:leading-none xl:leading-none',
-	tight: 'xs:leading-tight sm:leading-tight md:leading-tight lg:leading-tight xl:leading-tight',
-	snug: 'xs:leading-snug sm:leading-snug md:leading-snug lg:leading-snug xl:leading-snug',
-	normal: 'xs:leading-normal sm:leading-normal md:leading-normal lg:leading-normal xl:leading-normal',
-	relaxed: 'xs:leading-relaxed sm:leading-relaxed md:leading-relaxed lg:leading-relaxed xl:leading-relaxed',
-	loose: 'xs:leading-loose sm:leading-loose md:leading-loose lg:leading-loose xl:leading-loose',
+	none: 'leading-none',
+	tight: 'leading-tight',
+	snug: 'leading-snug',
+	normal: 'leading-normal',
+	relaxed: 'leading-relaxed',
+	loose: 'leading-loose',
 };
 
 type ElementType = keyof Pick<IntrinsicElements, 'div' | 'p' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span'>;

ui/src/interfaces/color.ts

@@ -33,13 +33,20 @@ export type Color = (typeof COLORS)[number];
 export type FontColor = Extract<
 	Color,
 	| 'foreground'
+	| 'background'
+	| 'si-yellow'
+	| 'primary'
 	| 'primary-foreground'
+	| 'secondary'
 	| 'secondary-foreground'
-	| 'accent-foreground'
+	| 'destructive'
 	| 'destructive-foreground'
+	| 'muted'
 	| 'muted-foreground'
+	| 'accent'
+	| 'accent-foreground'
+	| 'popover'
 	| 'popover-foreground'
-	| 'card-foreground'
 >;
 
 export type BackgroundColor = Extract<