{"size": 1073, "ext": "js", "max_stars_repo_path": "src/components/AboutMe.js", "max_stars_repo_name": "AhmedElagami/bodesign", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/components/AboutMe.js", "max_issues_repo_name": "AhmedElagami/bodesign", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/AboutMe.js", "max_forks_repo_name": "AhmedElagami/bodesign", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 21.8979591837, "max_line_length": 102, "alphanum_fraction": 0.5778191985}
import React from 'react'
import { graphql, useStaticQuery } from 'gatsby';
import Img from 'gatsby-image';
const query = graphql`
query {
  allStrapiAbout {
    edges {
      node {
        introduction
        Information {
	  value
	  id
        }
        Photo {
          localFile {
            childImageSharp {
              fluid {
		...GatsbyImageSharpFluid
              }
            }
          }
        }
      }
    }
  }
}

`;
const AboutMe = () => {
	const { allStrapiAbout: { edges } } = useStaticQuery(query);
	const [node] = edges;
	const { node: { introduction, Information, Photo: image } } = node;
	return (
		<div id="rolam" className="about-me">
			<h2 className="heading-primary about-me__heading">Rólam</h2>
			<Img fluid={image[0].localFile.childImageSharp.fluid} className="about-me__image" alt="About Me" />
			<p className="about-me__text about-me__name">{introduction}
			</p>
			{
				Information.map((data) => {
					return <p className="about-me__text" key={data.id}>{data.value}</p>
				})
			}

		</div>
	);
};

export default AboutMe;