styles

content/articles/2021-01-23_управление-контентом-для-сайта-gatsbyjs-с-помощью-netlifycms.md

@@ -32,7 +32,6 @@ tags:
 
 * [Основные преимущества использования Netlify CMS](#Основные-преимущества-использования-Netlify-CMS)
 * [Создание сайт-блога на основе GatsbyJS](#Создание-сайт-блога-на-основе-GatsbyJS)
-
   * [Заготовка проекта](#Заготовка-проекта)
   * [Добавление страниц](#Добавление-страниц)
   * [О файле gatsby-config.js](#О-файле-gatsby-config.js)
@@ -1015,7 +1014,7 @@ git push origin main
 
 Создание GatsbyJS сайта вместе с NetlifyCMS оказалась не очень сложной задачей. NetlifyCMS отлично подойдет в роли не сложной админки для управления контентом на сайте. В статье не затронута такая вещь как [Publish mode](https://www.netlifycms.org/docs/configuration-options/#publish-mode), которая позволяет контролировать этапы публикации контента. Вы можете прочитать о ней самостоятельно.
 
-🔗 Ниже распологаются полезные ссылки для изучения GatsbyJS и NetlifyCMS.
+🔗 Ниже распологаются полезные ссылки:
 
 * [Документция GatsbyJS](https://www.gatsbyjs.com/docs/)
 * [Документация NetlifyCMS](https://www.netlifycms.org/docs/intro/)

gatsby-config.js

@@ -212,7 +212,7 @@ module.exports = {
           {
             resolve: `gatsby-remark-images`,
             options: {
-              maxWidth: 900,
+              maxWidth: 970,
               quality: 100,
               withWebp: true,
               loading: "lazy",

src/styles/global.scss

@@ -107,15 +107,21 @@ article .gt-container {
   & p img {
     text-align: center;
     border-radius: 7px;
+    border: 1px solid #f0f0f0;
   }
 
   & ul {
     margin-left: 34px;
-    margin-bottom: 15px;
+    margin-bottom: 5px;
 
     & li {
       padding: 7px 0;
-
+      & p {
+        display: inline-block;
+        font-size: 16px;
+        position: relative;
+        right: 4px;
+      }
       &::before {
         content: "\2022";
         color: #6394F7;
@@ -327,6 +333,9 @@ article .gt-container {
   }
   & .inner {
     border-bottom: 1px solid rgba(153, 153, 153, 0.2);
+    & p img {
+      border: 1px solid #505050;
+    }
     .gatsby-highlight pre[class*="language-"] {
       background: #282c34;
       & code {