Техническое задание: Верстка HTML-блоков для CMS

Цель проекта - разработка готовых верстаных блоков для вставки в систему управления контентом.

Основная цель

Создать библиотеку кастомных HTML-блоков для страниц услуг сайта.

Исходные материалы

• Макет в Figma
• Действующий сайт в качестве референса по стилю и поведению

Технический стек

• Фронтенд: Bootstrap 3, чистый HTML, CSS, JavaScript
• CMS: 1С-Битрикс с определенной темой оформления

Технические требования

Стилизация и наследование

• Все блоки должны использовать CSS-переменные (:root) активной темы (цвета, шрифты, отступы).
• Необходимо провести аудит существующих стилей темы и применить её переменные.
• Новые классы должны иметь уникальные префиксы (например, .wf-list-1, .wf-table).

Адаптивность и сетка

• Полная адаптивность на основе брейкпоинтов и логики текущего сайта.
• Изучение поведения аналогичных блоков на сайте-референсе и применение той же логики (перестроение сетки, изменение размеров, скрытие элементов).
• Корректная работа блоков при ширине контейнера 1348px, 1500px, 1700px.
• Тестирование на основных разрешениях: десктоп, планшет, мобильное устройство.

Элементы для стилизации

• Кнопки (оформление по референсу)
• Кастомные маркированные списки
• Таблицы
• Табы (требуется только стилизация, скрипты уже реализованы)
• Слайдер на Swiper (стилизация под предоставленный дизайн)

Ожидаемый результат

• HTML-файл с готовой версткой всех блоков.
• CSS-файл с общими стилями для блоков.