From 4d2db20caf5a7dd4714f33742fe14e4b6cf8a70e Mon Sep 17 00:00:00 2001
From: Sergey Yarkov <serzh.yarkov@gmail.com>
Date: Mon, 17 Aug 2020 15:40:43 +0300
Subject: [PATCH] articles more images quality

---
 .../Articles/ArticleCard/ArticleCard.scss          | 14 ++++++++++++--
 src/hooks/useMoreArticlesQuery.js                  |  2 +-
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/src/components/Articles/ArticleCard/ArticleCard.scss b/src/components/Articles/ArticleCard/ArticleCard.scss
index 5da5c27..081789f 100644
--- a/src/components/Articles/ArticleCard/ArticleCard.scss
+++ b/src/components/Articles/ArticleCard/ArticleCard.scss
@@ -9,7 +9,7 @@
     & img {
       border-radius: 7px;
       width: 100%;
-      height: 260px;
+      height: 240px;
       object-fit: cover;
     }
   }
@@ -66,6 +66,16 @@
 @media (max-width: 768px) {
   .article-card {
     width: 100%;
+    &__image {
+      & img {
+        height: 400px;
+      }
+    }
+  }
+}
+
+@media (max-width: 568px) {
+  .article-card {
     &__image {
       & img {
         height: 300px;
@@ -74,7 +84,7 @@
   }
 }
 
-@media (max-width: 400px) {
+@media (max-width: 430px) {
   .article-card {
     width: 100%;
     &__image {
diff --git a/src/hooks/useMoreArticlesQuery.js b/src/hooks/useMoreArticlesQuery.js
index de49d06..cfdcab7 100644
--- a/src/hooks/useMoreArticlesQuery.js
+++ b/src/hooks/useMoreArticlesQuery.js
@@ -17,7 +17,7 @@ const useMoreArticlesQuery = () => {
               title
               image {
                 childImageSharp {
-                  fluid {
+                  fluid(maxWidth: 650 quality: 100) {
                     ...GatsbyImageSharpFluid
                   }
                 }