 |
Краткое описание | Делает иконку переключения боковой панели динамической и настраиваемой |
 |
Репозиторий | https://github.com/Lillinator/discourse-dynamic-sidebar-icon |
 |
Предпросмотр | https://discourse.theme-creator.io/theme/Lilly/discourse-sidebar-icon |
 |
Инструкция по установке | Как установить тему или компонент темы |
Установить этот компонент темы
Обзор
Легковесный компонент темы для Discourse, который динамически меняет иконку переключения боковой панели в заголовке в зависимости от того, открыта она или закрыта.
По умолчанию компонент отображает стандартную иконку гамбургер-меню (bars), когда боковая панель закрыта, и плавно переходит к иконке закрытия X (xmark), когда панель открыта.
Администраторы при желании могут указать свои собственные иконки, а также включить их отображение в мобильном режиме (хотя динамическая работа компонента применяется только к экранам не мобильных размеров, администраторы, меняющие иконку открытия, могут захотеть обеспечить единообразие с мобильным пользовательским опытом).
Возможности
- Дает пользователям четкую визуальную обратную связь о том, как взаимодействовать с боковой панелью.
- Администраторы могут легко заменить иконки по умолчанию на любые иконки FontAwesome через настройки темы.
- Позволяет включить замену иконки боковой панели для обеспечения единообразия пользовательского опыта на мобильных устройствах.
Скриншоты видео
Иконки по умолчанию:
Использование иконок dog и cat:
Настройки
Настройте иконки, используемые для открытия и закрытия боковой панели, отредактировав настройки компонента:
| настройка | описание |
|---|---|
Icon_to_open_the_sidebar |
иконка, отображаемая, когда боковая панель свернута (по умолчанию: bars) |
Icon_to_close_the_sidebar |
иконка, отображаемая, когда боковая панель развернута (по умолчанию: xmark) |
Apply_open_icon_on_mobile |
применять пользовательскую иконку «открыть» на мобильных экранах (по умолчанию: false) |
Примечания
- Если используются пользовательские иконки, которые ещё не включены в ядро Discourse, они будут отображаться пустыми; чтобы исправить это, необходимо добавить эти иконки (например,
rocket,cat) в настройку сайтаПодмножество SVG-иконв административных настройках Discourse (см.Все настройки сайта→Подмножество SVG-икон). - Этот компонент не работает в режиме выпадающего меню заголовка.
Посмотрите мои другие материалы по Discourse
