import { Anchor, Container, Text, Stack } from '@mantine/core';
import classes from './Contact.module.css';

export function Contact() {
  return (
    <div className={classes.wrapper}>
      <Container fluid size={700} className={classes.inner}>
        <h1 className={classes.title}>
          <Text component="span" variant="gradient" gradient={{ from: 'blue', to: 'cyan' }} inherit>
            Get in Touch
          </Text>
        </h1>

        <Text className={classes.description} c="dimmed">
          If you'd like to collaborate, have any questions, or just want to say hello, feel free to
          reach out!
        </Text>

        <Stack gap="lg" mt="xl">
          <Text size="lg">
            Email:{' '}
            <Anchor href="mailto:cdmacfadyen@proton.me" className={classes.link}>
              cdmacfadyen@proton.me
            </Anchor>
          </Text>
          <Text size="lg">
            LinkedIn:{' '}
            <Anchor href="https://www.linkedin.com/in/craig-macfadyen-9a2041197" target="_blank" className={classes.link}>
              linkedin.com/in/craigmacfadyen
            </Anchor>
          </Text>
        </Stack>
      </Container>
    </div>
  );
}
