Commit 01bcf46c authored by Seth A Johnson's avatar Seth A Johnson
Browse files

Merge branch 'newsletter' into 'master'

newsletter, css reset

See merge request about-leverpress!4
parents 4c1d2230 ddfc6c7d
...@@ -15,23 +15,17 @@ body { ...@@ -15,23 +15,17 @@ body {
// index // index
.index-grid { .index-grid {
grid-area: main; display: block;
display: grid;
grid-template-rows: 3.5rem auto fit-content(8rem);
grid-template-areas: "books books",
"tagline newsletter",
"news events",
"author library",
"video map";
} }
.books-container { .books-container {
grid-area: books; display: flex;
background: lightskyblue;
} }
.tagline-container { .tagline-container {
grid-area: tagline; background: indianred;
background: pink; height: 10vh;
.tagline { .tagline {
font-weight: bold; font-weight: bold;
...@@ -40,35 +34,36 @@ body { ...@@ -40,35 +34,36 @@ body {
} }
.newsletter-container { .newsletter-container {
grid-area: newletter; background: lightgreen;
} }
.news-container { .news-container {
grid-area: news;
} }
.events-container { .events-container {
grid-area: events;
} }
.author-area { .author-area {
grid-area: author;
} }
.library-area { .library-area {
grid-area: library;
} }
.video-area { .video-area {
grid-area: video;
} }
.map-area { .map-area {
grid-area: map;
} }
// card stuff // card stuff
.lever-card-list { .lever-card-list {
display: flex; display: flex;
......
import React from "react"
const Newsletter = ({newsletter}) => {
return (
<div>
<h2>{newsletter.heading}</h2>
<p>{newsletter.description}</p>
<a href={newsletter.url}>{newsletter.buttonLabel}</a>
</div>
)
}
export default Newsletter
import React from "react"
const Tagline = ({text}) => {
return (
<div className="tagline">
{text}
</div>
)
}
export default Tagline
...@@ -2,4 +2,9 @@ ...@@ -2,4 +2,9 @@
templateKey: home-page templateKey: home-page
taglineSection: taglineSection:
text: A tagline for Lever Press text: A tagline for Lever Press
newsletterSection:
heading: A Newsletter Heading
description: description of the newsletter
url: "http://google.com"
buttonLabel: Sign Up
--- ---
...@@ -5,34 +5,43 @@ import SEO from "../components/seo" ...@@ -5,34 +5,43 @@ import SEO from "../components/seo"
import BookList from "../components/books/bookList" import BookList from "../components/books/bookList"
import {graphql} from "gatsby" import {graphql} from "gatsby"
import Tagline from "../components/tagline"
import Newsletter from "../components/newsletter"
export const IndexQuery = graphql` export const IndexQuery = graphql`
query { query {
markdownRemark(frontmatter: { templateKey: { eq: "home-page" } }) { markdownRemark(frontmatter: { templateKey: { eq: "home-page" } }) {
frontmatter{ frontmatter {
taglineSection{ taglineSection {
text text
} }
newsletterSection {
heading
description
url
buttonLabel
}
} }
} }
} }
` `
const IndexPage = ({data}) => { const IndexPage = ({data}) => {
const tagline = data.markdownRemark.frontmatter.taglineSection
const newsletter = data.markdownRemark.frontmatter.newsletterSection
return ( return (
<Layout> <Layout>
<SEO title="Home" /> <SEO title="Home" />
<div className="index-grid"> <div className="index-grid">
<div className="books"> <div className="books-container">
<BookList /> <BookList />
<div class="tagline-container"> </div>
<div class="tagline"> <div className="tagline-container">
{ data.markdownRemark.frontmatter.taglineSection.text} <Tagline text={tagline.text} />
</div> </div>
</div> <div className="newsletter-container">
<div class="newsletter-container"> <Newsletter newsletter={newsletter} />
newsletter
</div>
</div> </div>
</div> </div>
</Layout> </Layout>
......
...@@ -59,6 +59,14 @@ collections: ...@@ -59,6 +59,14 @@ collections:
widget: object widget: object
fields: fields:
- { name: text, label: Text, widget: markdown } - { name: text, label: Text, widget: markdown }
- name: newsletterSection
label: "Newsletter Section"
widget: object
fields:
- { name: heading, label: Heading }
- { name: description, label: Description }
- { name: url, label: "Newsletter URL" }
- { name: buttonLabel, label: "Button Label" }
- file: "src/content/about.md" - file: "src/content/about.md"
name: about name: about
label: About label: About
......
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