Skip to content

K
kpp
Commit 5b1f2268 authored by Nikolay Gromov's avatar Nikolay Gromov
Browse files
Options

Упорядочил описание блока форм

parent 04d8026d
Hide whitespace changes
Inline Side-by-side
Showing with 316 additions and 196 deletions
src/blocks/field-actions/field-actions.less
View file @ 5b1f2268
...@@ -5,4 +5,17 @@ ...@@ -5,4 +5,17 @@
display: block; display: block;
margin-top: @line-height; margin-top: @line-height;
margin-bottom: (@line-height / 2); margin-bottom: (@line-height / 2);
.btn {
margin-bottom: (@line-height / 2);
}
&__text {
display: block;
margin-top: (@line-height / 2);
margin-bottom: (@line-height / 2);
font-size: @font-size--small;
color: @text-color--muted;
line-height: 1.2em;
}
} }
src/blocks/form/form.less
View file @ 5b1f2268
...@@ -2,7 +2,14 @@ ...@@ -2,7 +2,14 @@
.form { .form {
&:not(:last-child) { &:not(:last-child) {
margin-bottom: @line-height; margin-bottom: @line-height;
} }
fieldset {
&:not(:last-child) {
margin-bottom: @line-height;
}
}
} }
src/blocks_library.html
View file @ 5b1f2268
...@@ -2886,221 +2886,321 @@ ...@@ -2886,221 +2886,321 @@
<section class="blocks-library__item" id="field-actions" data-name=".field-actions">
<h1 class="blocks-library__item-title">Блок кнопок формы</h1>
<div class="js-font-resizer">
<div class="field-actions">
<div class="field-actions__text">Поля отмеченные * обязательны для заполнения.</div>
<button class="btn">Отправить</button>
<br>
<button class="btn">Отменить</button>
</div>
</div>
<div class="blocks-library__code-wrapper">
<span class="blocks-library__code-show-trigger" title="Показать код"><i class="blocks-library__code-icon"></i></span>
<div class="blocks-library__code">
<pre>
<code class="html">&lt;div class=&quot;field-actions&quot;&gt;</code>
<code class="html"> &lt;div class=&quot;field-actions__text&quot;&gt;&#x41f;&#x43e;&#x43b;&#x44f; &#x43e;&#x442;&#x43c;&#x435;&#x447;&#x435;&#x43d;&#x43d;&#x44b;&#x435; * &#x43e;&#x431;&#x44f;&#x437;&#x430;&#x442;&#x435;&#x43b;&#x44c;&#x43d;&#x44b; &#x434;&#x43b;&#x44f; &#x437;&#x430;&#x43f;&#x43e;&#x43b;&#x43d;&#x435;&#x43d;&#x438;&#x44f;.&lt;/div&gt;</code>
<code class="html"> &lt;button class=&quot;btn&quot;&gt;&#x41e;&#x442;&#x43f;&#x440;&#x430;&#x432;&#x438;&#x442;&#x44c;&lt;/button&gt;</code>
<code class="html"> &lt;br&gt;</code>
<code class="html"> &lt;button class=&quot;btn&quot;&gt;&#x41e;&#x442;&#x43c;&#x435;&#x43d;&#x438;&#x442;&#x44c;&lt;/button&gt;</code>
<code class="html">&lt;/div&gt;</code>
</pre>
</div>
</div>
</section>
<section class="blocks-library__item" id="form" data-name=".form"> <section class="blocks-library__item" id="form" data-name=".form">
<form action="" class="form">
<fieldset> <h1 class="blocks-library__item-title">Форма</h1>
<legend>Форма</legend>
<label class="field-text"> <p>Форма как БЭМ-блок. Добавляется стилизация <code>fieldset</code>, появляется возможность использовать модификаторы (см. ниже).</p>
<div class="field-text__name">Название поля</div>
<div class="field-text__input-wrap"> <div class="js-font-resizer">
<input class="field-text__input" type="text" placeholder="input[type=text]"> <form action="" class="form">
<div class="field-text__help-text">Обёртка — <code>&lt;label&gt;</code>.</div> <fieldset>
<legend>Файлдсет первый</legend>
<label class="field-text">
<div class="field-text__name">Название поля</div>
<div class="field-text__input-wrap">
<input class="field-text__input" type="text" placeholder="input[type=text]">
<div class="field-text__help-text">Обёртка — <code>&lt;label&gt;</code>.</div>
</div>
</label>
<div class="field-checkbox">
<div class="field-checkbox__title">Общее название</div>
<div class="field-checkbox__input-wrap">
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<div class="field-checkbox__help-text">Есть общее название.</div>
</div>
</div> </div>
</label> </fieldset>
<div class="field-checkbox"> <fieldset>
<div class="field-checkbox__title">Общее название</div> <legend>Файлдсет второй</legend>
<div class="field-checkbox__input-wrap"> <label class="field-select">
<label class="field-checkbox__name"> <div class="field-select__name">Название поля</div>
<input class="field-checkbox__input" type="checkbox"> <div class="field-select__select-wrap">
<span class="field-checkbox__name-text">Флажок</span> <select class="field-select__select">
</label> <optgroup label="optgroup">
<label class="field-checkbox__name"> <option>Значение 1</option>
<input class="field-checkbox__input" type="checkbox"> <option>Значение 2</option>
<span class="field-checkbox__name-text">Флажок</span> <option>Значение 3</option>
</label> </optgroup>
<label class="field-checkbox__name"> <option>Значение 10</option>
<input class="field-checkbox__input" type="checkbox"> </select>
<span class="field-checkbox__name-text">Флажок</span> <small class="field-select__help-text">Обёртка — <code>&lt;label&gt;</code>.</small>
</label> </div>
<label class="field-checkbox__name"> </label>
<input class="field-checkbox__input" type="checkbox"> <div class="field-file">
<span class="field-checkbox__name-text">Флажок</span> <div class="field-file__name">Выбор файлов</div>
</label> <label class="field-file__input-wrap">
<label class="field-checkbox__name"> <input class="field-file__input" type="file" data-multiple-caption="файлов выбрано: {count}" multiple>
<input class="field-checkbox__input" type="checkbox"> <div class="field-file__name-text" data-button-text="Выбрать файл(ы)">Ничего не выбрано</div>
<span class="field-checkbox__name-text">Флажок</span> <div class="field-file__help-text">Отображение выбранного файла(ов) требует Javascript-а. Стилизация — не требует.</div>
</label> </label>
<div class="field-checkbox__help-text">Есть общее название.</div>
</div>
</div>
<label class="field-select">
<div class="field-select__name">Название поля</div>
<div class="field-select__select-wrap">
<select class="field-select__select">
<optgroup label="optgroup">
<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> </div>
</label> <div class="field-range">
<div class="field-file"> <div class="field-range__name">Range</div>
<div class="field-file__name">Выбор файлов</div> <div class="field-range__input-wrap">
<label class="field-file__input-wrap"> <input class="field-range__input" type="range" min="1" max="100" step="1" value="70">
<input class="field-file__input" type="file" data-multiple-caption="файлов выбрано: {count}" multiple> <div class="field-range__help-text"><code>min="1" max="100" step="1" value="70"</code></div>
<div class="field-file__name-text" data-button-text="Выбрать файл(ы)">Ничего не выбрано</div> </div>
<div class="field-file__help-text">Отображение выбранного файла(ов) требует Javascript-а. Стилизация — не требует.</div>
</label>
</div>
<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">
<div class="field-range__help-text"><code>min="1" max="100" step="1" value="70"</code></div>
</div> </div>
</div> </fieldset>
<div class="field-actions"> <div class="field-actions">
<div class="field-actions__text">Поля отмеченные * обязательны для заполнения.</div>
<button class="btn">Отправить</button> <button class="btn">Отправить</button>
</div> </div>
</fieldset> </form>
</form> </div>
<div class="blocks-library__code-wrapper">
<span class="blocks-library__code-show-trigger" title="Показать код"><i class="blocks-library__code-icon"></i></span>
<div class="blocks-library__code">
<pre>
<code class="html">&lt;form action=&quot;&quot; class=&quot;form&quot;&gt;</code>
<code class="html"> &lt;fieldset&gt;</code>
<code class="html"> &lt;legend&gt;&#x424;&#x430;&#x439;&#x43b;&#x434;&#x441;&#x435;&#x442; &#x43f;&#x435;&#x440;&#x432;&#x44b;&#x439;&lt;/legend&gt;</code>
<code class="html"> &lt;label class=&quot;field-text&quot;&gt;...&lt;/label&gt;</code>
<code class="html"> &lt;div class=&quot;field-checkbox&quot;&gt;...&lt;/div&gt;</code>
<code class="html"> &lt;/fieldset&gt;</code>
<code class="html"> &lt;fieldset&gt;</code>
<code class="html"> &lt;legend&gt;&#x424;&#x430;&#x439;&#x43b;&#x434;&#x441;&#x435;&#x442; &#x432;&#x442;&#x43e;&#x440;&#x43e;&#x439;&lt;/legend&gt;</code>
<code class="html"> &lt;label class=&quot;field-select&quot;&gt;...&lt;/label&gt;</code>
<code class="html"> &lt;div class=&quot;field-file&quot;&gt;...&lt;/div&gt;</code>
<code class="html"> &lt;div class=&quot;field-range&quot;&gt;...&lt;/div&gt;</code>
<code class="html"> &lt;/fieldset&gt;</code>
<code class="html"> &lt;div class=&quot;field-actions&quot;&gt;</code>
<code class="html"> &lt;button class=&quot;btn&quot;&gt;&#x41e;&#x442;&#x43f;&#x440;&#x430;&#x432;&#x438;&#x442;&#x44c;&lt;/button&gt;</code>
<code class="html"> &lt;/div&gt;</code>
<code class="html">&lt;/form&gt;</code>
</pre>
</div>
</div>
<div class="blocks-library__sub-item"> <div class="blocks-library__sub-item">
<b class="blocks-library__sub-item-title"><code>.form.form--horizontal</code> (отдельный less-файл)</b> <h1 class="blocks-library__sub-item-title">Горизонтальное расположение названий и полей</h1>
<form action="" class="form form--horizontal"> <p>Только начиная с SM ширины. Модификатор. Отдельный less-файл.</p>
<label class="field-text">
<div class="field-text__name">Название поля</div> <div class="js-font-resizer">
<div class="field-text__input-wrap"> <form action="" class="form form--horizontal">
<input class="field-text__input" type="text" placeholder="input[type=text]"> <label class="field-text">
<div class="field-text__help-text">Обёртка — <code>&lt;label&gt;</code>.</div> <div class="field-text__name">Название поля</div>
</div> <div class="field-text__input-wrap">
</label> <input class="field-text__input" type="text" placeholder="input[type=text]">
<label class="field-text"> <div class="field-text__help-text">Обёртка — <code>&lt;label&gt;</code>.</div>
<div class="field-text__name">Название поля</div> </div>
<div class="field-text__input-wrap"> </label>
<textarea class="field-text__input" rows="3" placeholder="textarea"></textarea> <label class="field-text">
<div class="field-text__help-text">Обёртка — <code>&lt;label&gt;</code>.</div> <div class="field-text__name">Название поля</div>
<div class="field-text__input-wrap">
<textarea class="field-text__input" rows="3" placeholder="textarea"></textarea>
<div class="field-text__help-text">Обёртка — <code>&lt;label&gt;</code>.</div>
</div>
</label>
<div class="field-checkbox">
<div class="field-checkbox__title">Общее название</div>
<div class="field-checkbox__input-wrap">
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Далеко-далеко за словесными горами в стране, гласных и согласных живут рыбные тексты. Парадигматическая, запятой выйти! Подпоясал, лучше, рыбными.</span>
</label>
<div class="field-checkbox__help-text">Есть общее название.</div>
</div>
</div> </div>
</label> <div class="field-radio">
<div class="field-checkbox"> <div class="field-radio__title"></div>
<div class="field-checkbox__title">Общее название</div> <div class="field-radio__input-wrap">
<div class="field-checkbox__input-wrap"> <label class="field-radio__name">
<label class="field-checkbox__name"> <input class="field-radio__input" type="radio" name="one1">
<input class="field-checkbox__input" type="checkbox"> <span class="field-radio__name-text">Радиокнопка</span>
<span class="field-checkbox__name-text">Флажок</span> </label>
</label> <label class="field-radio__name">
<label class="field-checkbox__name"> <input class="field-radio__input" type="radio" name="one1">
<input class="field-checkbox__input" type="checkbox"> <span class="field-radio__name-text">Наверное. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных. Наверное. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных.</span>
<span class="field-checkbox__name-text">Флажок</span> </label>
</label> <div class="field-radio__help-text">Нет общего названия, но оставлен пустой <code>div</code> для него.</div>
<label class="field-checkbox__name"> </div>
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<label class="field-checkbox__name">
<input class="field-checkbox__input" type="checkbox">
<span class="field-checkbox__name-text">Флажок</span>
</label>
<div class="field-checkbox__help-text">Есть общее название.</div>
</div> </div>
</div> <div class="field-radio">
<div class="field-radio"> <div class="field-radio__input-wrap">
<div class="field-radio__title"></div> <label class="field-radio__name">
<div class="field-radio__input-wrap"> <input class="field-radio__input" type="radio" name="two1">
<label class="field-radio__name"> <span class="field-radio__name-text">Радиокнопка</span>
<input class="field-radio__input" type="radio" name="one1"> </label>
<span class="field-radio__name-text">Радиокнопка</span> <label class="field-radio__name">
</label> <input class="field-radio__input" type="radio" name="two1">
<label class="field-radio__name"> <span class="field-radio__name-text">Наверное.</span>
<input class="field-radio__input" type="radio" name="one1"> </label>
<span class="field-radio__name-text">Наверное. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных. Наверное. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных.</span> <div class="field-radio__help-text">Нет общего названия и отсутствует пустой <code>div</code> для него.</div>
</label> </div>
<div class="field-radio__help-text">Нет общего названия, но оставлен пустой <code>div</code> для него.</div>
</div> </div>
</div> <div class="field-radio">
<div class="field-radio"> <div class="field-radio__input-wrap">
<div class="field-radio__input-wrap"> <label class="field-radio__name">
<label class="field-radio__name"> <input class="field-radio__input" type="radio" name="two2">
<input class="field-radio__input" type="radio" name="two1"> <span class="field-radio__name-text">Радиокнопка</span>
<span class="field-radio__name-text">Радиокнопка</span> </label>
</label> <label class="field-radio__name">
<label class="field-radio__name"> <input class="field-radio__input" type="radio" name="two2">
<input class="field-radio__input" type="radio" name="two1"> <span class="field-radio__name-text">Наверное. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных.</span>
<span class="field-radio__name-text">Наверное.</span> </label>
</label> <div class="field-radio__help-text">Нет общего названия и отсутствует пустой <code>div</code> для него.</div>
<div class="field-radio__help-text">Нет общего названия и отсутствует пустой <code>div</code> для него.</div> </div>
</div> </div>
</div> <div class="field-toggler">
<div class="field-radio"> <div class="field-toggler__title">Переключатели-флажки</div>
<div class="field-radio__input-wrap"> <div class="field-toggler__input-wrap">
<label class="field-radio__name"> <label class="field-toggler__name">
<input class="field-radio__input" type="radio" name="two2"> <input class="field-toggler__input" type="checkbox" checked="">
<span class="field-radio__name-text">Радиокнопка</span> <span class="field-toggler__name-text">Да</span>
</label> </label>
<label class="field-radio__name"> <label class="field-toggler__name">
<input class="field-radio__input" type="radio" name="two2"> <input class="field-toggler__input" type="checkbox">
<span class="field-radio__name-text">Наверное. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных.</span> <span class="field-toggler__name-text">Наверное. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных.</span>
</label> </label>
<div class="field-radio__help-text">Нет общего названия и отсутствует пустой <code>div</code> для него.</div> <div class="field-toggler__help-text">Графика не используется, всё нарисовано CSS-ом.</div>
</div>
</div> </div>
</div> <label class="field-select">
<div class="field-toggler"> <div class="field-select__name">Название поля</div>
<div class="field-toggler__title">Переключатели-флажки</div> <div class="field-select__select-wrap">
<div class="field-toggler__input-wrap"> <select class="field-select__select">
<label class="field-toggler__name"> <optgroup label="optgroup">
<input class="field-toggler__input" type="checkbox" checked=""> <option>Значение 1</option>
<span class="field-toggler__name-text">Да</span> <option>Значение 2</option>
</label> <option>Значение 3</option>
<label class="field-toggler__name"> </optgroup>
<input class="field-toggler__input" type="checkbox"> <option>Значение 10</option>
<span class="field-toggler__name-text">Наверное. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных. И тут много строк. Далеко-далеко за словесными горами в стране, гласных и согласных.</span> </select>
<small class="field-select__help-text">Обёртка — <code>&lt;label&gt;</code>.</small>
</div>
</label>
<label class="field-select">
<div class="field-select__name">Название поля</div>
<div class="field-select__select-wrap">
<select class="field-select__select" multiple>
<optgroup label="optgroup">
<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>
<div class="field-file">
<div class="field-file__name">Выбор файлов</div>
<label class="field-file__input-wrap">
<input class="field-file__input" type="file" data-multiple-caption="файлов выбрано: {count}" multiple>
<div class="field-file__name-text" data-button-text="Выбрать файл(ы)">Ничего не выбрано</div>
<div class="field-file__help-text">Отображение выбранного файла(ов) требует Javascript-а. Стилизация — не требует.</div>
</label> </label>
<div class="field-toggler__help-text">Графика не используется, всё нарисовано CSS-ом.</div>
</div> </div>
</div> <div class="field-range">
<label class="field-select"> <div class="field-range__name">Длинное название поля, которое, будучи многострочным, гарантировано выше чем.</div>
<div class="field-select__name">Название поля</div> <div class="field-range__input-wrap">
<div class="field-select__select-wrap"> <input class="field-range__input" type="range" min="1" max="100" step="1" value="70" multiple>
<select class="field-select__select"> <div class="field-range__help-text"><code>min="1" max="100" step="1" value="70"</code></div>
<optgroup label="optgroup"> </div>
<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>
<label class="field-select">
<div class="field-select__name">Название поля</div>
<div class="field-select__select-wrap">
<select class="field-select__select" multiple>
<optgroup label="optgroup">
<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> </div>
</label> <div class="field-actions">
<div class="field-file"> <button class="btn">Отправить</button>
<div class="field-file__name">Выбор файлов</div>
<label class="field-file__input-wrap">
<input class="field-file__input" type="file" data-multiple-caption="файлов выбрано: {count}" multiple>
<div class="field-file__name-text" data-button-text="Выбрать файл(ы)">Ничего не выбрано</div>
<div class="field-file__help-text">Отображение выбранного файла(ов) требует Javascript-а. Стилизация — не требует.</div>
</label>
</div>
<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">
<div class="field-range__help-text"><code>min="1" max="100" step="1" value="70"</code></div>
</div> </div>
</form>
</div>
<div class="blocks-library__code-wrapper">
<span class="blocks-library__code-show-trigger" title="Показать код"><i class="blocks-library__code-icon"></i></span>
<div class="blocks-library__code">
<pre>
<code class="html">&lt;form class=&quot;form form--horizontal&quot;&gt;</code>
<code class="html"> &lt;label class=&quot;field-text&quot;&gt;...&lt;/label&gt;</code>
<code class="html"> &lt;label class=&quot;field-text&quot;&gt;...&lt;/label&gt;</code>
<code class="html"> &lt;div class=&quot;field-checkbox&quot;&gt;</code>
<code class="html"> &lt;div class=&quot;field-checkbox__title&quot;&gt;&#x41e;&#x431;&#x449;&#x435;&#x435; &#x43d;&#x430;&#x437;&#x432;&#x430;&#x43d;&#x438;&#x435;&lt;/div&gt;</code>
<code class="html"> &lt;div class=&quot;field-checkbox__input-wrap&quot;&gt;...&lt;/div&gt;</code>
<code class="html"> &lt;/div&gt;</code>
<code class="html"> &lt;div class=&quot;field-radio&quot;&gt;</code>
<code class="html"> &lt;div class=&quot;field-radio__title&quot;&gt;&lt;/div&gt; &lt;!-- &larr; &#x412;&#x41d;&#x418;&#x41c;&#x410;&#x41d;&#x418;&#x415;, &#x43f;&#x443;&#x441;&#x442;&#x43e;&#x439; div &#x434;&#x43b;&#x44f; &#x43e;&#x442;&#x441;&#x442;&#x443;&#x43f;&#x430; --&gt;</code>
<code class="html"> &lt;div class=&quot;field-radio__input-wrap&quot;&gt;...&lt;/div&gt;</code>
<code class="html"> &lt;/div&gt;</code>
<code class="html"> &lt;div class=&quot;field-radio&quot;&gt;</code>
<code class="html"> &lt;!-- Нет пустого div (title) &mdash; &#x43d;&#x435;&#x442; &#x438; &#x43e;&#x442;&#x441;&#x442;&#x443;&#x43f;&#x430; --&gt;</code>
<code class="html"> &lt;div class=&quot;field-radio__input-wrap&quot;&gt;...&lt;/div&gt;</code>
<code class="html"> &lt;/div&gt;</code>
<code class="html"> &lt;div class=&quot;field-toggler&quot;&gt;...&lt;/div&gt;</code>
<code class="html"> &lt;label class=&quot;field-select&quot;&gt;...&lt;/label&gt;</code>
<code class="html"> &lt;div class=&quot;field-file&quot;&gt;...&lt;/div&gt;</code>
<code class="html"> &lt;div class=&quot;field-range&quot;&gt;...&lt;/div&gt;</code>
<code class="html"> &lt;div class=&quot;field-actions&quot;&gt;</code>
<code class="html"> &lt;button class=&quot;btn&quot;&gt;&#x41e;&#x442;&#x43f;&#x440;&#x430;&#x432;&#x438;&#x442;&#x44c;&lt;/button&gt;</code>
<code class="html"> &lt;/div&gt;</code>
<code class="html">&lt;/form&gt;</code>
</pre>
</div> </div>
<div class="field-actions"> </div>
<button class="btn">Отправить</button>
</div>
</form>
</div> </div>
</section> </section>
......
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