Компонент Tabs
Макрос с передачей контента через параметр content
1. Горизонтальные, рамка
Контент вкладки "Профиль"
Здесь может быть форма редактирования профиля, аватар, личные данные.
Контент вкладки "Настройки"
Настройки уведомлений, языка, региональные параметры.
Контент вкладки "Безопасность"
Смена пароля, двухфакторная аутентификация, сессии.
2. Прозрачные табы
Методы входа
Текущие сессии
Настройки профиля
3. Вертикальные, рамка
Дашборд
Общая статистика и ключевые показатели.
Аналитика
Графики и аналитические данные.
Пользователи
Список пользователей и управление доступом.
Отчеты
Сгенерированные отчеты и экспорт данных.
4. Вертикальные, подчеркивание
Список проектов
Текущие задачи
Участники команды
5. Размеры
Small
Контент 1
Контент 2
Medium
Контент 1
Контент 2
Large
Контент 1
Контент 2
6. Внутри карточки
Настройки аккаунта
Настройки приватности
7. Карточки внутри вкладок
Товар 1
Описание популярного товара
Товар 2
Описание популярного товара
Товар 3
Описание популярного товара
Новинка 1
Новый товар в коллекции
Новинка 2
Новый товар в коллекции
О компоненте
Tabs работает на чистом CSS через radio-кнопки.
Контент передается через параметр content в каждом элементе items.
Доступны варианты: horizontal/vertical, bordered/underline, размеры sm/md/lg.
Прозрачные табы (invisible) — через класс app-tabs--invisible.