Завершил добавление pug

6ba0b400 · Nikolay Gromov · 77749b3b · 6ba0b400 · 6ba0b400 · 6ba0b400
Commit 6ba0b400 authored Dec 07, 2017 by Nikolay Gromov
25 changed files
--- a/.npmrc
+++ b/.npmrc
-loglevel=silent
+# loglevel=silent
--- a/.pug-lintrc
+++ b/.pug-lintrc
+{
+  "validateExtensions": true,
+  "validateDivTags": true,
+  "validateAttributeSeparator": { "separator": ", ", "multiLineSeparator": ",\n " },
+  "validateAttributeQuoteMarks": "'",
+  "requireSpecificAttributes": [ { "img": [ "src", "alt" ] } ],
+  "requireSpaceAfterCodeOperator": true,
+  "requireLowerCaseTags": true,
+  "requireLowerCaseAttributes": true,
+  "requireClassLiteralsBeforeIdLiterals": true,
+  "requireClassLiteralsBeforeAttributes": true,
+  "disallowTrailingSpaces": true,
+  "disallowSpacesInsideAttributeBrackets": true,
+  "disallowLegacyMixinCall": true,
+  "disallowDuplicateAttributes": true
+}
--- a/README.md
+++ b/README.md
@@ -58,7 +58,7 @@
 - Диспетчер подключения стилей `./src/scss/style.scss` генерируется автоматически при старте любой gulp-задачи (на основе данных из `./projectConfig.json`).
 - Список pug-примесей `./src/pug/mixins.pug` генерируется автоматически при старте любой gulp-задачи (на основе данных из `./projectConfig.json`).
 - Для разметки используется [pug](https://pugjs.org/api/getting-started.html).
- Перед созданием коммита запускается проверка стилевых файлов, входящих в коммит.
+- Перед созданием коммита запускается проверка стилевых файлов, входящих в коммит и всех pug-файлов. При выявлении ошибок, коммит не происходит.

--- a/gulpfile.js
+++ b/gulpfile.js
@@ -419,6 +419,13 @@ gulp.task('pug', function() {
    .pipe(gulp.dest(dirs.buildPath));
 });
+gulp.task('test:pug', function () {
+  const pugLinter = require('gulp-pug-lint');
+  return gulp
+    .src('src/**/*.pug')
+    .pipe(pugLinter());
+});
 // Конкатенация и углификация Javascript
 gulp.task('js', function (callback) {
  const uglify = require('gulp-uglify');

--- a/package.json
+++ b/package.json
@@ -10,17 +10,21 @@
  },
  "scripts": {
    "test:style": "stylelint \"src/**/*.scss\" --syntax=scss",
+    "test:editorconfig": "editorconfig-cli src/**/*.{js,pug}",
    "start": "gulp",
    "deploy": "cross-env NODE_ENV=production ./node_modules/.bin/gulp build && cross-env ./node_modules/.bin/gulp deploy",
    "build": "cross-env NODE_ENV=production npm start build",
    "lint-staged": "lint-staged",
-    "precommit": "lint-staged"
+    "precommit": "lint-staged && gulp test:pug"
  },
  "lint-staged": {
+    "*.js": "editorconfig-cli",
+    "*.pug": "editorconfig-cli",
    "*.css": "stylelint",
    "*.scss": "stylelint --syntax=scss"
  },
  "devDependencies": {
+    "@htmlacademy/editorconfig-cli": "^1.0.0",
    "autoprefixer": "^7.1.1",
    "browser-sync": "^2.18.8",
    "const": "^1.0.0",
@@ -41,6 +45,7 @@
    "gulp-plumber": "^1.1.0",
    "gulp-postcss": "^7.0.0",
    "gulp-pug": "^3.3.0",
+    "gulp-pug-lint": "git+https://github.com/nicothin/gulp-pug-lint.git",
    "gulp-real-favicon": "^0.2.2",
    "gulp-rename": "^1.2.2",
    "gulp-replace": "^0.6.1",

--- a/src/blocks-demo.pug
+++ b/src/blocks-demo.pug
@@ -45,7 +45,7 @@ block append head
  //- script(src='js/SOME.js')
 block off-canvas
-  ul#off-canvas-menu.menu
+  ul.menu#off-canvas-menu
 block header
@@ -66,9 +66,9 @@ block content
      - var realId = id
    section.blocks-library__item(id=id, data-id=realId)(class= sep ? 'blocks-library__item--menusep' : '')
      h2.blocks-library__item-title
-        a(href=repoUrl + '/tree/master/src/blocks/' + realId, class="blocks-library__item-title-link", title="Папка блока в репозитории")
+        a(href=repoUrl + '/tree/master/src/blocks/' + realId, class='blocks-library__item-title-link', title='Папка блока в репозитории')
-          svg(width="20", height="20")
+          svg(width='20', height='20')
-            use(xlink:href="#folder")
+            use(xlink:href='#folder')
        != title
      block
@@ -91,10 +91,10 @@ block content
-  h1 Блоки стартового репозитория #[a(href="index.html") проекта]
+  h1 Блоки стартового репозитория #[a(href='index.html') проекта]
  +block-lib('page', 'Страница', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/page/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/page/readme.md
    +block-lib-code()
      pre.code
        code &lt;!DOCTYPE html>
@@ -109,75 +109,75 @@ block content
        code &lt;/html>
  +block-lib('typo', 'Текст, теги', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/typo/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/typo/readme.md
  +block-lib('sprite-svg', 'SVG-спрайт c <a href="https://github.com/w0rm/gulp-svgstore">gulp-svgstore</a>', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/sprite-svg/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/sprite-svg/readme.md
  +block-lib('sprite-png', 'PNG-спрайт с <a href="https://github.com/Ensighten/spritesmith">spritesmith</a>', true)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/sprite-png/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/sprite-png/readme.md
  +block-lib('page-header', '«Шапка» страницы', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/page-header/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/page-header/readme.md
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/page-header/page-header.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/page-header/page-header.pug
  +block-lib('page-footer', '«Подвал» страницы', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/page-footer/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/page-footer/readme.md
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/page-footer/page-footer.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/page-footer/page-footer.pug
  +block-lib('logo', 'Логотип', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/logo/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/logo/readme.md
    +logo('/')
      img(src='img/logo.svg', alt='Logo', width='64', height='15')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/logo/logo.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/logo/logo.pug
  +block-lib('main-nav', 'Главная навигация', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/main-nav/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/main-nav/readme.md
    +main-nav('1')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/main-nav/main-nav.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/main-nav/main-nav.pug
  +block-lib('close', 'Закрыть', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/close/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/close/readme.md
    div
      +close('Закрыть')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/close/close.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/close/close.pug
  +block-lib('burger', 'Бургер', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/burger/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/burger/readme.md
    div
      +burger('Показать пример кода', 'burger-code', 'blocks-library__code--shown')
    +block-lib-code('burger-code', true)
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/burger/burger.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/burger/burger.pug
  +block-lib('code', 'Код', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/code/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/code/readme.md
    +code()
      code &lt;div class="some">...&lt;/div>
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/code/code.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/code/code.pug
  +block-lib('thumb', 'Картинки-миниатюры', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/thumb/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/thumb/readme.md
    +thumb('img/joker.jpg', 'Джокер', 300, 200)
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/thumb/thumb.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/thumb/thumb.pug
  +block-lib('alert', 'Сообщения', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/alert/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/alert/readme.md
    +alert()
      p Обычное сообщение
    +alert('Заголовок', 'warning, some-mod-name')
      p Блок сообщения с модификаторами.
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/alert/alert.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/alert/alert.pug
  +block-lib('menu', 'Меню', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/menu/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/menu/readme.md
    -
      var myMenu = [
        {
@@ -196,24 +196,24 @@ block content
      ];
    +menu(myMenu)
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/menu/menu.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/menu/menu.pug
  +block-lib('label', 'Лейбл', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/label/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/label/readme.md
    +label('Текст1')
    +label('Текст2', '', 'div')
-    +label('Текст3', '', 'a')(href="/")
+    +label('Текст3', '', 'a')(href='/')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/label/label.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/label/label.pug
  +block-lib('loader', 'Загрузчик', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/loader/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/loader/readme.md
    +loader()
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/loader/loader.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/loader/loader.pug
  +block-lib('table', 'Таблица', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/table/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/table/readme.md
    +table()
      caption Таблица
      tr
@@ -235,10 +235,10 @@ block content
        td Пользователь
        td Нижняя
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/table/table.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/table/table.pug
  +block-lib('table-responsive', 'Адаптивная таблица', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/table-responsive/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/table-responsive/readme.md
    +table-responsive()
      caption Таблица
      thead
@@ -253,10 +253,10 @@ block content
          td(data-label='Имя и фамилия') Джакомо Казанова
          td(data-label='Тип мироощущения') Небольшая распущенность с лёгкой примесью леденящих душу извращений, чудовищной лжи и имитатора известного органа, обитого телячьей кожей.
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/table-responsive/table-responsive.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/table-responsive/table-responsive.pug
  +block-lib('pagination', 'Пагинация', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/pagination/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/pagination/readme.md
    +pagination()
      +pagination-item('1', '/1')
      +pagination-item('...')
@@ -266,33 +266,33 @@ block content
      +pagination-item('...')
      +pagination-item('999', '/999')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/pagination/pagination.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/pagination/pagination.pug
  +block-lib('breadcrumbs', 'Хлебные крошки', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/breadcrumbs/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/breadcrumbs/readme.md
    +breadcrumbs()
      +breadcrumbs-item('Главная', '/home')
      +breadcrumbs-item('Услуги', '/services')
      +breadcrumbs-item('Стриптиз')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/breadcrumbs/breadcrumbs.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/breadcrumbs/breadcrumbs.pug
  +block-lib('progress', 'Прогресс', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/progress/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/progress/readme.md
    +progress('30', '30% (без копеек)', 'success')(aria-valuemin='0', aria-valuemax='100')
-    +progress('10')(style="height:10px")
+    +progress('10')(style='height:10px')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/progress/progress.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/progress/progress.pug
  +block-lib('pie-chart', 'Круговые и секторные диаграммы', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/pie-chart/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/pie-chart/readme.md
    +pie-chart('30')
-    +pie-chart('64')(data-size="120" data-border="59.9")
+    +pie-chart('64')(data-size='120', data-border='59.9')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/pie-chart/pie-chart.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/pie-chart/pie-chart.pug
  +block-lib('comment', 'Комментарий', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/comment/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/comment/readme.md
    +comment({
      username: 'Джокер',
      avatarURL: 'img/joker.jpg',
@@ -313,10 +313,10 @@ block content
      content: '<p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты.</p>',
    })
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/comment/comment.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/comment/comment.pug
  +block-lib('embed-responsive', 'Адаптирующийся медиаконтент', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/embed-responsive/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/embed-responsive/readme.md
    style.
      @media (min-width: 768px) {
        .embed-responsive-demo {
@@ -332,24 +332,24 @@ block content
          padding-left: 5px;
        }
      }
-    div.embed-responsive-demo
+    .embed-responsive-demo
-      div.embed-responsive-demo__item
+      .embed-responsive-demo__item
        +embed-responsive('4-3')
          iframe(src='https://www.youtube.com/embed/7pOr3dBFAeY', frameborder='0', allowfullscreen='')
-      div.embed-responsive-demo__item
+      .embed-responsive-demo__item
        +embed-responsive()
          iframe(src='https://www.youtube.com/embed/B0Q1rKpDNE4', frameborder='0', allowfullscreen='')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/embed-responsive/embed-responsive.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/embed-responsive/embed-responsive.pug
  +block-lib('tooltip', 'Подсказки', true)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/tooltip/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/tooltip/readme.md
    p Текст и подсказка: #[+tooltip('Текст подсказки может быть длинным. Хочется, чтобы <em>внутри</em> <small>можно было</small> <i>использовать</i> <b>разметку</b>.')]
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/tooltip/tooltip.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/tooltip/tooltip.pug
  +block-lib('btn', 'Кнопка', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/btn/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/btn/readme.md
    p.
      #[+btn('Кнопка-ссылка')(href='/')]
      #[+btn('Кнопка-input', '', true)(name='submit')]
@@ -359,10 +359,10 @@ block content
      #[+btn('Кнопка-input', '', true)(name='submit', disabled='')]
      #[+btn('Кнопка-button', 'main')(disabled='')]
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/btn/btn.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/btn/btn.pug
  +block-lib('field-text', 'Текстовое поле', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/field-text/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/field-text/readme.md
    +field-text({
      title: 'Текстовое поле',
      helpText: 'Подсказка под полем',
@@ -384,10 +384,10 @@ block content
    })
    +field-text()
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/field-text/field-text.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/field-text/field-text.pug
  +block-lib('field-checkbox', 'Флажок/чекбокс', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/field-checkbox/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/field-checkbox/readme.md
    +field-checkbox([
      {
        title: 'Чекбокс без группы',
@@ -416,10 +416,10 @@ block content
      },
    ], 'Общее необязательное название')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/field-checkbox/field-checkbox.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/field-checkbox/field-checkbox.pug
  +block-lib('field-radio', 'Радиокнопки', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/field-radio/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/field-radio/readme.md
    +field-radio([
      {
        title: 'Первый',
@@ -438,10 +438,10 @@ block content
      },
    ], 'Общее необязательное название')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/field-radio/field-radio.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/field-radio/field-radio.pug
  +block-lib('field-toggler', 'Переключатель', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/field-toggler/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/field-toggler/readme.md
    +field-toggler([
      {
        title: 'Одиночный переключатель',
@@ -470,10 +470,10 @@ block content
      },
    ], 'Две радиокнопки', true)
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/field-toggler/field-toggler.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/field-toggler/field-toggler.pug
  +block-lib('field-file', 'Файл', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/field-file/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/field-file/readme.md
    +field-file({
      title: 'Название',
      helpText: 'Подсказка',
@@ -495,10 +495,10 @@ block content
      },
    })
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/field-file/field-file.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/field-file/field-file.pug
  +block-lib('field-range', 'Ползунок', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/field-range/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/field-range/readme.md
    +field-range({
      title: 'Название',
      helpText: 'Подсказка',
@@ -512,10 +512,10 @@ block content
      }
    })
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/field-range/field-range.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/field-range/field-range.pug
  +block-lib('field-select', 'Селекты', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/field-select/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/field-select/readme.md
    +field-select(
      'Название селекта',
      {
@@ -576,17 +576,17 @@ block content
      ''
    )
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/field-select/field-select.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/field-select/field-select.pug
  +block-lib('field-actions', 'Кнопки формы', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/field-actions/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/field-actions/readme.md
    +field-actions('* — обязательные поля')
      +btn('Отправить')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/field-actions/field-actions.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/field-actions/field-actions.pug
  +block-lib('fields-group', 'Группа полей', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/fields-group/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/fields-group/readme.md
    +fields-group()
      +field-text({
        helpText: 'Подсказка',
@@ -604,10 +604,10 @@ block content
      +field-actions()
        +btn('Отправить', 'primary')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/fields-group/fields-group.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/fields-group/fields-group.pug
  +block-lib('form', 'Форма', true)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/form/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/form/readme.md
    +form()
      +fieldset('Название1')
        +field-text({
@@ -638,25 +638,25 @@ block content
      +field-actions()
        +btn('Отправить', 'primary')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/form/form.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/form/form.pug
  +block-lib('is-mobile', 'Определение мобильного устройства', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/is-mobile/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/is-mobile/readme.md
  +block-lib('scroll-link', 'Ссылки на якоря страницы', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/scroll-link/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/scroll-link/readme.md
    +scroll-link('Описание блока <code>page</code>', '#page')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/scroll-link/scroll-link.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/scroll-link/scroll-link.pug
  +block-lib('to-top-block', 'Ссылка «вверх»', false, 'to-top')
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/to-top/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/to-top/readme.md
    +to-top()
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/to-top/to-top.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/to-top/to-top.pug
  +block-lib('dropdown', 'Выпадающий элемент', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/dropdown/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/dropdown/readme.md
    pre.code
      code // Факт открытия
      code $('#drop-demo-01').closest('.dropdown').on('shown.nth.dropdown', function () {
@@ -669,8 +669,7 @@ block content
      code });
    +dropdown('Дроп (с выводом событий в консоль)', 'drop-demo-01')
      p текст
-    |
+    span &nbsp;
-    |
    +dropdown('Выпадающее меню', 'drop-demo-02', 'up, right')
      .menu
        span.menu__item
@@ -680,10 +679,10 @@ block content
        span.menu__item
          a.menu__link(href='') Второй пункт
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/dropdown/dropdown.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/dropdown/dropdown.pug
  +block-lib('owl-carousel', 'Карусель с <a href="http://owlcarousel2.github.io/OwlCarousel2/">owl-carousel</a>', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/owl-carousel/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/owl-carousel/readme.md
    +owl-carousel('promo')
      div слайд1
      div слайд2
@@ -694,10 +693,10 @@ block content
      div слайд7
      div слайд8
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/owl-carousel/owl-carousel.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/owl-carousel/owl-carousel.pug
  +block-lib('swipe', 'Карусель с <a href="https://github.com/lyfeyaj/swipe">swipe</a>', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/swipe/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/swipe/readme.md
    +swipe('swipe-demo')
      div слайд1
      div слайд2
@@ -708,19 +707,19 @@ block content
      div слайд7
      div слайд8
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/swipe/swipe.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/swipe/swipe.pug
  +block-lib('nouislider', 'Выбор диапазона с <a href="https://refreshless.com/nouislider/">noUiSlider</a>', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/nouislider/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/nouislider/readme.md
    +nouislider('demo-nouislider')
      p
        input#demo-nouislider-start(type='number', value='10')
        input#demo-nouislider-end(type='number', value='80')
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/nouislider/nouislider.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/nouislider/nouislider.pug
  +block-lib('off-canvas', 'Боковое меню страницы', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/off-canvas/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/off-canvas/readme.md
    p #[button.btn(type='button', data-toggle='off-canvas') Показать/скрыть боковое меню]
    +block-lib-code()
      pre.code
@@ -734,7 +733,7 @@ block content
        code a(href='#SOME_HASH', data-toggle-native='off-canvas') Показать/скрыть боковое меню и перейти на якорь
  +block-lib('modal', 'Модальное окно', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/modal/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/modal/readme.md
    p Одно и то же модальное окно, в консоль выводятся события. #[button.btn(type='button', data-toggle='modal', data-target='#modal-demo-01') Показать модальное окно] #[a(href='#modal-demo-01', data-toggle='modal') Показать модальное окно] #[span(data-toggle='modal', data-target='#modal-demo-01') Показать модальное окно]
    +modal('modal-demo-01', 'Заголовок', 'some')
      .modal__body
@@ -762,10 +761,10 @@ block content
      code   console.log('hidden.nth.modal');
      code });
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/modal/modal.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/modal/modal.pug
  +block-lib('tabs', 'Табы', false)
-    include:markdown-it(linkify html='true' typographer='true' quotes='«»') blocks/tabs/readme.md
+    include:markdown-it(linkify, html='true', typographer='true', quotes='«»') blocks/tabs/readme.md
    +tabs([
      {
        'id': 'tab00',
@@ -794,10 +793,10 @@ block content
      +tabs-item('tab03')
        p Горами в стране, гласных и согласных живут рыбные тексты.3
    +block-lib-code()
-      include:show-code(first-line="//- Pug-файл этого блока:") blocks/tabs/tabs.pug
+      include:show-code(first-line='//- Pug-файл этого блока:') blocks/tabs/tabs.pug
-  .burger.blocks-library__menu-toggler(data-toggle="off-canvas")
+  .burger.blocks-library__menu-toggler(data-toggle='off-canvas')
-    span(data-toggle="off-canvas")
+    span(data-toggle='off-canvas')
 block footer
--- a/src/blocks/alert/alert.pug
+++ b/src/blocks/alert/alert.pug
@@ -26,7 +26,7 @@ mixin alert(title, mods)
      }
    }
-  div.alert(class=allMods)&attributes(attributes)
+  .alert(class=allMods)&attributes(attributes)
    if (typeof(title) !== 'undefined' && title !== '')
      h4.alert__header!= title
    block
--- a/src/blocks/breadcrumbs/breadcrumbs.pug
+++ b/src/blocks/breadcrumbs/breadcrumbs.pug
@@ -19,7 +19,7 @@ mixin breadcrumbs(mods)
      }
    }
-  ul.breadcrumbs(class=allMods, aria-label="Breadcrumb", role="navigation")&attributes(attributes)
+  ul.breadcrumbs(class=allMods, aria-label='Breadcrumb', role='navigation')&attributes(attributes)
    block

--- a/src/blocks/comment/comment.pug
+++ b/src/blocks/comment/comment.pug
@@ -45,5 +45,6 @@ mixin comment(props)
      .comment__text
        header.comment__header #[b.comment__author= props.username] #[time.comment__date(datetime='2017-04-25T05:45') 25.04.2017 в 05:45]
        .comment__body!= props.content
-        footer.comment__footer #[a.comment__reply(href='') Reply] #[a.comment__reply(href='') Admin]
+        footer.comment__footer.
+          #[a.comment__reply(href='') Reply] #[a.comment__reply(href='') Admin]
    block
--- a/src/blocks/field-range/field-range.html
+++ b/src/blocks/field-range/field-range.html
-<!--DEV
-Для использования этого файла как шаблона:
-@ @include('blocks/field-range/field-range.html')
-(Нужно убрать пробел между символами @)
-Подробнее: https://www.npmjs.com/package/gulp-file-include
-<div class="field-range">
-  <div class="field-range__name">Range</div>
-  <div class="field-range__input-wrap">
-    <input class="field-range__input" type="range" min="1" max="100" step="1" value="70" id="" name="">
-    <div class="field-range__help-text"><code>min="1" max="100" step="1" value="70"</code>, стилизован без JS.</div>
-  </div>
-</div>
-->
--- a/src/blocks/field-select/field-select.html
+++ b/src/blocks/field-select/field-select.html
-<!--DEV
-Для использования этого файла как шаблона:
-@ @include('blocks/field-select/field-select.html')
-(Нужно убрать пробел между символами @)
-Подробнее: https://www.npmjs.com/package/gulp-file-include
-<label class="field-select">
-  <div class="field-select__name">Селект</div>
-  <div class="field-select__select-wrap">
-    <select class="field-select__select" id="" name="">
-      <optgroup label="Группа">
-        <option>Значение 1</option>
-        <option>Значение 2</option>
-        <option>Значение 3</option>
-      </optgroup>
-      <option>Значение 10</option>
-    </select>
-    <small class="field-select__help-text">Обёртка — <code>&lt;label&gt;</code>.</small>
-  </div>
-</label>
-->
--- a/src/blocks/field-text/field-text.pug
+++ b/src/blocks/field-text/field-text.pug
@@ -43,10 +43,7 @@ mixin field-text(props)
      if(typeof(props.isTextarea) !== 'undefined' && props.isTextarea)
        textarea.field-text__input&attributes(props.attrs)= props.val
      else
-        input.field-text__input(
+        input.field-text__input(type=(typeof(props.attrs) !== 'undefined' && props.attrs.type) ? props.attrs.type : 'text', value=props.val)&attributes(props.attrs)
-          type=(typeof(props.attrs) !== 'undefined' && props.attrs.type) ? props.attrs.type : 'text'
-          value=props.val
-        )&attributes(props.attrs)
      if(typeof(props.helpText) !== 'undefined' && props.helpText)
        span.field-text__help-text!= props.helpText
      block
--- a/src/blocks/main-nav/main-nav.pug
+++ b/src/blocks/main-nav/main-nav.pug
@@ -12,7 +12,7 @@ mixin main-nav(selectedID)
  include main-nav.data.pug
  nav.main-nav#nav&attributes(attributes)
-    +burger('Показать главное меню', 'nav', 'main-nav--open')(class="main-nav__toggler")
+    +burger('Показать главное меню', 'nav', 'main-nav--open')(class='main-nav__toggler')
    ul.main-nav__list
      each menuItem in mainMenu
        li(class= selectedID == menuItem.id ? 'main-nav__item  main-nav__item--active' : 'main-nav__item')

--- a/src/blocks/modal/modal.pug
+++ b/src/blocks/modal/modal.pug
@@ -27,7 +27,6 @@ mixin modal(id, title, mods)
    .modal__dialog(role='document')
        .modal__content
          .modal__header
-            span.close.modal__close(data-dismiss='modal', aria-label='Закрыть')
+            span.close.modal__close(data-dismiss='modal', aria-label='Закрыть') #[span]
-              span
            h4.modal__title!= title
          block
--- a/src/blocks/owl-carousel/owl-carousel.pug
+++ b/src/blocks/owl-carousel/owl-carousel.pug
@@ -28,5 +28,5 @@ mixin owl-carousel(id, mods)
      }
    }
-  div.owl-carousel(id=id, class=allMods)&attributes(attributes)
+  .owl-carousel(id=id, class=allMods)&attributes(attributes)
    block
--- a/src/blocks/page-header/page-header.pug
+++ b/src/blocks/page-header/page-header.pug
@@ -17,6 +17,6 @@ mixin page-header(mods)
      }
    }
-  header.page-header(class=allMods, role="banner")&attributes(attributes)
+  header.page-header(class=allMods, role='banner')&attributes(attributes)
    .page-header__inner
      block
--- a/src/blocks/pagination/pagination.pug
+++ b/src/blocks/pagination/pagination.pug
@@ -23,7 +23,7 @@ mixin pagination(mods)
      }
    }
-  div.pagination(class=allMods, aria-label="Page navigation")&attributes(attributes)
+  .pagination(class=allMods, aria-label='Page navigation')&attributes(attributes)
    block

--- a/src/blocks/pie-chart/pie-chart.pug
+++ b/src/blocks/pie-chart/pie-chart.pug
@@ -7,8 +7,8 @@ mixin pie-chart(percent, mods)
  //-   mods     {string} - список модификаторов
  //- Вызов:
        +pie-chart('30', 'success')
-        +pie-chart('30')(data-size="200" data-border="10")
+        +pie-chart('30')(data-size='200' data-border='10')
-        +pie-chart('99', 'radial')(data-size="120" data-border="59.9")
+        +pie-chart('99', 'radial')(data-size='120' data-border='59.9')
  -
    // список модификаторов
    var allMods = '';

--- a/src/blocks/progress/progress.pug
+++ b/src/blocks/progress/progress.pug
@@ -8,7 +8,7 @@ mixin progress(percent, text, mods)
  //-   mods     {string} - список модификаторов
  //- Вызов:
        +progress('30', '30%', 'success')(aria-valuemin='0', aria-valuemax='100')
-        +progress('10')(style="height: 10px")
+        +progress('10')(style='height: 10px')
  -
    // список модификаторов
    var allMods = '';

--- a/src/blocks/scroll-link/scroll-link.js
+++ b/src/blocks/scroll-link/scroll-link.js
 document.addEventListener('DOMContentLoaded', function(){
  var links = document.querySelectorAll('[href^="#"][data-scroll-link]');
  for (var i = 0; i < links.length; i++) {
    links[i].addEventListener('click', function(e) {
@@ -6,7 +7,7 @@ document.addEventListener('DOMContentLoaded', function(){
      if(hash && hash !== '#') {
        e.preventDefault();
        var scroll = window.pageYOffset;
-        var targetTop = getOffsetRect(document.querySelector(hash)).top;
+        var targetTop = getOffsetRect(document.querySelector(hash)).top - 10; // С поправкой в 10px
        var scrollDiff = (scroll - targetTop) * -1;
        animate({
          duration: 500,

--- a/src/blocks/tabs/tabs.js
+++ b/src/blocks/tabs/tabs.js
@@ -49,15 +49,14 @@ document.addEventListener('DOMContentLoaded', function(){
  // Добавление метода .closest() (полифил, собственно)
  (function(e){
-   e.closest = e.closest || function(css){
+    e.closest = e.closest || function(css){
-     var node = this;
+      var node = this;
+      while (node) {
-     while (node) {
        if (node.matches(css)) return node;
        else node = node.parentElement;
-     }
+      }
-     return null;
+      return null;
-   }
+    }
  })(Element.prototype);
 });
--- a/src/blocks/tabs/tabs.pug
+++ b/src/blocks/tabs/tabs.pug
@@ -36,7 +36,7 @@ mixin tabs(props, mods)
    }
  .tabs(class=allMods)&attributes(attributes)
-    ul.tabs__links(role="tablist")
+    ul.tabs__links(role='tablist')
      each tab in props
        -
          var isActive = (typeof(tab.isActive) !== 'undefined' && tab.isActive) ? '  tabs__link-wrap--active' : ''

--- a/src/index.pug
+++ b/src/index.pug
@@ -13,10 +13,6 @@ block header
      span Логотип
    +main-nav('1')
-    //- DIV.class#test-ID(id="dddd" title='ddddddd')
-    p.class(id='dddd' title='ddddddd')
 block content
  p Содержимое. #[a(href='blocks-demo.html') Библиотека блоков].

--- a/src/pug/layout-off-canvas.pug
+++ b/src/pug/layout-off-canvas.pug
@@ -3,19 +3,19 @@
 include mixins.pug
 doctype html
-html(class="no-js  page", lang="ru")
+html(class='no-js  page', lang='ru')
  head
    meta(charset='utf-8')
    meta(name='viewport', content='width=device-width, initial-scale=1')
    //- Edge и ряд мобильных браузеров автоматом преобразуют телефоны в ссылки. Отключим это.
-    meta(name="format-detection", content="telephone=no")
+    meta(name='format-detection', content='telephone=no')
    block meta
      title Home
    block head
-      link(rel="stylesheet", href="css/style.min.css")
+      link(rel='stylesheet', href='css/style.min.css')
      script.
        document.documentElement.className = document.documentElement.className.replace('no-js', 'js');
      script
@@ -24,22 +24,22 @@ html(class="no-js  page", lang="ru")
  body
    .off-canvas#off-canvas
-      aside.off-canvas__aside(role="complementary", aria-label="Меню")
+      aside.off-canvas__aside(role='complementary', aria-label='Меню')
        block off-canvas
-      main.off-canvas__page-content.components-demo.blocks-library(role="main")
+      main.off-canvas__page-content.components-demo.blocks-library(role='main')
        //- Реальный контент страницы
-        div.page__inner
+        .page__inner
-          div.page__content
+          .page__content
            block header
              p «шапка»
            block content
              p содержимое страницы
-          div.page__footer-wrapper
+          .page__footer-wrapper
            block footer
              p «подвал»
-      div.off-canvas__overlay(data-toggle="off-canvas")
+      .off-canvas__overlay(data-toggle='off-canvas')
    block page-bottom
-      script(src="js/script.min.js")
+      script(src='js/script.min.js')
--- a/src/pug/layout.pug
+++ b/src/pug/layout.pug
@@ -3,19 +3,19 @@
 include mixins.pug
 doctype html
-html(class="no-js  page", lang="ru")
+html(class='no-js  page', lang='ru')
  head
    meta(charset='utf-8')
    meta(name='viewport', content='width=device-width, initial-scale=1')
    //- Edge и ряд мобильных браузеров автоматом преобразуют телефоны в ссылки. Отключим это.
-    meta(name="format-detection", content="telephone=no")
+    meta(name='format-detection', content='telephone=no')
    block meta
      title Home
    block head
-      link(rel="stylesheet", href="css/style.min.css")
+      link(rel='stylesheet', href='css/style.min.css')
      script.
        document.documentElement.className = document.documentElement.className.replace('no-js', 'js');
      script
@@ -23,15 +23,15 @@ html(class="no-js  page", lang="ru")
  body
-    div.page__inner
+    .page__inner
-      div.page__content
+      .page__content
        block header
          p «шапка»
        block content
          p содержимое страницы
-      div.page__footer-wrapper
+      .page__footer-wrapper
        block footer
          p «подвал»
    block page-bottom
-      script(src="js/script.min.js")
+      script(src='js/script.min.js')