added images

This commit is contained in:
Sergey Yarkov 2020-07-03 19:38:10 +03:00
parent 1be0388a5c
commit 081e984433
6 changed files with 8 additions and 4 deletions

View File

@ -8,7 +8,7 @@ import VkIcon from '../../images/vk-icon.svg'
import TwitterIcon from '../../images/twitter-icon__large.svg' import TwitterIcon from '../../images/twitter-icon__large.svg'
import FacebookIcon from '../../images/facebook-icon__large.svg' import FacebookIcon from '../../images/facebook-icon__large.svg'
const Article = ({ data: { title, description, category, tags, time, date }, html }) => { const Article = ({ data: { title, image, description, category, tags, time, date }, html }) => {
return ( return (
<> <>
<SEO title={title} description={description} /> <SEO title={title} description={description} />
@ -61,7 +61,7 @@ const Article = ({ data: { title, description, category, tags, time, date }, htm
</div>)} </div>)}
</div> </div>
<div className="article-image"> <div className="article-image">
<img src="https://c.wallhere.com/photos/fb/a1/JavaScript_minimalism-1227036.jpg!d" alt="article" /> <img src={image} alt={title} />
</div> </div>
<div className="article-inner inner"> <div className="article-inner inner">
<div dangerouslySetInnerHTML={{__html: html}}></div> <div dangerouslySetInnerHTML={{__html: html}}></div>

View File

@ -2,12 +2,12 @@ import React from 'react';
import { Link } from 'gatsby' import { Link } from 'gatsby'
import './ArticleCard.scss' import './ArticleCard.scss'
const ArticleCard = ({ data: { slug, title, category, description, tags } }) => { const ArticleCard = ({ data: { slug, title, image, category, description, tags } }) => {
return ( return (
<article className="article-card"> <article className="article-card">
<div className="article-card__image"> <div className="article-card__image">
<Link to={`/article/${slug}`}> <Link to={`/article/${slug}`}>
<img src="https://c.wallhere.com/photos/fb/a1/JavaScript_minimalism-1227036.jpg!d" alt="article" /> <img src={image} alt={title} />
</Link> </Link>
</div> </div>
<div className="article-card__heading"> <div className="article-card__heading">

View File

@ -80,6 +80,7 @@ export const query = graphql`
frontmatter { frontmatter {
slug slug
title title
image
category category
tags tags
description description

View File

@ -49,6 +49,7 @@ export const query = graphql`
frontmatter { frontmatter {
slug slug
title title
image
category category
tags tags
description description

View File

@ -37,6 +37,7 @@ export const pageQuery = graphql`
frontmatter { frontmatter {
slug slug
title title
image
time time
tags tags
description description

View File

@ -14,6 +14,7 @@ collections:
- {label: "Slug", name: "slug", widget: "string"} - {label: "Slug", name: "slug", widget: "string"}
- {label: "Время чтения", name: "time", widget: "string"} - {label: "Время чтения", name: "time", widget: "string"}
- {label: "Заголовок", name: "title", widget: "string"} - {label: "Заголовок", name: "title", widget: "string"}
- {labe: "Обложка", name: "image", widget: "image"}
- {label: "Категория", name: "category", widget: "relation", collection: "categories", valueField: "title", searchFields: ["title"]} - {label: "Категория", name: "category", widget: "relation", collection: "categories", valueField: "title", searchFields: ["title"]}
- {label: "Дата публикации", name: "date", widget: "datetime"} - {label: "Дата публикации", name: "date", widget: "datetime"}
- {label: "Описание", name: "description", widget: "text"} - {label: "Описание", name: "description", widget: "text"}