jobiqo-cl/lib/es/src/components/03-molecules/06-resume/01-personal_info/index.js

[](https://circleci.com/gh/jobiqo/jobiqo-cl)

import React__default from 'react';
import styled from 'styled-components';
import Avatar from '../../../02-atoms/12-user/01-avatar/index.js';
import MarkerIcon from '../../../../icons/Marker.js';
import { EditButton } from '../styles/index.js';

const Wrapper = styled.div `
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  ${props => props.theme.mediaQueries.small} {
    flex-direction: row;
  }
`;
const StyledResumeInfo = styled.div `
  margin-left: 1em;
`;
const StyledFullname = styled.div `
  font-size: 1.25em;
`;
const StyledHome = styled.div `
  margin-top: 0.25rem;
  color: ${props => props.theme.colors.gray4};
  svg {
    margin-right: 0.25rem;
  }
`;
/**
 * Shows an applicant's personal information. Used to display on a resume page.
 */
const PersonalInfo = ({ personalInfo, OnClickElement }) => (React__default.createElement(Wrapper, { className: "personal-info" },
    personalInfo.fullname && (React__default.createElement(Avatar, Object.assign({ src: personalInfo.photo, size: "medium", title: personalInfo.fullname, alt: personalInfo.fullname }, (personalInfo.status ? { status: personalInfo.status } : null)))),
    React__default.createElement(StyledResumeInfo, null,
        personalInfo.fullname && (React__default.createElement(StyledFullname, null, personalInfo.fullname)),
        personalInfo.home && (React__default.createElement(StyledHome, null,
            React__default.createElement(MarkerIcon, { title: "Home location" }),
            "Lives in ",
            personalInfo.home))),
    OnClickElement && React__default.createElement(EditButton, null, OnClickElement)));

export { PersonalInfo };