img

src/components/Description/Description.js

@@ -1,32 +0,0 @@
-import React from 'react';
-import { Grid, Row, Col } from 'react-flexbox-grid'
-import './Description.scss'
-
-import HelloIcon from '../../images/hello-icon.svg'
-
-const Description = () => {
-  return (
-    <section className="description">
-      <Grid fluid>
-        <Row>
-          <Col md={8} mdOffset={2}>
-            <div className="desctiption-content">
-              <div className="description-content__heading">
-                <span>devthread.ru</span><br />
-                <h1>публикуем статьи о мире веб-разрабоки и IT</h1>
-              </div>
-              <div className="description-content__info">
-                <p>
-                  сборник статей и руководств по тематике веб-разработки и IT для того чтобы помочь вам
-                </p>
-                <HelloIcon />
-              </div>
-            </div>
-          </Col>
-        </Row>
-      </Grid>
-    </section>
-  )
-}
-
-export default Description

src/components/Description/Description.scss

@@ -1,89 +0,0 @@
-@import '../../styles/variables.scss';
-
-.description {
-  text-align: center;
-  color: $black-clr;
-  margin-bottom: 35px;
-  & .description-content {
-    &__heading {
-      & span {
-        font-size: 24px;
-        font-weight: 700;
-      }
-      & h1 {
-        font-size: 48px;
-        font-weight: 700;
-      }
-    }
-    &__info {
-      margin-top: 25px;
-      & p {
-        font-size: 16px;
-        font-weight: 400;
-        margin-bottom: 10px;
-      }
-    }
-  }
-}
-
-.dark {
-  & .description {
-   color: $white-clr; 
-  }
-}
-
-@media (max-width: 991px) {
-  .description {
-    & .description-content {
-      &__heading {
-        & h1 {
-          font-size: 42px;
-        }
-      }
-    }
-  }
-}
-
-@media (max-width: 768px) {
-  .description {
-    & .description-content {
-      &__heading {
-        & span {
-          font-size: 18px;
-        }
-        & h1 {
-          font-size: 38px;
-        }
-      }
-    }
-  }
-}
-
-@media (max-width: 567px) {
-  .description {
-    & .description-content {
-      &__heading {
-        & h1 {
-          font-size: 34px;
-        }
-      }
-      &__info {
-        & p {
-          font-size: 14px;
-        }
-      }
-    }
-  }
-}
-
-@media (max-width: 400px) {
-  .description {
-    & .description-content {
-      &__heading {
-        & h1 {
-          font-size: 26px;
-        }
-      }
-    }
-  }
-}

src/pages/index.js

@@ -4,7 +4,6 @@ import { Main } from '../ui/ui'
 import { Grid, Row, Col } from 'react-flexbox-grid'
 import SEO from '../components/SEO/SEO'
 import Layout from '../components/Layout/Layout'
-import Description from '../components/Description/Description'
 import Articles from '../components/Articles/Articles'
 import Offers from '../components/Offers/Offers'
 import Newsletter from '../components/Newsletter/Newsletter'
@@ -15,7 +14,6 @@ const IndexPage = ({ data: { allMarkdownRemark: edges } }) => {
   return (
     <Layout>
       <SEO />
-      <Description />
       <Main>
         <Grid fluid>
           <Row>
@@ -45,7 +43,7 @@ const IndexPage = ({ data: { allMarkdownRemark: edges } }) => {
 
 export const query = graphql`
   {
-    allMarkdownRemark(filter: {frontmatter: {templateKey: {eq: "article"}}}, sort: {order: DESC, fields: frontmatter___date}, limit: 10) {
+    allMarkdownRemark(filter: {frontmatter: {templateKey: {eq: "article"}}}, sort: {order: DESC, fields: frontmatter___date}, limit: 12) {
       edges {
         node {
           frontmatter {

src/templates/articleTemplate.js

@@ -38,7 +38,7 @@ export const pageQuery = graphql`
         title
         image {
           childImageSharp {
-            fluid {
+            fluid(maxWidth: 1400) {
               ...GatsbyImageSharpFluid
             }
           }