chore: heygermany customer project

apps/website/views/[lang]/(main)/jobs/apply/page.tsx

@@ -0,0 +1,72 @@
+'use client'
+
+import { StartApplication } from '@/components/jobs/form/StartApplication'
+import { useI18n } from '@/context/i18n-provider'
+import { Container, Box, Stack, Title, Text, List, Grid } from "@pikku/mantine/core"
+
+const ApplyPage: React.FunctionComponent = () => {
+  const t = useI18n()
+
+  return (
+    <Box component="section" py="xl" pos="relative" flex={1}>
+      <Container size="xl" pt="xl">
+        <Grid gutter="xl" align="stretch">
+
+          {/* Who is This For Section */}
+          <Grid.Col span={{ base: 12, md: 4 }}>
+            <Stack gap="xl">
+              <Box>
+                <Title order={2} mb="md">{t('jobs.apply.whoisthisfor.title')}</Title>
+                <Text size="sm">
+                  {t('jobs.apply.whoisthisfor.description')}
+                </Text>
+              </Box>
+
+              <Box>
+                <Title order={2} mb="md">{t('jobs.apply.whatyoullget.title')}</Title>
+                <List size="sm" spacing="xs">
+                  <List.Item>{t('jobs.apply.whatyoullget.item1')}</List.Item>
+                  <List.Item>{t('jobs.apply.whatyoullget.item2')}</List.Item>
+                  <List.Item>{t('jobs.apply.whatyoullget.item3')}</List.Item>
+                </List>
+              </Box>
+
+              <Box>
+                <Title order={2} mb="md">{t('jobs.apply.whatyoullneed.title')}</Title>
+                <List size="sm" spacing="xs">
+                  <List.Item>{t('jobs.apply.whatyoullneed.item1')}</List.Item>
+                  <List.Item>{t('jobs.apply.whatyoullneed.item2')}</List.Item>
+                  <List.Item>
+                    {t('jobs.apply.whatyoullneed.item3.title')}
+                    <br />
+                    {t('jobs.apply.whatyoullneed.item3.note')}
+                  </List.Item>
+                  <List.Item>
+                    {t('jobs.apply.whatyoullneed.item4.title')}
+                    <br />
+                    {t('jobs.apply.whatyoullneed.item4.note')}
+                  </List.Item>
+                </List>
+              </Box>
+            </Stack>
+          </Grid.Col>
+
+          {/* Get Your Results Section */}
+          <Grid.Col span={{ base: 12, md: 4 }}>
+            <Stack gap="lg">
+              <Box>
+                <Title order={2} mb="md">{t('jobs.apply.getyourresults.title')}</Title>
+                <Text size="sm" mt="md">
+                  {t('jobs.apply.getyourresults.description')}
+                </Text>
+              </Box>
+              <StartApplication initializing={false} />
+            </Stack>
+          </Grid.Col>
+        </Grid>
+      </Container>
+    </Box>
+  )
+}
+
+export default ApplyPage