import * as React from 'react';
import { Me } from '@2fn/conf';

const style = { marginRight: '2rem', display: 'inline' };

export function DetailsAboutMe({ details }: { details: Me }) {
  return (
    <>
      {details.name ? <h4 style={style}>{details.name}</h4> : null}
      {details.twitter ? (
        <h6 style={style}>
          <a
            target="_blank"
            href={`https://twitter.com/${details.twitter}`}
          >{`@${details.twitter}`}</a>
        </h6>
      ) : null}
      {details.github ? <h6 style={style}>@{details.github}</h6> : null}
    </>
  );
}