Правила верстки базовых элементов на десктопе. Боковые меню и общая модульная сетка.

Блоки экрана

Общий Layout

Бокове меню

Развернутое боковое меню

Развернутое бокове меню

Свернутое боковое меню

Свернутое боковое меню

Меню с подразделами

Когда включены подразделы меню, контент лучше затемнять, чтобы сфокусировать внимание на навигации

Меню с подразделами

Общая модульная сетка

Содержимое разбито на 12 колонок с отступом 32px между ними. Максимальная ширина контента — 1280px. При увеличении экрана контент не тянется больше этого значения.

Основная сетка

Контент с ограничением ширины

Небольшое окно

Небольшое окно

Большое окно

Большое окно

Контент на 100% ширины

Когда контент тянется на 100%, содержимое уже не делится на колонки. Лучше прибивать контролы к левой и правой границам (с отступом L).

Отступы

100% ширины