77 lines
1.9 KiB
JavaScript
77 lines
1.9 KiB
JavaScript
import React from 'react';
|
|
|
|
import { makeStyles } from '@material-ui/core/styles';
|
|
import { Typography, Container, Link } from '@material-ui/core';
|
|
import {
|
|
Email as EmailIcon,
|
|
GitHub as GitHubIcon,
|
|
Facebook as FacebookIcon,
|
|
} from '@material-ui/icons';
|
|
import Section from '@components/Section';
|
|
|
|
export const SECTION_ID = 'contact';
|
|
|
|
function Contact() {
|
|
const classes = useStyles();
|
|
|
|
const linkProps = {
|
|
underline: 'hover',
|
|
color: 'secondary',
|
|
};
|
|
|
|
return (
|
|
<Section size="small" id={SECTION_ID}>
|
|
<Container maxWidth="md" className={classes.container}>
|
|
<div className={classes.urlContainer}>
|
|
<Typography variant="h6">
|
|
<EmailIcon fontSize="large" />
|
|
<Link href="mailto:dawidwysokinski000@gmail.com" {...linkProps}>
|
|
dawidwysokinski000@gmail.com
|
|
</Link>
|
|
</Typography>
|
|
<Typography variant="h6">
|
|
<GitHubIcon fontSize="large" />
|
|
<Link href="https://github.com/Kichiyaki" {...linkProps}>
|
|
Kichiyaki
|
|
</Link>
|
|
</Typography>
|
|
<Typography variant="h6">
|
|
<FacebookIcon fontSize="large" />
|
|
<Link
|
|
href="https://www.facebook.com/dawidwysokinski00"
|
|
{...linkProps}
|
|
>
|
|
/dawidwysokinski00
|
|
</Link>
|
|
</Typography>
|
|
</div>
|
|
</Container>
|
|
</Section>
|
|
);
|
|
}
|
|
|
|
const useStyles = makeStyles(theme => {
|
|
return {
|
|
container: {
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
urlContainer: {
|
|
'& > *:not(:last-child)': {
|
|
marginBottom: theme.spacing(0.5),
|
|
},
|
|
'& > *': {
|
|
display: 'flex',
|
|
alignItems: 'center',
|
|
wordBreak: 'break-all',
|
|
'& > *:not(:last-child)': {
|
|
marginRight: theme.spacing(1),
|
|
},
|
|
},
|
|
},
|
|
};
|
|
});
|
|
|
|
export default Contact;
|