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 962ae0a5 authored by Jonathan McGlone's avatar Jonathan McGlone
Browse files

changes to book layout, event layout, footer, and lists of blog posts

parent f29a63c1
......@@ -12,7 +12,7 @@ const Book = ({book}) => {
} = book
return (
<div className="card mb-3 lever-card">
<div className="card mb-3 book-card">
<div className="row no-gutters">
<div className="col-md-4">
<Img fluid={cover.childImageSharp.fluid}
......
......@@ -3,7 +3,7 @@ import Img from "gatsby-image"
const BookCover = ({book}) => {
return (
<div className="card mb-3 lever-card">
<div className="card mb-3 book-card">
<a href={book.readLink}>
<div className="row no-gutters">
<div className="col-md-12">
......
......@@ -6,7 +6,7 @@ const BookList = ({books}) => {
return (
<div>
<div className="row lever-card-list">
<div className="row book-card-list">
{
books.map(({node}) => {
if (node.frontmatter.orderOnPage === 1 || node.frontmatter.orderOnPage === 2) {
......@@ -19,7 +19,7 @@ const BookList = ({books}) => {
})
}
</div>
<div className="row lever-card-list">
<div className="row book-card-covers-only-list">
{
books.map(({node}) => {
if (node.frontmatter.orderOnPage > 2) {
......
import React from "react"
import Img from "gatsby-image"
import {Link} from "gatsby"
const EventCard = ({event, cardStyle}) => {
const {title, summary, date, image} = event.frontmatter
const {title, summary, date} = event.frontmatter
const slug = event.fields.slug
var showImage;
if (image) {
showImage = <Img fluid={image.childImageSharp.fluid} />
}
return (
<div className="event-card-container">
<Link to={slug}>
<li className="media my-4">
{showImage}
<li className="media my-4 event-card-container">
<Link to={slug}>
<div className="media-body">
<h5 className="mt-0 mb-1">{title}</h5>
<p>{summary}</p>
<small className="text-muted">Published {date}</small>
</div>
</Link>
</li>
</Link>
</div>
)
}
......
......@@ -3,7 +3,7 @@ import EventCard from "./eventCard"
const EventList = ({events, cardStyle}) => {
return (
<section className="lever-card-list">
<section className="event-card-list">
<h2>Events</h2>
<ul className="list-unstyled">
{
......
......@@ -18,7 +18,7 @@ const Footer = () => {
const year = now.getFullYear()
return (
<footer className="footer" role="navigation">
<footer className="footer">
<div className="container">
<div className="row">
<div className="col-md-6">
......@@ -30,7 +30,7 @@ const Footer = () => {
<a href="https://twitter.com/lever_press"><svg width="24px" height="24px" viewBox="0 0 24 24" className="social-link tw" aria-hidden="false"><title>Twitter</title><path d="M22,5.8a8.6,8.6,0,0,1-2.36.65,4.07,4.07,0,0,0,1.8-2.27,8.1,8.1,0,0,1-2.6,1A4.1,4.1,0,0,0,11.75,8a4.73,4.73,0,0,0,.09.93A11.6,11.6,0,0,1,3.39,4.62,4.2,4.2,0,0,0,2.83,6.7a4.09,4.09,0,0,0,1.82,3.4A4,4,0,0,1,2.8,9.6v0a4.11,4.11,0,0,0,3.29,4A4.2,4.2,0,0,1,5,13.81a4,4,0,0,1-.78-.07,4.14,4.14,0,0,0,3.83,2.85A8.22,8.22,0,0,1,3,18.34a6.37,6.37,0,0,1-1-.06,11.48,11.48,0,0,0,6.29,1.84A11.58,11.58,0,0,0,20,8.46c0-.18,0-.36,0-.53A8.31,8.31,0,0,0,22,5.8Z"></path></svg></a>
</p>
</div>
<div className="col-md-3">
<div className="col-md-2">
<h5>Our Partners</h5>
<ul className="list-unstyled text-small">
<li><a href="https://acpress.amherst.edu/" className="text-muted">Amerhest College Press</a></li>
......@@ -38,7 +38,13 @@ const Footer = () => {
<li><a href="https://www.publishing.umich.edu" className="text-muted">Michigan Publishing</a></li>
</ul>
</div>
<div className="col-md-3">
<div className="col-md-2">
<h5>Peer Review</h5>
<ul className="list-unstyled text-small">
<li><a href="/peerreview" className="text-muted">Our Commitments and Guidelines</a></li>
</ul>
</div>
<div className="col-md-2">
<h5>Book Series</h5>
<ul className="list-unstyled text-small">
<li><a href="/series#series-one" className="text-muted">Series one</a></li>
......
......@@ -21,11 +21,13 @@
.books-container {
padding: 3rem 0;
.lever-card-list {
.book-card-list {
justify-content: space-evenly;
}
// card stuff
.lever-card {
// books
.book-card {
max-width: 540px;
.card-img {
......@@ -71,6 +73,21 @@
.post-image {
max-height: 500px;
overflow: hidden;
margin-bottom: 2em;
margin-top: 2em;
}
.summary {
font-size: 1em;
p {
margin-bottom: 0;
}
h4 {
font-size: .9em;
margin-top: .2em !important;
}
}
.blog-card-container {
......
......@@ -3,7 +3,7 @@ import NewsCard from "./newsCard"
const NewsList = ({news, cardStyle}) => {
return (
<section className="lever-card-list">
<section className="blog-card-list">
<h2>News</h2>
{
news.map(({node}) => {
......
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