{"size": 965, "ext": "js", "max_stars_repo_path": "src/pages/index.js", "max_stars_repo_name": "elprofa/design-k", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/pages/index.js", "max_issues_repo_name": "elprofa/design-k", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/pages/index.js", "max_forks_repo_name": "elprofa/design-k", "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": 41.9565217391, "max_line_length": 119, "alphanum_fraction": 0.6238341969}
import * as React from "react"
import { Link } from "gatsby"
import { StaticImage } from "gatsby-plugin-image"
import { Button} from "@chakra-ui/react"
import Layout from "../components/layout"
import Seo from "../components/seo"
import { Box, Text } from "@chakra-ui/react"
import { Grid, GridItem } from "@chakra-ui/react"
const IndexPage = (props) => (
  <Layout>
    <Grid templateColumns="repeat(4, 1fr)" gap={0}>
      <Box  h="100vh" bg="#f7931e" _hover={{ backgroundColor: '#fff',width:"50vw",flex: 3,transition: 1+"s"  }}>
       
      </Box>
      <Box  h="100vh" bg="#42210b" _hover={{ backgroundColor: '#fff',width:"50vw",flex: 3,transition: 1+"s"  }} ></Box>
      <Box  h="100vh" bg="#c1272d" _hover={{ backgroundColor: '#fff',width:"50vw",flex: 3,transition: 1+"s"  }} ></Box>
      <Box  h="100vh" bg="#f15a24" _hover={{ backgroundColor: '#fff',width:"50vw",flex: 3,transition: 1+"s"  }} ></Box>
    </Grid>
  </Layout>
)

export default IndexPage
