fixed styles issue

config.js

@@ -4,6 +4,8 @@ let config = {
   notGetBlocks: ["blocks-demo.html"],
   ignoredBlocks: ["no-js"],
   alwaysAddBlocks: [
+    "page-header",
+    "page-footer",
     // 'sprite-svg',
     // 'sprite-png',
     // 'object-fit-polyfill',
@@ -19,7 +21,7 @@ let config = {
   ],
   addJsAfter: ["./script.js"],
   addAssets: {
-    "src/img/demo-*.{png,svg,jpg,jpeg}": "img/",
+    "src/img/demo-*.{png,svg,jpg,jpeg,svg}": "img/",
     "src/fonts/Rosatom-Italic.ttf": "fonts/",
     "src/fonts/Rosatom-Light.ttf": "fonts/",
     "src/fonts/Rosatom-Regular.ttf": "fonts/",

src/blocks/page-footer/page-footer.pug

 //- Все примеси в этом файле должны начинаться c имени блока (page-footer)
 
-mixin page-footer(mods)
+mixin page-footer()
 
-  //- Принимает:
-  //-   mods  {string} - список модификаторов
-  //- Вызов:
-        +page-footer()
-          p «Подвал»
-  -
-    // список модификаторов
-    var allMods = '';
-    if(typeof(mods) !== 'undefined' && mods) {
-      var modsList = mods.split(',');
-      for (var i = 0; i < modsList.length; i++) {
-        allMods = allMods + ' page-footer--' + modsList[i].trim();
-      }
-    }
-
-  footer.page-footer(class=allMods, role='contentinfo')&attributes(attributes)
-    .page-footer__inner
-      block
+  footer.footer
+    .footer-left
+      .footer-left__heading
+        img(src="./img/logo.svg", alt="footer logo").left__heading-logo
+        ul.left__heading-socials
+          li.heading-socials__item._fb
+          li.heading-socials__item._inst
+          li.heading-socials__item._telegram
+      nav.footer-left__nav
+        ul
+          li
+            a(href="#") О Радоне
+          li
+            a(href="#") Онлайн-мониторинг
+          li
+            a(href="#") Экология
+          li
+            a(href="#") Филиалы
+          li
+            a(href="#") Фотогалерея
+          li
+            a(href="#") Контакты
+          li
+            a(href="#") Карьера
+          li
+            a(href="#") Видеогалерея
+          li
+            a(href="#") СМИ о нас
+          li
+            a(href="#") Новости
+          li
+            a(href="#") Направления деятельности
+          li
+            a(href="#") Журналистам
+          li
+            a(href="#") Услуги
+      .footer-left__subscribe
+        .left__subscribe-title Подписка на новости и рассылку
+        form(method="POST").left__subscribe-form
+          input(type="text", placeholder="Ваш E-mail")
+          button(type="submit") Подписаться
+      .footer-left__devs
+        span Разработка —
+        img(alt="developers")
+    .footer-right
+      .footer-right__contacts
+        .right__contacts-item
+          .contacts-item__title Отдел документационного обеспечения управления
+          ul.contacts-item__list
+            li Контактные данные службы одного окна:
+            li Тел: +7 (495) 545-57-33 (доб. 164, 247) 
+        .right__contacts-item
+          .contacts-item__title Московский офис
+          ul.contacts-item__list
+            li 119121, Москва, 7-й Ростовский пер, 2/14
+            li Тел: 8(495) 545-57-67
+            li E-mail: info@radon.ru
+        .right__contacts-item
+          .contacts-item__title НПК
+          ul.contacts-item__list
+            li 141335, Сергиево-Посадский район, Московской обл.,
+            li Тел.: +7 (495) 545-57-65
+            li E-mail: info@radon.ru
+      .footer-right__copyright © 2008–2020. Все права защищены. Государственная корпорация по атомной энергии «Росатом». При использовании материалов ссылка на сайт www.rosatom.ru обязательна

src/blocks/page-footer/page-footer.scss

@@ -2,4 +2,48 @@
 // модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
 // Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority
 
-.page-footer {}
+.footer {
+  color: #ffffff;
+  display: flex;
+
+  .footer-left {
+    display: flex;
+    align-items: flex-end;
+    flex-direction: column;
+    flex-basis: 50%;
+    background: #f9f9f9;
+    padding: 50px 60px 0 0;
+  }
+
+  .footer-right {
+    padding: 50px 0 120px 100px;
+    flex-basis: 50%;
+    background: #025ea1;
+
+    .footer-right__contacts {
+      font-size: 16px;
+      line-height: 21px;
+
+      .right__contacts-item {
+        margin-bottom: 40px;
+
+        .contacts-item__title {
+          font-weight: 700;
+        }
+
+        .contacts-item__list {
+          margin-top: 20px;
+          font-weight: 300;
+        }
+      }
+    }
+
+    .footer-right__copyright {
+      margin-top: 90px;
+      font-size: 15px;
+      line-height: 130%;
+      font-weight: 300;
+      max-width: 460px;
+    }
+  }
+}

src/blocks/page-header/page-header.pug

 //- Все примеси в этом файле должны начинаться c имени блока (page-header)
 
-mixin page-header(mods)
+mixin page-header()
 
-  //- Принимает:
-  //-   mods  {string} - список модификаторов
-  //- Вызов:
-        +page-header()
-          p «Шапка»
-  -
-    // список модификаторов
-    var allMods = '';
-    if(typeof(mods) !== 'undefined' && mods) {
-      var modsList = mods.split(',');
-      for (var i = 0; i < modsList.length; i++) {
-        allMods = allMods + ' page-header--' + modsList[i].trim();
-      }
-    }
-
-  header.page-header(class=allMods, role='banner')&attributes(attributes)
-    .page-header__inner
-      block
+  header.header
+    .container
+      .row
+        .col-lg-2
+          a(href="#")
+            img(src="./img/logo.png", alt="radon logo")
+        .col-lg-10
+          .header-menu-top
+            ul.header-menu-top__list
+              li
+                a(href="#") Онлайн-мониторинг
+              li
+                a(href="#") Наши услуги
+              li
+                a(href="#") Фотогалерея
+              li
+                a(href="#") Видеогалерея
+              li
+                a(href="#") Контакты
+              li
+                a(href="#") СМИ о нас
+            a(href="#", class="top__link") Обратная связь
+            ul.header-menu-top__lang
+              li
+                a(href="#", class="top__lang-ru")
+              li
+                a(href="#", class="top__lang-en")
+          .header-menu-bottom
+            ul.header-menu-bottom__list
+              li
+                a(href="#", class="header-menu-bottom__burger")
+              li
+                a(href="#") О Радоне
+              li
+                a(href="#") Филиалы
+              li
+                a(href="#") Карьера
+              li
+                a(href="#") Новости
+              li
+                a(href="#") Направление деятельности
+              li
+                a(href="#") Экология
+              li
+                a(href="#") Журналистам
+              li
+                a(href="#", class="header-menu-bottom__search")

src/blocks/page-header/page-header.scss

-// В этом файле должны быть стили для БЭМ-блока page-header, его элементов,
-// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
-// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority
+.header {
+  .header-menu-top {
+    .header-menu-top__list {
+      display: flex;
 
-.page-header {}
+      li {
+        a {
+          font-weight: 300;
+          text-decoration: underline;
+          padding: 19px 17.5px 26px;
+          display: block;
+
+          &:hover {
+          }
+        }
+
+        &:first-child a {
+          padding-left: 0;
+        }
+      }
+    }
+  }
+
+  .header-menu-bottom {
+    .header-menu-bottom__list {
+      display: flex;
+    }
+  }
+}

src/pages/index.pug

@@ -11,15 +11,11 @@ block nav
   +main-nav('10')
 
 block content
-  h1 Что сделано:
-  ul
-    li
-      a(href="#") Главная
-    hr
-    li
+  h1 Заголовок
+  p Содержимое. #[a(href='blocks-demo.html') Библиотека блоков].
 
-block footer
-  p footer
+//- block footer
+//-   p footer
 
 //- block append page-bottom
 //-   script(src='js/some.js')

src/scss/_vars.scss

+$fast-transition: .3s ease;
+$long-transition: .7s ease;
+
+$hover-blue: #003274;

src/scss/main.scss

+@import "../../node_modules/bootstrap/scss/bootstrap-grid.scss";
 @import "fonts";
+@import "vars";
 
 // === MAIN PREPARATIONS ===
 
@@ -33,4 +35,10 @@ body {
       color: #000000;
     }
   }
+
+  ul {
+    list-style: none;
+    padding-left: 0;
+    margin-bottom: 0;
+  }
 }