Skip to content

Commit dd25f87

Browse files
benjaminaaronbenjaminaaron
committed
Add Wolfenbüttel as new runway
1 parent 3c1c673 commit dd25f87

7 files changed

Lines changed: 122 additions & 5 deletions

File tree

‎src/AppRoutes.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,8 @@ const AppRoutes = () => (
3535
<Route path="/data-protection" element={<DataProtection/>}/>
3636
<Route path="/bielefeld" element={<LandingPage runway="bielefunke" />}/>
3737
<Route path="/bielefunke" element={<LandingPage runway="bielefunke" />}/>
38+
<Route path="/wolfenbuettel" element={<LandingPage runway="wolfenbuettel" />}/>
39+
<Route path="/wolfenbüttel" element={<LandingPage runway="wolfenbuettel" />}/>
3840
</Routes>
3941
);
4042

‎src/ui/language/translations.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,13 @@ const translations = {
3030
subHeader: "Together with the Office for Social Planning of the City of Bielefeld, we are further developing FörderFunke and adapting the solution to the city's requirements. The focus is particularly on the areas of rehabilitation and participation as well as addiction. We are always happy to receive feedback.",
3131
pilotButton: "Explore the Pilotproject",
3232
regularButton: "Discover all benefits",
33+
},
34+
wolfenbuettel: {
35+
headerPilot: "Wolfenbüttel Pilot Project",
36+
headerShard1: "Discover support programs in Wolfenbüttel",
37+
subHeader: "TODO",
38+
pilotButton: "Explore the Pilotproject",
39+
regularButton: "Discover all benefits",
3340
}
3441
},
3542
fact: {
@@ -378,6 +385,13 @@ const translations = {
378385
subHeader: "Gemeinsam mit dem Büro für Sozialplanung der Stadt Bielefeld entwickeln wir FörderFunke weiter und passen die Lösung an die Anforderungen der Stadt an. Dabei stehen insbesondere die Bereiche Rehabilitation und Teilhabe sowie Suchterkrankungen im Fokus. Wir freuen uns jederzeit über Feedback.",
379386
pilotButton: "Zum Pilotprojekt",
380387
regularButton: "Alle Leistungen prüfen",
388+
},
389+
wolfenbuettel: {
390+
headerPilot: "Pilotprojekt Wolfenbüttel",
391+
headerShard1: "Entdecke Deine Angebote in Wolfenbüttel",
392+
subHeader: "TODO",
393+
pilotButton: "Zum Pilotprojekt",
394+
regularButton: "Alle Leistungen prüfen",
381395
}
382396
},
383397
fact: {

‎src/ui/screens/landing-page/LandingPage.js‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import LandingPageFunding from "./sections/funding/LandingPageFunding";
1212
import LandingPageMission from "./sections/mission/LandingPageMission";
1313
import LandingPageTopSection from "./sections/top-section/LandingPageTopSection";
1414
import LandingPageTopSectionBielefunke from "./sections/top-section/variants/LandingPageTopSectionBielefunke";
15+
import LandingPageTopSectionWolfenbuettel from "./sections/top-section/variants/LandingPageTopSectionWolfenbuettel";
1516

1617
const LandingPage = ({ runway }) => {
1718
const isDesktop = useStore((state) => state.isDesktop);
@@ -21,6 +22,9 @@ const LandingPage = ({ runway }) => {
2122
case 'bielefunke':
2223
topSection = <LandingPageTopSectionBielefunke isDesktop={isDesktop} />;
2324
break;
25+
case 'wolfenbuettel':
26+
topSection = <LandingPageTopSectionWolfenbuettel isDesktop={isDesktop} />;
27+
break;
2428
default:
2529
topSection = <LandingPageTopSection isDesktop={isDesktop} />;
2630
break;

‎src/ui/screens/landing-page/sections/top-section/components/LandingPageTopSectionSharedVariant.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,10 +9,10 @@ const LandingPageTopSectionSharedVariant = ({ runway }) => {
99
return (
1010
<VBox sx={{ gap: 4 }}>
1111
<VBox sx={{ alignItems: 'flex-start', gap: 1 }}>
12-
<Typography variant="h2" sx={{ color: 'pink.main' }}>{t("home.hero.bielefeld.headerPilot")}</Typography>
13-
<Typography variant="h1">{t("home.hero.bielefeld.headerShard1")}</Typography>
12+
<Typography variant="h2" sx={{ color: 'pink.main' }}>{t(`home.hero.${runway}.headerPilot`)}</Typography>
13+
<Typography variant="h1">{t(`home.hero.${runway}.headerShard1`)}</Typography>
1414
</VBox>
15-
<Typography variant="body1" sx={{ textAlign: 'left' }}>{t("home.hero.bielefeld.subHeader")}</Typography>
15+
<Typography variant="body1" sx={{ textAlign: 'left' }}>{t(`home.hero.${runway}.subHeader`)}</Typography>
1616
</VBox>
1717
);
1818
};

‎src/ui/screens/landing-page/sections/top-section/variants/LandingPageTopSectionBielefunke.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ const LandingPageTopSectionBielefunke = ({ runway }) => {
1717
<HBox justifyContent="space-between" alignItems="flex-start">
1818
<VBox sx={{ width: "50%", alignItems: "center" }}>
1919
<VBox sx={{ maxWidth: "600px", gap: 4 }}>
20-
<LandingPageTopSectionSharedVariant runway={runway} />
20+
<LandingPageTopSectionSharedVariant runway="bielefeld" />
2121
<HBox>
2222
<RegularButton text={'home.hero.bielefeld.pilotButton'} variant={'whiteOutlinedBlue'} link='/eligibility-overview?tags=ff%3Abielefunke' />
2323
<RegularButton text={'home.hero.bielefeld.regularButton'} variant={'yellowContained'} link='/user-routing' />
@@ -75,7 +75,7 @@ const LandingPageTopSectionBielefunke = ({ runway }) => {
7575
</VBox>
7676

7777
<VBox sx={{ gap: "16px" }}>
78-
<LandingPageTopSectionSharedVariant runway={runway} />
78+
<LandingPageTopSectionSharedVariant runway="bielefeld" />
7979
<VBox sx={{ gap: 2, width: '100%' }}>
8080
<RegularButton text={'home.hero.bielefeld.pilotButton'} variant={'whiteOutlinedBlue'} link='/eligibility-overview?tags=ff%3Abielefunke' />
8181
<RegularButton text={'home.hero.bielefeld.regularButton'} variant={'yellowContained'} link='/user-routing' />

‎src/ui/screens/landing-page/sections/top-section/variants/LandingPageTopSectionWolfenbuettel.js‎

Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
import React, { useState } from "react";
2+
import { useStore } from "@/ui/shared-components/ViewportUpdater";
3+
import { HBox, VBox } from "@/ui/shared-components/LayoutBoxes";
4+
import RegularButton from "@/ui/shared-components/buttons/RegularButton";
5+
import LandingPageSectionWrapper from "../../../components/LandingPageSectionWrapper";
6+
import LandingPageTopSectionSharedVariant from "../components/LandingPageTopSectionSharedVariant";
7+
8+
const LandingPageTopSectionWolfenbuettel = ({ runway }) => {
9+
const isDesktop = useStore((state) => state.isDesktop);
10+
const [loaded, setLoaded] = useState(false);
11+
const wolfenbuettelImage = `${process.env.PUBLIC_URL}/assets/images/landing-page/bielefeld_image.svg`; // TODO
12+
const imageSize = isDesktop ? 523 : 328;
13+
14+
return (
15+
<LandingPageSectionWrapper>
16+
{isDesktop ? (
17+
<HBox justifyContent="space-between" alignItems="flex-start">
18+
<VBox sx={{ width: "50%", alignItems: "center" }}>
19+
<VBox sx={{ maxWidth: "600px", gap: 4 }}>
20+
<LandingPageTopSectionSharedVariant runway="wolfenbuettel" />
21+
<HBox>
22+
<RegularButton text={'home.hero.wolfenbuettel.pilotButton'} variant={'whiteOutlinedBlue'} link='/eligibility-overview?tags=ff%3Awolfenbuettel' />
23+
<RegularButton text={'home.hero.wolfenbuettel.regularButton'} variant={'yellowContained'} link='/user-routing' />
24+
</HBox>
25+
</VBox>
26+
</VBox>
27+
<VBox sx={{ width: "50%", alignItems: "center", position: "relative" }}>
28+
{!loaded && (
29+
<div
30+
style={{
31+
width: `${imageSize}px`,
32+
height: `${imageSize}px`
33+
}}
34+
/>
35+
)}
36+
<img
37+
src={wolfenbuettelImage}
38+
alt="logo"
39+
style={{
40+
width: `${imageSize}px`,
41+
height: `${imageSize}px`,
42+
position: loaded ? "static" : "absolute",
43+
opacity: loaded ? 1 : 0,
44+
transition: "opacity 0.8s ease-in-out",
45+
borderRadius: "12px",
46+
}}
47+
onLoad={() => setLoaded(true)}
48+
/>
49+
</VBox>
50+
</HBox>
51+
) : (
52+
<VBox sx={{ gap: "46px", alignItems: "center" }}>
53+
<VBox sx={{ alignItems: "center", position: "relative" }}>
54+
{!loaded && (
55+
<div
56+
style={{
57+
width: `${imageSize}px`,
58+
height: `${imageSize}px`,
59+
}}
60+
/>
61+
)}
62+
<img
63+
src={wolfenbuettelImage}
64+
alt="logo"
65+
style={{
66+
width: `${imageSize}px`,
67+
height: `${imageSize}px`,
68+
position: loaded ? "static" : "absolute",
69+
opacity: loaded ? 1 : 0,
70+
transition: "opacity 0.8s ease-in-out",
71+
borderRadius: "12px",
72+
}}
73+
onLoad={() => setLoaded(true)}
74+
/>
75+
</VBox>
76+
77+
<VBox sx={{ gap: "16px" }}>
78+
<LandingPageTopSectionSharedVariant runway="wolfenbuettel" />
79+
<VBox sx={{ gap: 2, width: '100%' }}>
80+
<RegularButton text={'home.hero.wolfenbuettel.pilotButton'} variant={'whiteOutlinedBlue'} link='/eligibility-overview?tags=ff%3Awolfenbuettel' />
81+
<RegularButton text={'home.hero.wolfenbuettel.regularButton'} variant={'yellowContained'} link='/user-routing' />
82+
</VBox>
83+
</VBox>
84+
</VBox>
85+
)}
86+
</LandingPageSectionWrapper>
87+
);
88+
};
89+
90+
export default LandingPageTopSectionWolfenbuettel;

‎src/ui/shared-components/header/views/HeaderBarDesktop.js‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,13 @@ const HeaderBarDesktop = ({ isApp, runway }) => {
4747
</Typography>
4848
)
4949
}
50+
{
51+
runway === 'wolfenbuettel' && (
52+
<Typography variant='h2' sx={{ color: "pink.main", fontWeight: '500', marginLeft: '8px' }}>
53+
Wolfenbüttel
54+
</Typography>
55+
)
56+
}
5057
</HBox>
5158
</HBox>
5259
</Link>

0 commit comments

Comments
 (0)