Добавляет новые макеты и задачи

src/layouts/task.njk

@@ -110,7 +110,7 @@
               </ul>
             </div>
           {% endif %}
-          {% if articles %}
+          {% if articles.length %}
             <div class="layout-content">
               <h2 class="layout-content__caption">Полезные материалы:</h2>
               <ul class="list-reset layout-content__articles">

src/projects/F&B/index.md

@@ -0,0 +1,27 @@
+---
+date: 2024-01-19
+title: "F&B"
+description: "Коллекция природных артефактов"
+cover: "img/cover.jpg"
+cover2x: "img/cover_2x.jpg"
+mainPageImage: "img/main-page-image.jpg"
+mainPageImage2x: "img/main-page-image_2x.jpg"
+image: "img/inner-image.jpg"
+image2x: "img/inner-image_2x.jpg"
+author: ""
+levels:
+  - easy
+figmaLink: "https://www.figma.com/file/fG61Ja1ye0jtkKbuvt9OR0/%D0%9A%D0%BE%D0%BB%D0%BB%D0%B5%D0%BA%D1%86%D0%B8%D1%8F-%D0%BF%D1%80%D0%B8%D1%80%D0%BE%D0%B4%D0%BD%D1%8B%D1%85-%D0%B0%D1%80%D1%82%D0%B5%D1%84%D0%B0%D0%BA%D1%82%D0%BE%D0%B2?type=design&node-id=0%3A1&mode=design&t=eiPphBBbc5LSCPAZ-1"
+previewLink: ""
+previewAuthor: ""
+skills: [
+  "Сетка (flex или grid)", "Декоративные элементы", "Псевдоэлементы"
+]
+props: [
+  'Одностраничный', 'С адаптивом'
+]
+articles: ""
+easyText: ''
+language: "ru"
+layout: "project.njk"
+---

src/projects/afisha/index.md

@@ -0,0 +1,27 @@
+---
+date: 2024-01-19
+title: "Afisha"
+description: "Сайт-афиша театра"
+cover: "img/cover.jpg"
+cover2x: "img/cover_2x.jpg"
+mainPageImage: "img/main-page-image.jpg"
+mainPageImage2x: "img/main-page-image_2x.jpg"
+image: "img/inner-image.jpg"
+image2x: "img/inner-image_2x.jpg"
+author: ""
+levels:
+  - easy
+figmaLink: "https://www.figma.com/file/YGKmhpqqJtzxo4QHP1igUU/%D0%90%D1%84%D0%B8%D1%88%D0%B0?type=design&node-id=0%3A1&mode=design&t=TyAx5nXj4XEs3Ncx-1"
+previewLink: ""
+previewAuthor: ""
+skills: [
+  "Сетка (flex или grid)", "Анимация", "Элементы формы", "Декоративные элементы", "Псевдоэлементы"
+]
+props: [
+  'Одностраничный'
+]
+articles: ""
+easyText: ''
+language: "ru"
+layout: "project.njk"
+---

src/tasks/3d-hover-effekt/index.md

@@ -0,0 +1,30 @@
+---
+date: 2024-01-19
+title: "3D ховер-эффект"
+description: "Задача на отработку 3D-анимации"
+image: "img/inner-image.jpg"
+image2x: "img/inner-image_2x.jpg"
+levels2:
+  - normal
+taskLink: "https://codepen.io/verstaem_online/pen/OJqmOaj"
+answerLink: "https://codepen.io/verstaem_online/pen/XWGRzyw"
+taskImage: ""
+taskVideo: "https://media.verstaem.online/tasks/3d-hover-effekt/task.mp4"
+skills: [
+  "CSS", "Transform"
+]
+props: [
+  'HTML', 'CSS'
+]
+articles: [
+  {
+    link: "https://doka.guide/css/transform/",
+    text: "Transform | Дока"
+  },
+]
+layout: "task.njk"
+---
+
+## Что конкретно нужно сделать?
+
+Ваша задача - с помощью только CSS-кода реализовать ховер-эффект как на видео.

src/tasks/raspolozhit-v-stroku/index.md

@@ -0,0 +1,31 @@
+---
+date: 2024-01-19
+title: "Расположить в строку шестью способами"
+description: "Задача на отработку различных свойств по размещению элементов"
+image: "img/inner-image.jpg"
+image2x: "img/inner-image_2x.jpg"
+levels2:
+  - normal
+taskLink: "https://codepen.io/verstaem_online/pen/oNVWorx"
+answerLink: "https://codepen.io/verstaem_online/pen/PoLmOrJ"
+taskImage: "img/task.png"
+taskVideo: ""
+skills: [
+  "CSS", "Grid", "Flex"
+]
+props: [
+  'HTML', 'CSS'
+]
+articles: []
+layout: "task.njk"
+---
+
+## Что конкретно нужно сделать?
+
+Ваша задача - с помощью CSS расположить элементы в строку шестью способами.
+Дополнительные условия:
+1. у каждого блока должна быть обводка (бордер) толщиной 10 пикселей
+2. все блоки должны быть равны, и ширина их - 1\3 от ширины их родителя (родитель на всю ширину)
+3. между элементами не должно быть отступов
+4. HTML менять, конечно, нельзя. Так же нельзя использовать псевдоэлементы, абсолют, и инлайн, если использовался инлайн-блок
+5. Не должно быть JS