Шрифты

Адаптивные размеры шрифтов

f-sml

мелкий шрифт (подписи) 14px > 12px

f-reg

обычный шрифт 16px > 14px

f-big

большой шрифт 20px > 16px

f-huge

огромный шрифт (заголовки) 32px > 20px

Заголовки

h1 + f-huge + c-white

Заголовок раздела

h2 + f-big + c-white

Заголовок подраздела

Виды текста, используемые в контенте

f-reg + c-white

Главный текст

f-reg + c-gray-lt

Обычный текст

f-reg + c-gray-md

Минорный текст

f-sml + c-gray-md

Подпись

Ссылки

link + c-gray-lt

Обычная ссылка

link + c-gray-md

Минорная ссылка

Прочие атрибуты шрифтов

f-up

Вехний регистр

f-bold

Жирный текст

f-italic

Курсив

f-under

Подчёркнутый текст

f-strike

Зачёркнутый текст

Запрет переносов

-

Обычный текст по умолчанию переносится на другую строку

f-nowrap

Текст, который не будет переноситься, в том числе жадным алгоритмом авто-переноса

f-hidden

Текст, который вместо переноса будет скрываться за троеточием

Цвета

c-white

Белый

c-gray-lt

Бело-серый

c-gray-smd

Светло-серый

c-gray-md

Средне-серый

c-gray-smd

Обычный серый

c-gray-dk

Тёмно-серый

c-gray-sdk

Очень тёмно-серый

c-yellow

Золотой

c-green

Зелёный

c-red

Красный

c-blue

Синий

c-black

Чёрный

Цветовая гамма

.text-ff

#FFFFFF

.text-e0

#E0E0E0

.text-88

#888888

.text-6d

#6D6D6D

.text-55

#555555

.text-3d

#3D3B3B

.text-25

#252525

c-yellow

Золотой

c-green

Зелёный

c-red

Красный

c-blue

Синий

c-black

Чёрный

Обычное выравнивание текста

txt-left

Выравнивание по левому краю

txt-center

Выравнивание по центру

txt-right

Выравнивание по правому краю

Флексы (авто-разбивка на колонки + выравнивание)

flex

flex__item

flex

flex__item

flex + flex_top

flex__item

flex + flex_bot

flex__item

Списки

ul

li

...

li

Обычный
Список
Без нумерации

ol

li

...

li

Список
С нумерацией
Только одного уровня

Форматированный текст

txt-format

Контейнер для форматированного текста (обычно есть в шаблоне и в метках не требуется)

Шрифт внутри контейнера автоматически подгоняется под разрешения и не требует специальных классов типа f-reg,f-sml ит.д.

p

Параграф - имеет только нижний отступ

b

Жирный текст

i

Курсив

a

Ссылка

h1

Крупный заголовок

h2

Средний заголовок

h3

Маленький заголовок

quote

div

Текст цитаты, которая пока что используется в турнирах

-Автор цитаты (опционально)

txt-list

div

span + svg

span

div

span + svg

span

...

div

span + svg

span

Элемент списка с иконками

Иконка в SVG спрайте, всегда будет вписана в квадартик 24х24 и покрашена в золотой цвет (если заливка не указана по умолчанию)

После последнего элемента такого списка всегда будет отступ

Отступы

pad-t-hlf

pad-r-hlf

pad-b-hlf

pad-l-hlf

Внутренние отступы х0.5

(пример сверху)

(пример со всех сторон)

pad-t-std

pad-r-std

pad-b-std

pad-l-std

Внутренние отступы х1

(пример сверху)

(пример со всех сторон)

pad-t-dbl

pad-r-dbl

pad-b-dbl

pad-l-dbl

Внутренние отступы х2

(пример сверху)

(пример со всех сторон)

pad-t-tri

pad-r-tri

pad-b-tri

pad-l-tri

Внутренние отступы х3

(пример сверху)

(пример со всех сторон)

pad-t-qud

pad-r-qud

pad-b-qud

pad-l-qud

Внутренние отступы х4

(пример сверху)

(пример со всех сторон)

pad-t-fve

pad-r-fve

pad-b-fve

pad-l-fve

Внутренние отступы х5

(пример сверху)

(пример со всех сторон)

mar-t-hlf

mar-r-hlf

mar-b-hlf

mar-l-hlf

Внешние отступы х0.5

(пример сверху)

(пример со всех сторон)

mar-t-std

mar-r-std

mar-b-std

mar-l-std

Внешние отступы х1

(пример сверху)

(пример со всех сторон)

mar-t-dbl

mar-r-dbl

mar-b-dbl

mar-l-dbl

Внешние отступы х2

(пример сверху)

(пример со всех сторон)

mar-t-tri

mar-r-tri

mar-b-tri

mar-l-tri

Внешние отступы х3

(пример сверху)

(пример со всех сторон)

mar-t-qud

mar-r-qud

mar-b-qud

mar-l-qud

Внешние отступы х4

(пример сверху)

(пример со всех сторон)

mar-t-fve

mar-r-fve

mar-b-fve

mar-l-fve

Внешние отступы х5

(пример сверху)

(пример со всех сторон)