news
This commit is contained in:
parent
f9aa65e67a
commit
bcdf2e8f56
|
@ -1,15 +1,14 @@
|
||||||
import * as React from "react";
|
import * as React from "react";
|
||||||
import { graphql } from "gatsby";
|
import { graphql } from "gatsby";
|
||||||
import Layout, { Section, SectionTitle } from "../components/Layout";
|
import Layout, { Section } from "../components/Layout";
|
||||||
import { Aside } from "../components/News";
|
import { Aside } from "../components/News";
|
||||||
import Link from "../components/Link";
|
import Link from "../components/Link";
|
||||||
import SEO from "../components/seo";
|
import SEO from "../components/seo";
|
||||||
|
|
||||||
const NewsCard = ({ ...props }) => {
|
const NewsCard = ({ ...props }) => {
|
||||||
console.log(props);
|
|
||||||
return (
|
return (
|
||||||
<div className="flex flex-col">
|
<div className="flex flex-col">
|
||||||
<img src="https://placekitten.com/320/170" />
|
<img src={`https://picsum.photos/320/170?${Math.random()}`} alt={props.frontmatter.title} />
|
||||||
<Link to={props.fields.slug} className="text-xl mt-6 hover:text-primary transition-colors duration-200">
|
<Link to={props.fields.slug} className="text-xl mt-6 hover:text-primary transition-colors duration-200">
|
||||||
{props.frontmatter.title}
|
{props.frontmatter.title}
|
||||||
</Link>
|
</Link>
|
||||||
|
|
|
@ -4,14 +4,14 @@ import Layout, { Section, SectionTitle } from "../components/Layout";
|
||||||
import { Aside } from "../components/News";
|
import { Aside } from "../components/News";
|
||||||
import SEO from "../components/seo";
|
import SEO from "../components/seo";
|
||||||
import { TwitterShareButton, LinkedinShareButton, FacebookShareButton } from "react-share";
|
import { TwitterShareButton, LinkedinShareButton, FacebookShareButton } from "react-share";
|
||||||
import { TwitterSmall, LinkedinSmall, FacebookSmall } from "../components/Icons";
|
import { TwitterSmall, LinkedinSmall } from "../components/Icons";
|
||||||
|
|
||||||
const BlogPostTemplate = ({ data, location }) => {
|
const BlogPostTemplate = ({ data, location }) => {
|
||||||
const post = data.markdownRemark;
|
const post = data.markdownRemark;
|
||||||
const siteTitle = data.site.siteMetadata?.title || `Title`;
|
const siteTitle = data.site.siteMetadata?.title || `Title`;
|
||||||
// const { previous, next } = data;
|
// const { previous, next } = data;
|
||||||
|
|
||||||
console.log(post);
|
// console.log(post);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Layout location={location} title={siteTitle}>
|
<Layout location={location} title={siteTitle}>
|
||||||
|
@ -31,13 +31,21 @@ const BlogPostTemplate = ({ data, location }) => {
|
||||||
<div className="flex items-center">
|
<div className="flex items-center">
|
||||||
<div class="text-xs uppercase mr-4">Share</div>
|
<div class="text-xs uppercase mr-4">Share</div>
|
||||||
|
|
||||||
<TwitterShareButton url={location.href} title={post.frontmatter.title}>
|
<TwitterShareButton url={location.href} title={post.frontmatter.title} hashtags={[]}>
|
||||||
<TwitterSmall />
|
<TwitterSmall />
|
||||||
</TwitterShareButton>
|
</TwitterShareButton>
|
||||||
|
|
||||||
<LinkedinShareButton url={location.href} title={post.frontmatter.title}>
|
<LinkedinShareButton
|
||||||
|
url={location.href}
|
||||||
|
title={post.frontmatter.title}
|
||||||
|
summary={post.frontmatter.description}
|
||||||
|
>
|
||||||
<LinkedinSmall />
|
<LinkedinSmall />
|
||||||
</LinkedinShareButton>
|
</LinkedinShareButton>
|
||||||
|
|
||||||
|
<FacebookShareButton url={location.href} quote={post.frontmatter.title}>
|
||||||
|
<LinkedinSmall />
|
||||||
|
</FacebookShareButton>
|
||||||
</div>
|
</div>
|
||||||
</aside>
|
</aside>
|
||||||
<section dangerouslySetInnerHTML={{ __html: post.html }} itemProp="articleBody" className="col-span-2" />
|
<section dangerouslySetInnerHTML={{ __html: post.html }} itemProp="articleBody" className="col-span-2" />
|
||||||
|
|
Reference in New Issue