55 lines
1.5 KiB
JavaScript
55 lines
1.5 KiB
JavaScript
|
import React from "react";
|
||
|
|
import PropTypes from "prop-types";
|
||
|
|
import styles from "./modules/Infos.module.css";
|
||
|
|
import LocationIcon from "../public/icons/location.svg";
|
||
|
|
import GithubIcon from "../public/icons/github.svg";
|
||
|
|
import LinkedinIcon from "../public/icons/linkedin.svg";
|
||
|
|
import MailIcon from "../public/icons/mail.svg";
|
||
|
|
|
||
|
|
export default function Infos(props) {
|
||
|
|
const infos = props.infos;
|
||
|
|
return (
|
||
|
|
<div className={styles.container}>
|
||
|
|
<b className={styles.bracket}>{"{"}</b>
|
||
|
|
<a
|
||
|
|
className={`${styles.row} ${styles.location}`}
|
||
|
|
href={infos.location.link}
|
||
|
|
target="__blank"
|
||
|
|
>
|
||
|
|
<LocationIcon className={styles.icon} />
|
||
|
|
<b>{infos.location.value}</b>
|
||
|
|
</a>
|
||
|
|
<a
|
||
|
|
className={`${styles.row} ${styles.github}`}
|
||
|
|
href={infos.github.link}
|
||
|
|
target="__blank"
|
||
|
|
>
|
||
|
|
<GithubIcon className={styles.icon} />
|
||
|
|
<b>{infos.github.value}</b>
|
||
|
|
</a>
|
||
|
|
<a
|
||
|
|
className={`${styles.row} ${styles.linkedin}`}
|
||
|
|
href={infos.linkedin.link}
|
||
|
|
target="__blank"
|
||
|
|
>
|
||
|
|
<LinkedinIcon className={styles.icon} />
|
||
|
|
<b>{infos.linkedin.value}</b>
|
||
|
|
</a>
|
||
|
|
<a
|
||
|
|
className={`${styles.row} ${styles.email}`}
|
||
|
|
href={infos.email.link}
|
||
|
|
target="__blank"
|
||
|
|
type="email"
|
||
|
|
>
|
||
|
|
<MailIcon className={styles.icon} />
|
||
|
|
<b>{infos.email.value}</b>
|
||
|
|
</a>
|
||
|
|
<b className={styles.bracket}>{"}"}</b>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
Infos.propTypes = {
|
||
|
|
infos: PropTypes.PropTypes.object.isRequired,
|
||
|
|
};
|