Демонстрація єдиного підходу до розміщення зображень у статтях довідки. Після ревью цю сторінку можна видалити.
Зображення на всю ширину
Звичайне зображення займає всю ширину контентної колонки, має скруглення 12px, тонку рамку та підпис синім кольором під ним:
Текст із зображенням праворуч
Це основний варіант для блоків «текст + скріншот»: зображення з позначкою "right" стає в половину ширини праворуч, а текст, що йде після нього, обтікає його зліва. Такий блок підходить для кроків інструкції, коли скріншот ілюструє саме цей фрагмент тексту, а не всю статтю.
Розташовуйте рядок зображення безпосередньо ПЕРЕД текстом, який воно ілюструє. На мобільних пристроях блок автоматично розгортається на всю ширину — обтікання зникає, зображення стає над текстом.
Зображення на половину ширини
Позначка "half" — зображення в половину ширини без обтікання, наступний текст іде під ним:
Галерея з двох зображень
Два зображення в одному абзаці стають галереєю з двох колонок:
Галерея з трьох зображень
Три зображення в одному абзаці — три колонки, як у дизайні:
Для порівняння: блок рекомендацій
Рекомендації / Корисні поради "Зображення оформлюються інакше, ніж цей блок — без курсиву та синьої смуги."
