Commit ec74d6c6 authored by Nikolay Gromov's avatar Nikolay Gromov

Унифицировал описание модификаторов в библиотеке компонентов

parent 8b24cedc
......@@ -2397,7 +2397,7 @@
<div class="blocks-library__sub-item">
<h2 class="blocks-library__sub-item-title">Увеличение размера</h2>
<p>Размер изменён благодаря модификатору. Модификатор меняет <code>font-size</code> блока в <code>em</code>-ах (реальный размер блока продолжает зависеть от размера шрифта родителя).</p>
<p>Модификатор <code>field-select--lg</code>, отдельный less-файл.</p>
<div class="js-font-resizer">
<div class="row">
<div class="col-md-6">
......@@ -2459,7 +2459,7 @@
<div class="blocks-library__sub-item">
<h2 class="blocks-library__sub-item-title">Уменьшение размера</h2>
<p>Размер изменён благодаря модификатору. Модификатор меняет <code>font-size</code> блока в <code>em</code>-ах (реальный размер блока продолжает зависеть от размера шрифта родителя).</p>
<p>Модификатор <code>field-select--sm</code>, отдельный less-файл.</p>
<div class="js-font-resizer">
<div class="row">
<div class="col-md-6">
......@@ -2568,7 +2568,7 @@
<div class="blocks-library__sub-item">
<h2 class="blocks-library__sub-item-title">С дополнительным элементом-линейкой</h2>
<p>Стилизация дополнительного элемента-линейки — отдельный less-файл.</p>
<p>Дополнительный элемент <code>field-range__line</code>, отдельный less-файл.</p>
<p>Линейка добавляется вставкой в разметку дополнительных тегов. Текстовые значения берутся из data-атрибутов. Первый элемент линейки позиционируется абсолютно (не вызывает увеличения длины шкалы). Второй и далее элементы распределяются равномерно, занимают одинаковое количество места в «строке».</p>
<p class="alert alert--danger">Чтобы двигающийся элемент чётко попадал в линейку, шаг элемента должен быть достаточно мелким и/или линейка должна быть достаточно частой или шаг должен строго соответствовать линейке.</p>
<div class="js-font-resizer">
......@@ -2638,7 +2638,7 @@
<div class="blocks-library__sub-item">
<h2 class="blocks-library__sub-item-title">Увеличение размера</h2>
<p>Размер изменён благодаря модификатору. Модификатор меняет <code>font-size</code> блока в <code>em</code>-ах (реальный размер блока продолжает зависеть от размера шрифта родителя).</p>
<p>Модификатор <code>field-range--lg</code>, отдельный less-файл.</p>
<div class="js-font-resizer">
<div class="row">
<div class="col-md-6">
......@@ -2706,7 +2706,7 @@
<div class="blocks-library__sub-item">
<h2 class="blocks-library__sub-item-title">Уменьшение размера</h2>
<p>Размер изменён благодаря модификатору. Модификатор меняет <code>font-size</code> блока в <code>em</code>-ах (реальный размер блока продолжает зависеть от размера шрифта родителя).</p>
<p>Модификатор <code>field-range--sm</code>, отдельный less-файл.</p>
<div class="js-font-resizer">
<div class="row">
<div class="col-md-6">
......@@ -2816,7 +2816,7 @@
<div class="blocks-library__sub-item">
<h2 class="blocks-library__sub-item-title">Увеличение размера</h2>
<p>Размер изменён благодаря модификатору. Модификатор меняет <code>font-size</code> блока в <code>em</code>-ах (реальный размер блока продолжает зависеть от размера шрифта родителя).</p>
<p>Модификатор <code>field-file--lg</code>, отдельный less-файл.</p>
<div class="js-font-resizer">
<div class="field-file field-file--lg">
<div class="field-file__name">Выбор файлов</div>
......@@ -2846,7 +2846,7 @@
<div class="blocks-library__sub-item">
<h2 class="blocks-library__sub-item-title">Уменьшение размера</h2>
<p>Размер изменён благодаря модификатору. Модификатор меняет <code>font-size</code> блока в <code>em</code>-ах (реальный размер блока продолжает зависеть от размера шрифта родителя).</p>
<p>Модификатор <code>field-file--sm</code>, отдельный less-файл.</p>
<div class="js-font-resizer">
<div class="field-file field-file--sm">
<div class="field-file__name">Выбор файлов</div>
......@@ -3024,7 +3024,7 @@
<div class="blocks-library__sub-item">
<h1 class="blocks-library__sub-item-title">Горизонтальное расположение названий и полей</h1>
<p>Только начиная с SM ширины. Модификатор. Отдельный less-файл.</p>
<p>Только начиная с SM ширины. Модификатор <code>form--horizontal</code>, отдельный less-файл.</p>
<div class="js-font-resizer">
<form action="" class="form form--horizontal">
<label class="field-text">
......@@ -3203,7 +3203,7 @@
<div class="blocks-library__sub-item">
<h1 class="blocks-library__sub-item-title">Форма в строку</h1>
<p>Только начиная с SM ширины. Модификатор. Отдельный less-файл.</p>
<p>Только начиная с SM ширины. Модификатор <code>form--line</code>, отдельный less-файл.</p>
<p class="alert alert--danger">ВНИМАНИЕ! Поскольку все отступы сделаны в em, при наличии названий полей на некоторых больших размерах шрифта возможно несоответствие (1-2px) базовой линии названия и базовой линии текста в поле.</p>
<div class="js-font-resizer">
<form action="" class="form form--line">
......@@ -3444,7 +3444,7 @@
</div>
<div class="blocks-library__sub-item">
<h2 class="blocks-library__sub-item-title">Увеличение и уменьшение модификаторами</h2>
<p>Размеры изменены благодаря модификатору. Модификаторы меняют <code>font-size</code> блока в <code>em</code>-ах (реальный размер блока продолжает зависеть от размера шрифта родителя).</p>
<p>Модификатор <code>btn--lg</code>, отдельный less-файл.</p>
<div class="js-font-resizer">
<p>
<a href="" class="btn btn--lg">Cсылка (lg)</a>
......@@ -3474,6 +3474,7 @@
</div>
<div class="blocks-library__sub-item">
<h2 class="blocks-library__sub-item-title">Блочные кнопки</h2>
<p>Модификатор <code>btn--block</code>, отдельный less-файл.</p>
<p>
<a href="" class="btn btn--block">Cсылка</a>
<input type="submit" class="btn btn--block btn--main" value="Input">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment