type

src/_blocks_library.html

@@ -18,7 +18,88 @@
   <p><strong>Исходные блоки</strong> — те, что есть в стартовом наборе блоков проекта (могут быть отключены).</p>
 
   <section>
-    <h2>Формы по умолчанию</h2>
+    <h2>Исходное: Типографика +</h2>
+    <section>
+      <div class="row">
+        <div class="col-md-6">
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+          <h1>Заголовок 1</h1>
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+          <h2>Заголовок 2</h2>
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+          <h3>Заголовок 3</h4>
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+          <h4>Заголовок 4</h4>
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+          <h5>Заголовок 5</h5>
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+          <h6>Заголовок 6</h6>
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+          <div class="row">
+            <div class="col-md-6">
+              <ul>
+                <li>Пункт 1
+                  <ul>
+                    <li>Подпункт 1</li>
+                    <li>Подпункт 2</li>
+                  </ul>
+                </li>
+                <li>Пункт 2</li>
+                <li>Пункт 3</li>
+              </ul>
+            </div>
+            <div class="col-md-6">
+              <ol>
+                <li>Пункт 1
+                  <ol>
+                    <li>Подпункт 1</li>
+                    <li>Подпункт 2</li>
+                  </ol>
+                </li>
+                <li>Пункт 2</li>
+                <li>Пункт 3</li>
+              </ol>
+            </div>
+          </div>
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+          <dl>
+            <dt>Определяемая сущность 1</dt>
+            <dd>Некое, возможно, относительно длинное определение упомянутой сущности. Скорее всего, многострочное.</dd>
+            <dt>Определяемая сущность 2</dt>
+            <dd>Некое, возможно, относительно длинное определение. Скорее всего, многострочное.</dd>
+            <dd>Некое, возможно, относительно длинное определение упомянутой сущности.</dd>
+          </dl>
+          <p>Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Грустный предупредила, дал приставка составитель решила подпоясал запятых сих ручеек которой власти до, над жизни возвращайся силуэт что не курсивных.</p>
+        </div>
+        <div class="col-md-6">
+          <p><img src="img/TEMP_DavidBlaine.jpg" alt=""></p>
+          <p>
+            <strong>тег strong</strong>, <b>тег b</b><br>
+            <i>тег i</i>, <em>тег em</em>, <s>тег s</s>, <u>тег u</u><br>
+            <mark>тег mark</mark>, <del>тег del</del>, <ins>тег ins</ins>, <small>тег small</small><br>
+            2<sup>3</sup>, H<sub>2</sub>O<br>
+            <abbr>тег abbr</abbr><br>
+            <kbd>Ctrl + C</kbd>
+          </p>
+          <address>
+            тег address
+          </address>
+          <blockquote>
+            <p>Цитата. Далеко-далеко за словесными горами в стране. Далеко-далеко за словесными горами в стране.</p>
+            <footer>Emmet</footer>
+          </blockquote>
+          <p>Строчный код: <code>&lt;section&gt;</code></p>
+          <pre>// Блочный код<br>// Вторая строка</pre>
+        </div>
+      </div>
+    </section>
+    <hr>
+  </section>
+
+
+  <section>
+    <h2>Исходное: Формы по умолчанию</h2>
     <form action="">
       <fieldset>
         <legend>Это <code>legend</code> <code>fieldset</code>-а</legend>
@@ -79,7 +160,7 @@
   </section>
 
   <section>
-    <h2>Исходный блок: Модульная сетка на flexbox</h2>
+    <h2>Исходное: Модульная сетка на flexbox</h2>
     <p>Вдохновлён сеткой bootstrap 4.</p>
     <p>Классы <code>.container</code>, <code>.row</code>, <code>.col-[xs|sm|md|lg|xl|xxl]-[1 - @grid-columns]</code>. См. глобальную сетку и примеси.</p>
     <p><code>.col-[xxl]-[1 - @grid-columns]</code> по умолчанию отсутствуют (закомментированы).</p>

src/less/global_scaffolding.less

@@ -140,6 +140,15 @@ figure {
   margin-bottom: (@line-height / 2);
 }
 
+address {
+  font-style: normal;
+}
+
+ul,
+ol {
+  padding-left: 1.8em;
+}
+
 ol ol,
 ul ul,
 ol ul,
@@ -152,6 +161,14 @@ dt {
   font-weight: 700;
 }
 
+dd {
+  margin-left: 1.8em;
+
+  & + dt {
+    margin-top: (@line-height / 2);
+  }
+}
+
 hr {
   margin-top:    @line-height;
   margin-bottom: @line-height;
@@ -164,10 +181,15 @@ small {
   font-size: 80%;
 }
 
+sub,
+sup {
+  font-size: 70%;
+}
+
 // .mark,
 mark {
-  background: #ff0;
-  padding: .2em;
+  background: #FCF8E3;
+  padding: .1em .3em;
 }
 
 b,
@@ -176,16 +198,28 @@ strong {
 }
 
 blockquote {
-  padding: @line-height;
+  padding: .5em 0 .5em 1.8em;
+  margin-left: 0;
   border-left: 5px solid @border-color;
 
   p,
   ul,
   ol {
+    &:first-child {
+      margin-top: 0;
+    }
     &:last-child {
       margin-bottom: 0;
     }
   }
+
+  footer {
+    text-align: right;
+
+    &:before {
+      content: '— ';
+    }
+  }
 }
 
 code,
@@ -197,15 +231,15 @@ samp {
 
 code {
   color: @text-color;
-  background-color: @gray-lightest;
+  background-color: @gray-lighter;
   padding: .1em .3em;
   border-radius: @border-radius;
 }
 
 kbd {
-  padding: .2em .4em;
+  padding: .1em .3em;
   color: @text-color;
-  background-color: @gray-light;
+  background-color: @gray-lighter;
   border-radius: @border-radius;
 
   kbd {
@@ -219,7 +253,7 @@ pre {
   margin-top:    @line-height;
   margin-bottom: @line-height;
   overflow-x: scroll;
-  background-color: @gray-lightest;
+  background-color: @gray-lighter;
   padding: .5em;
   border-radius: @border-radius;
   border: 1px solid @border-color;