chore: heygermany customer project

apps/website/components/jobs/results/HowToApply.tsx

@@ -0,0 +1,58 @@
+'use client'
+
+import { Stack, Text, Divider, Anchor, Title, Card } from '@pikku/mantine/core'
+import { useI18n } from '@/context/i18n-provider'
+import { asI18n } from '@pikku/react'
+
+export default function HowToApply() {
+  const t = useI18n()
+
+  return (
+    <Stack gap="md" mt="md">
+      <Text lineBreaks>{t('jobs.howtoapply.intro1')}</Text>
+
+      <Text>
+        {asI18n(`${t('jobs.howtoapply.applicationform')} `)}
+        <Anchor
+          href="/pdf/Application_Form_Nurse.pdf"
+          target="_blank"
+          rel="noopener noreferrer"
+          c="primary"
+          td="underline"
+          fw={700}
+        >
+          {asI18n('here')}
+        </Anchor>
+      </Text>
+
+      <Text lineBreaks>{t('jobs.howtoapply.reminder')}</Text>
+
+      <Text lineBreaks>{t('jobs.howtoapply.submission')}</Text>
+
+      <Divider />
+      <Title order={4}>{t('jobs.howtoapply.contacttitle')}</Title>
+      <Text lineBreaks>{t('jobs.howtoapply.contact.address')}</Text>
+      <Text>
+        {asI18n('Email: ')}
+        <Anchor
+          href={`mailto:${t('jobs.howtoapply.contact.email')}`}
+          c="primary"
+          fw={700}
+        >
+          {t('jobs.howtoapply.contact.email')}
+        </Anchor>
+      </Text>
+      <Text>{asI18n(`Phone: ${t('jobs.howtoapply.contact.phone')}`)}</Text>
+      <Text lineBreaks>{t('jobs.howtoapply.contact.hours')}</Text>
+
+      <Card withBorder padding="md" radius="sm" mt="md">
+        <Text lineBreaks>{t('jobs.howtoapply.tip')}</Text>
+      </Card>
+
+      <Text lineBreaks>{t('jobs.howtoapply.waiver')}</Text>
+
+      <Divider />
+      <Text lineBreaks>{t('jobs.howtoapply.counseling')}</Text>
+    </Stack>
+  )
+}