Note: The default ITS GitLab runner is a shared resource and is subject to slowdowns during heavy usage.
You can run your own GitLab runner that is dedicated just to your group if you need to avoid processing delays.

Commit 25684c13 authored by Seth A Johnson's avatar Seth A Johnson
Browse files

add map image to homepage

parent e1de0b48
......@@ -57,8 +57,12 @@ body {
background: darkorange;
}
.map-area {
.map-container {
background: aqua;
.map-image {
width: 20rem;
}
}
// card stuff
......
import React from "react"
import Img from "gatsby-image"
const MapImage = ({mapImage}) => {
return (
<div>
<h2>{mapImage.heading}</h2>
<figure><Img fluid={mapImage.mapImage.childImageSharp.fluid} alt="map" className="map-image"/></figure>
<p>{mapImage.description}</p>
</div>
)
}
export default MapImage
......@@ -10,6 +10,7 @@ import Newsletter from "../components/newsletter"
import NewsList from "../components/news/newsList"
import EventList from "../components/events/eventList"
import Video from "../components/video"
import MapImage from "../components/mapImage"
export const IndexQuery = graphql`
query {
......@@ -29,6 +30,17 @@ query {
description
embed
}
mapSection {
heading
description
mapImage {
childImageSharp {
fluid {
...GatsbyImageSharpFluid
}
}
}
}
}
}
books: allMarkdownRemark (
......@@ -125,6 +137,7 @@ const IndexPage = ({data}) => {
const tagline = data.home.frontmatter.taglineSection
const newsletter = data.home.frontmatter.newsletterSection
const video = data.home.frontmatter.videoSection
const map = data.home.frontmatter.mapSection
const books = data.books.edges
const news = data.news.edges
const events = data.events.edges
......@@ -157,6 +170,9 @@ const IndexPage = ({data}) => {
<div className="video-container">
<Video video={video} />
</div>
<div className="map-container">
<MapImage mapImage={map} />
</div>
</div>
</Layout>
)
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment