component---src-pages-blog-tsx-019621a766b637ec9492.js.map

{"version":3,"sources":["webpack:///./node_modules/reactstrap/es/CardBody.js","webpack:///./src/components/Header.tsx","webpack:///./node_modules/reactstrap/es/CardTitle.js","webpack:///./src/components/Blog.jsx","webpack:///./src/pages/blog.tsx","webpack:///./node_modules/reactstrap/es/Card.js","webpack:///./src/assets/img/ReactGrid-illustration05.png"],"names":["_excluded","CardBody","props","className","cssModule","innerRef","Tag","tag","attributes","classes","createElement","ref","defaultProps","Header","React","style","backgroundImage","bg","filter","Container","Row","marginTop","Col","md","xs","children","BlogPost","_ref3","node","blogRoute","linkUrl","fields","slug","Card","lg","Link","to","Img","fluid","frontmatter","thumbnail","childImageSharp","CardTitle","title","excerpt","authorImg","top","author","date","BlogView","_ref","posts","blogPosts","map","_ref2","key","Blog","data","description","pages","social","site","siteMetadata","allMdx","edges","blogPageRoute","find","page","id","route","Layout","SEO","color","body","inverse","outline","module","exports"],"mappings":"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","file":"component---src-pages-blog-tsx-019621a766b637ec9492.js","sourcesContent":["import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"className\", \"cssModule\", \"innerRef\", \"tag\"];\nimport React from 'react';\nimport classNames from 'classnames';\nimport { mapToCssModules, tagPropType } from './utils';\nvar defaultProps = {\n  tag: 'div'\n};\nvar CardBody = function CardBody(props) {\n  var className = props.className,\n    cssModule = props.cssModule,\n    innerRef = props.innerRef,\n    Tag = props.tag,\n    attributes = _objectWithoutPropertiesLoose(props, _excluded);\n  var classes = mapToCssModules(classNames(className, 'card-body'), cssModule);\n  return /*#__PURE__*/React.createElement(Tag, _extends({}, attributes, {\n    className: classes,\n    ref: innerRef\n  }));\n};\nCardBody.defaultProps = defaultProps;\nexport default CardBody;","import React from 'react';\r\n\r\nimport {\r\n  Container,\r\n  Row,\r\n  Col\r\n} from \"reactstrap\";\r\n\r\nimport bg from \"../assets/img/ReactGrid-illustration05.png\";\r\n\r\nconst Header = (props) => {\r\n  return (\r\n    <div className=\"blog-page-header header-medium\">\r\n      <div\r\n        className=\"page-header-image\"\r\n        style={{ backgroundImage: `url(${bg})`, filter: 'blur(15px)' }}\r\n      />\r\n      <Container>\r\n        <Row className=\"text-left\" style={{ marginTop: 66 }}> {/*  66- height if navbar */}\r\n          <Col md=\"6\" xs=\"12\">\r\n            <h1 className=\"display-2\">Latest blogposts</h1>\r\n            <p className=\"display-4\">Read our newsfeed</p>\r\n            {props.children}\r\n          </Col>\r\n        </Row>\r\n      </Container>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default Header;","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"className\", \"cssModule\", \"tag\"];\nimport React from 'react';\nimport classNames from 'classnames';\nimport { mapToCssModules, tagPropType } from './utils';\nvar defaultProps = {\n  tag: 'div'\n};\nvar CardTitle = function CardTitle(props) {\n  var className = props.className,\n    cssModule = props.cssModule,\n    Tag = props.tag,\n    attributes = _objectWithoutPropertiesLoose(props, _excluded);\n  var classes = mapToCssModules(classNames(className, 'card-title'), cssModule);\n  return /*#__PURE__*/React.createElement(Tag, _extends({}, attributes, {\n    className: classes\n  }));\n};\nCardTitle.defaultProps = defaultProps;\nexport default CardTitle;","import React from 'react';\r\nimport {\r\n  Card,\r\n  CardBody,\r\n  CardTitle,\r\n  Container,\r\n  Row,\r\n  Col\r\n} from \"reactstrap\";\r\nimport Img from 'gatsby-image'\r\nimport { Link } from 'gatsby';\r\n\r\nconst BlogView = ({ posts, blogRoute }) => {\r\n  const blogPosts = posts?.map(({ node }) => {\r\n    return <BlogPost key={node.fields.slug} node={node} blogRoute={blogRoute} />\r\n  });\r\n  return (\r\n    <section className=\"section\">\r\n      <Container>\r\n        <Row>\r\n          <Col className=\"ml-auto mr-auto\" md=\"10\">\r\n            {blogPosts}\r\n          </Col>\r\n        </Row>\r\n      </Container>\r\n    </section>\r\n  )\r\n}\r\n\r\nconst BlogPost = ({ node, blogRoute }) => {\r\n  const linkUrl = blogRoute + node.fields.slug;\r\n  return (\r\n    <Card className=\"card-blog card-plain blog-horizontal my-5\">\r\n      <Row>\r\n        <Col lg=\"4\">\r\n          <div className=\"card-image h-100 img-raised\">\r\n            <Link to={linkUrl} className=\"h-100\">\r\n              <Img fluid={node.frontmatter.thumbnail.childImageSharp.fluid} className=\"img rounded h-100\" />\r\n            </Link>\r\n          </div>\r\n        </Col>\r\n        <Col lg=\"8\">\r\n          <CardBody>\r\n            <CardTitle tag=\"h3\">\r\n              <Link to={linkUrl}>{node.frontmatter.title}</Link>\r\n            </CardTitle>\r\n            <p className=\"card-description text-muted mb-0\">\r\n              {node.excerpt || ''}{\" \"}\r\n              <Link to={linkUrl}>read more</Link>\r\n            </p>\r\n            <div className=\"author\">\r\n              <Img fluid={node.frontmatter.authorImg.childImageSharp.fluid} className=\"avatar img-raised\" />\r\n              <div className=\"text\" style={{ top: '-42px' }}>\r\n                <span className=\"text-muted\">Written by {node.frontmatter.author}</span>\r\n                <div className=\"meta text-black\">{node.frontmatter.date}</div>\r\n              </div>\r\n            </div>\r\n          </CardBody>\r\n        </Col>\r\n      </Row>\r\n    </Card>\r\n  )\r\n}\r\n\r\nexport default BlogView;\r\n","import React from \"react\";\r\nimport { graphql } from \"gatsby\";\r\nimport Layout from \"../components/layout\";\r\nimport SEO from \"../components/seo\";\r\nimport Header from \"../components/Header\";\r\nimport BlogView from \"../components/Blog\";\r\n\r\n\r\nconst Blog = (props) => {\r\n  const { data } = props;\r\n  const { title, description, pages, social } = data.site.siteMetadata;\r\n  const posts = data.allMdx.edges;\r\n  const blogPage = pages.find(page => page.id === 'blog');\r\n  const blogPageRoute = blogPage.route;\r\n\r\n  return (\r\n    <Layout pages={pages} social={social} description={description} title={title}>\r\n      <SEO title={'Blog'} description={`Explore ReactGrid and unleash the potential of all your React apps with tips, tools, and practices`} />\r\n      <Header />\r\n      <BlogView posts={posts} blogRoute={blogPageRoute} />\r\n    </Layout>\r\n  )\r\n}\r\n\r\nexport default Blog\r\n\r\nexport const pageQuery = graphql`\r\n  query BlogPostsQuery {\r\n    site {\r\n      ...SiteMetadata\r\n    }\r\n    allMdx(sort: { fields: [frontmatter___date], order: DESC },\r\n      filter: {frontmatter: {posttype: {eq: \"blog\"}, published: {eq: true}}}\r\n      ) {\r\n      edges {\r\n        node {\r\n          excerpt\r\n          fields {\r\n            slug\r\n          }\r\n          frontmatter {\r\n            ...BlogPostNode\r\n            authorImg {\r\n              childImageSharp {\r\n                fluid(maxWidth: 120) {\r\n                  ...Fluid\r\n                }\r\n              }\r\n            }\r\n            thumbnail {\r\n              childImageSharp {\r\n                fluid(maxWidth: 900) {\r\n                  ...Fluid\r\n                }\r\n              }\r\n            }\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n`\r\n","import _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nvar _excluded = [\"className\", \"cssModule\", \"color\", \"body\", \"inverse\", \"outline\", \"tag\", \"innerRef\"];\nimport React from 'react';\nimport classNames from 'classnames';\nimport { mapToCssModules, tagPropType } from './utils';\nvar defaultProps = {\n  tag: 'div'\n};\nvar Card = function Card(props) {\n  var className = props.className,\n    cssModule = props.cssModule,\n    color = props.color,\n    body = props.body,\n    inverse = props.inverse,\n    outline = props.outline,\n    Tag = props.tag,\n    innerRef = props.innerRef,\n    attributes = _objectWithoutPropertiesLoose(props, _excluded);\n  var classes = mapToCssModules(classNames(className, 'card', inverse ? 'text-white' : false, body ? 'card-body' : false, color ? (outline ? 'border' : 'bg') + \"-\" + color : false), cssModule);\n  return /*#__PURE__*/React.createElement(Tag, _extends({}, attributes, {\n    className: classes,\n    ref: innerRef\n  }));\n};\nCard.defaultProps = defaultProps;\nexport default Card;","module.exports = __webpack_public_path__ + \"static/ReactGrid-illustration05-99d30443a8b291bd852299c55e030400.png\";"],"sourceRoot":""}