{"size": 3115, "ext": "js", "max_stars_repo_path": "src/pages/projects.js", "max_stars_repo_name": "Dathan88/portfolio", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/pages/projects.js", "max_issues_repo_name": "Dathan88/portfolio", "max_issues_repo_issues_event_min_datetime": "2022-03-16T16:50:40.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-16T16:50:40.000Z", "max_forks_repo_path": "src/pages/projects.js", "max_forks_repo_name": "Dathan88/portfolio", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": null, "max_issues_count": 1, "max_forks_count": null, "avg_line_length": 26.8534482759, "max_line_length": 70, "alphanum_fraction": 0.6038523274}
import React from "react"
import { graphql } from "gatsby"
import Layout from "../components/layout"
import SEO from "../components/seo"
import PageTitle from "../components/PageTitle"
import SubTitle from "../components/SubTitle"
import Project from "../components/Project"

const titleProps = ["My", "Work"]
const subProps = "Check out some of my projects..."
const projectProps = [
  {
    number: 1,
    name: "movieList",
    href: "#!",
    imgId: "item4",
    alt: "logo",
    eyeLink: "https://movie-list-app-1.herokuapp.com/",
    eyeClass: "btn-light",
    eyeTitle: "Try Me",
    hubLink: "https://github.com/Dathan88/MovieListApp",
    hubClass: "btn-dark",
    hubTitle: "Github",
    gif: "https://media.giphy.com/media/MF7iRK3G7M0uFYKbE1/giphy.gif",
  },
  {
    number: 2,
    name: "battleship",
    href: "#!",
    imgId: "item1",
    alt: "logo",
    eyeLink: "https://dathan88.github.io/battleship",
    eyeClass: "btn-light",
    eyeIconClass: "fas fa-eye",
    eyeTitle: "Try Me",
    hubLink: "https://github.com/Dathan88/battleship",
    hubClass: "btn-dark",
    hubIconClass: "fas fa-github",
    hubTitle: "Github",
    gif: "https://media.giphy.com/media/KdqUBrwlcbs3HBRHFS/giphy.gif",
  },
  {
    number: 3,
    name: "etchASketch",
    href: "#!",
    imgId: "item2",
    alt: "logo",
    eyeLink: "https://dathan88.github.io/Etch-a-Sketch",
    eyeClass: "btn-light",
    eyeTitle: "Try Me",
    hubLink: "https://github.com/Dathan88/Etch-a-Sketch",
    hubClass: "btn-dark",
    hubTitle: "Github",
    gif: "https://media.giphy.com/media/W2RN3fpyo5qPMziSoC/giphy.gif",
  },
  {
    number: 4,
    name: "calculator",
    href: "#!",
    imgId: "item3",
    alt: "logo",
    eyeLink: "https://dathan88.github.io/Calculator",
    eyeClass: "btn-light",
    eyeTitle: "Try Me",
    hubLink: "https://github.com/Dathan88/Calculator",
    hubClass: "btn-dark",
    hubTitle: "Github",
    gif: "https://media.giphy.com/media/U3gTBwYZMd10HRjGG6/giphy.gif",
  },
]

const ProjectsPage = ({ data }) => (
  <Layout>
    <SEO title="My Projects" />
    <main id="projects">
      <PageTitle titleProps={titleProps} />
      <SubTitle subProps={subProps} />
      <Project projectProps={projectProps} data={data} />
    </main>
  </Layout>
)

export default ProjectsPage
export const pageQuery = graphql`
  query {
    movieList: file(relativePath: { eq: "Movie-List-2.png" }) {
      childImageSharp {
        fluid(maxWidth: 1600, maxHeight: 900) {
          ...GatsbyImageSharpFluid
        }
      }
    }
    battleship: file(relativePath: { eq: "battleship2.png" }) {
      childImageSharp {
        fluid(maxWidth: 1600, maxHeight: 900) {
          ...GatsbyImageSharpFluid
        }
      }
    }
    etchASketch: file(relativePath: { eq: "Etch.png" }) {
      childImageSharp {
        fluid(maxWidth: 1600, maxHeight: 900) {
          ...GatsbyImageSharpFluid
        }
      }
    }
    calculator: file(relativePath: { eq: "calc2Pic.png" }) {
      childImageSharp {
        fluid(maxWidth: 1600, maxHeight: 900) {
          ...GatsbyImageSharpFluid
        }
      }
    }
  }
`
