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 ddfc6c7d authored by Seth A Johnson's avatar Seth A Johnson
Browse files

newsletter, css reset

parent 4c1d2230
......@@ -15,23 +15,17 @@ body {
// index
.index-grid {
grid-area: main;
display: grid;
grid-template-rows: 3.5rem auto fit-content(8rem);
grid-template-areas: "books books",
"tagline newsletter",
"news events",
"author library",
"video map";
display: block;
}
.books-container {
grid-area: books;
display: flex;
background: lightskyblue;
}
.tagline-container {
grid-area: tagline;
background: pink;
background: indianred;
height: 10vh;
.tagline {
font-weight: bold;
......@@ -40,35 +34,36 @@ body {
}
.newsletter-container {
grid-area: newletter;
background: lightgreen;
}
.news-container {
grid-area: news;
}
.events-container {
grid-area: events;
}
.author-area {
grid-area: author;
}
.library-area {
grid-area: library;
}
.video-area {
grid-area: video;
}
.map-area {
grid-area: map;
}
// card stuff
.lever-card-list {
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 @@
templateKey: home-page
taglineSection:
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"
import BookList from "../components/books/bookList"
import {graphql} from "gatsby"
import Tagline from "../components/tagline"
import Newsletter from "../components/newsletter"
export const IndexQuery = graphql`
query {
markdownRemark(frontmatter: { templateKey: { eq: "home-page" } }) {
frontmatter{
taglineSection{
frontmatter {
taglineSection {
text
}
newsletterSection {
heading
description
url
buttonLabel
}
}
}
}
`
const IndexPage = ({data}) => {
const tagline = data.markdownRemark.frontmatter.taglineSection
const newsletter = data.markdownRemark.frontmatter.newsletterSection
return (
<Layout>
<SEO title="Home" />
<div className="index-grid">
<div className="books">
<div className="books-container">
<BookList />
<div class="tagline-container">
<div class="tagline">
{ data.markdownRemark.frontmatter.taglineSection.text}
</div>
</div>
<div class="newsletter-container">
newsletter
</div>
</div>
<div className="tagline-container">
<Tagline text={tagline.text} />
</div>
<div className="newsletter-container">
<Newsletter newsletter={newsletter} />
</div>
</div>
</Layout>
......
......@@ -59,6 +59,14 @@ collections:
widget: object
fields:
- { 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"
name: 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