update basics box

Citizen-Knowledge-Graph · Nov 7, 2024 · 5f27c23 · 5f27c23
1 parent 72cc2db
commit 5f27c23
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 48 deletions.
diff --git a/src/language/translations.js b/src/language/translations.js
@@ -230,20 +230,19 @@ const translations = {
                 manyMore: "Viele Weitere",
             },
             mission: {
-                header: "1 von 5 Haushalten in Deutschland beanspruchen keine Sozialleistungen, auf die sie Anspruch haben.",
-                text: "Wir haben es uns zur Aufgabe gemacht, Sozialleistungen in Deutschland für alle zugänglich und leicht verständlich zu machen. Wir zeigen dir, auf welche Sozialleistungen du Anspruch haben könntest und weisen dir den Weg zur Antragstellung."
+                header: "1 von 5 Haushalten in Deutschland beanspruchen nicht die Sozialleistungen, auf die sie Anspruch haben.",
+                text: "Mit Förderfunke möchten wir erreichen, dass Sozialleistungen in Deutschland für alle zugänglich und leicht verständlich sind. Wir zeigen dir, auf welche Sozialleistungen du Anspruch haben könntest und wie du sie beantragen kannst."
             },
             howItWorks: {
                 header: "So geht's",
-                part1Header: "Beantworte ein paar grundlegende Fragen",
-                part1Text: "Mach einen schnellen Check, erstelle dein Profil oder durchsuche unsere Liste der Sozialleistungen nach Themen. Deine Wahl.",
+                part1Header: "Beantworte ein paar Fragen zu deiner Lebenssituation",
+                part1Text: "Damit erstellst du ein Profil, das mit den Anforderungsbedingungen der unterschiedlichen Leistungen verglichen wird.",
                 part2Header: "Erhalte eine Liste deiner potenziellen Leistungen",
-                part2Text: "Je vollständiger dein Profil ist, desto genauer wird die Liste der Leistungen sein, die du erhältst.",
-                part3Header: "Erfahre mehr über relevante Leistungen",
-                part3Text: "Erfahre mehr über die Voraussetzungen und notwendigen Schritte, um deine Leistungen zu beantragen."
+                part2Text: "Je vollständiger dein Profil ist, desto mehr Leistungen können auf Anspruch überprüft werden.",
+                part3Header: "Finde Informationen zu Leistungen und Antragsverfahren",
+                part3Text: "In der Detailansicht kannst du dich genauer über eine Leistung informieren. Du erfährst, zum Bespiel, warum du möglichweise Anspruch hast oder nicht."
             },
             theBasics: {
-                header: "Die Grundlagen",
                 line1: "FörderFunke ist kostenlos nutzbar",
                 line2: "Deine Daten gehören dir! Alle Informationen, die du eingibst, werden nur lokal auf deinem Gerät gespeichert",
                 line3: "Keine Registrierung, kein Login erforderlich",

diff --git a/src/screens/landing-page/sections/feedback/components/FeedbackBox.js b/src/screens/landing-page/sections/feedback/components/FeedbackBox.js
@@ -75,8 +75,7 @@ const styles = {
         borderRadius: '12px',
         borderStyle: 'solid',
         borderWidth: '1px',
-        borderColor: globalStyles.primaryColor,
-        boxShadow: '0px 4px 8px rgba(0, 0, 0, 0.15)',
+        borderColor: globalStyles.primaryColor
     },
     text: {
         fontSize: '20px',

diff --git a/src/screens/landing-page/sections/how-it-works/components/LandingPageBasics.js b/src/screens/landing-page/sections/how-it-works/components/LandingPageBasics.js
@@ -7,54 +7,48 @@ import globalStyles from "../../../../../styles/styles";
 import useTranslation from "../../../../../language/useTranslation";
 
 const LandingPageBasics = () => {
-    const { t } = useTranslation();
+    const {t} = useTranslation();
 
     return (
         <VStack alignItems={'center'} sx={{width: "100%"}}>
-            <VStack
-                alignItems={'center'}
-                sx={{
-                    backgroundColor: globalStyles.primaryColor,
-                    padding: '32px',
-                    borderRadius: '15px',
-                }}>
-                <HStack>
-                    <Typography sx={styles.titleText}>
-                        {t('home.theBasics.header')}
+            <VStack gap={4} alignItems={'flex-start'} sx={styles.basicsBox}>
+                <HStack alignItems={'center'}>
+                    <CheckCircleIcon sx={styles.icon}/>
+                    <Typography sx={styles.itemText}>
+                        {t('home.theBasics.line1')}
+                    </Typography>
+                </HStack>
+                <HStack alignItems={'center'}>
+                    <CheckCircleIcon sx={styles.icon}/>
+                    <Typography sx={styles.itemText}>
+                        {t('home.theBasics.line2')}
+                    </Typography>
+                </HStack>
+                <HStack alignItems={'center'}>
+                    <CheckCircleIcon sx={styles.icon}/>
+                    <Typography sx={styles.itemText}>
+                        {t('home.theBasics.line3')}
+                    </Typography>
+                </HStack>
+                <HStack alignItems={'center'}>
+                    <CheckCircleIcon sx={styles.icon}/>
+                    <Typography sx={styles.itemText}>
+                        {t('home.theBasics.line4')}
                     </Typography>
                 </HStack>
-                <VStack>
-                    <HStack alignItems={'center'}>
-                        <CheckCircleIcon sx={styles.icon}/>
-                        <Typography sx={styles.itemText}>
-                            {t('home.theBasics.line1')}
-                        </Typography>
-                    </HStack>
-                    <HStack alignItems={'center'}>
-                        <CheckCircleIcon sx={styles.icon}/>
-                        <Typography sx={styles.itemText}>
-                            {t('home.theBasics.line2')}
-                        </Typography>
-                    </HStack>
-                    <HStack alignItems={'center'}>
-                        <CheckCircleIcon sx={styles.icon}/>
-                        <Typography sx={styles.itemText}>
-                            {t('home.theBasics.line3')}
-                        </Typography>
-                    </HStack>
-                    <HStack alignItems={'center'}>
-                        <CheckCircleIcon sx={styles.icon}/>
-                        <Typography sx={styles.itemText}>
-                            {t('home.theBasics.line4')}
-                        </Typography>
-                    </HStack>
-                </VStack>
             </VStack>
         </VStack>
     );
 }
 
 const styles = {
+    basicsBox: {
+        borderRadius: '12px',
+        borderStyle: 'solid',
+        borderWidth: '1px',
+        borderColor: globalStyles.primaryColor,
+        padding: '32px',
+    },
     titleText: {
         fontWeight: 'bold',
         fontSize: '28px'
@@ -64,7 +58,8 @@ const styles = {
         fontSize: '34px',
     },
     itemText: {
-        fontSize: '20px'
+        fontSize: '20px',
+        maxWidth: '400px'
     }
 }