Стандартизированная типография на всем сайте. Далее приведены все стандарты типографии шаблона.
h1, .intec-ui-markup-h1, [data-ui-markup="h1"])
Интернет-магазин (англ. online shop или e-shop) — сайт, торгующий товарами посредством сети Интернет. Позволяет пользователям онлайн, в своём браузере или через мобильное приложение, сформировать заказ на покупку, выбрать способ оплаты и доставки заказа, оплатить заказ.
(p, .intec-ui-markup-p, [data-ui-markup="p"])
При этом продажа товаров осуществляется дистанционным способом и она накладывает ограничения на продаваемые товары.
(blockquote, .intec-ui-markup-blockquote, [data-ui-markup="blockquote"])
h2, .intec-ui-markup-h2, [data-ui-markup="h2"])
Когда онлайн-магазин настроен на то, чтобы позволить компаниям покупать у других компаний, этот процесс называется онлайн-магазинами бизнес для бизнеса (B2B).
(i, .intec-ui-markup-i, [data-ui-markup="i"])
Когда онлайн-магазин настроен на то, чтобы позволить компаниям покупать у других компаний, этот процесс называется онлайн-магазинами бизнес для бизнеса (B2B).
(b, .intec-ui-markup-b, [data-ui-markup="b"])
h3, .intec-ui-markup-h3, [data-ui-markup="h3"])ul li, .intec-ui-markup-ul .intec-ui-markup-li, [data-ui-markup="ul"] [data-ui-markup="li"])h4, .intec-ui-markup-h4, [data-ui-markup="h4"])ol li, .intec-ui-markup-ol .intec-ui-markup-li, [data-ui-markup="ol"] [data-ui-markup="li"])h5, .intec-ui-markup-h5, [data-ui-markup="h5"])
Ссылка 1,
Ссылка 2,
Ссылка 3
(a, .intec-ui-markup-a, [data-ui-markup="a"])
h6, .intec-ui-markup-h6, [data-ui-markup="h6"])
Горизонтальная линия (hr, .intec-ui-markup-hr, [data-ui-markup="hr"])
Код (code, .intec-ui-markup-code, [data-ui-markup="code"])
<div class="intec-ui-markup-code">
Пример оформления кода
</div>
Каждый элемент интерфейса имеет класс .intec-ui, а также собственный класс .intec-ui-control-<элемент>.
Большинство элементов (кнопки, поля ввода, счетчики) имеют сетку в 4px и стандартную высоту в 32px.
Размеры элементов можно менять с помощью класса .intec-ui-size-<размер>, где размер - это число от 1 до 5.
Каждый размер увеличивает высоту элемента на 4px.
Все элементы (кроме полей ввода) имеют цветовые схемы. Цветовые схемы задаются с помощью класса .intec-ui-scheme-<схема>
Доступны следующие цветовые схемы:
current - Текущая цветовая схема сайтаred - Красная цветовая схемаgreen - Зеленая цветовая схемаorange - Оранжевая цветовая схемаgray - Серая цветовая схемаbutton)
Класс для применения: .intec-ui.intec-ui-control-button.
Для того чтобы сделать кнопку блочным элементом, необходимо добавить класс .intec-ui-mod-block.
Для того чтобы сделать кнопку прозрачной, необходимо добавить класс .intec-ui-mod-transparent.
Для того чтобы скруглить углы кнопки, необходимо добавить класс .intec-ui-mod-round-<значение>, где значение - это число от 1 до 5, которое эквивалентно скруглению в пикселях.
input)
Класс для применения: .intec-ui.intec-ui-control-input.
Для того чтобы сделать поле ввода блочным элементом, необходимо добавить класс .intec-ui-mod-block.
Для того чтобы скруглить углы поля ввода, необходимо добавить класс .intec-ui-mod-round-<значение>, где значение - это число от 1 до 5, которое эквивалентно скруглению в пикселях.
Интерактивная кнопка с иконкой, состоит из 2-х частей. Первая часть это контейнер с классом .intec-ui-part-icon (иконка), вторая - .intec-ui-part-content (содержимое кнопки). Иконка может быть расположена с любой стороны.
checkbox)
Класс для применения: .intec-ui.intec-ui-control-checkbox.
radiobox)
Класс для применения: .intec-ui.intec-ui-control-radiobox.
tabs)
Класс для применения: .intec-ui.intec-ui-control-tabs.
Для того чтобы сделать вкладки блочным элементом, необходимо добавить класс .intec-ui-mod-block.