Список тем и авторов постов в Discourse

[Lilly (Lillian)]

	Резюме	Добавляет автора темы в левую колонку страниц со списком тем, а также предоставляет опцию отображения только самого последнего участника в колонке по умолчанию с постерами. Размер и форму аватара автора также можно настроить.
	Предпросмотр	https://discourse.theme-creator.io/theme/Lilly/discourse-topic-list-author-posters
	Репозиторий	https://github.com/Lillinator/discourse-topic-list-author-posters
	Инструкция по установке	Как установить тему или компонент темы

Установить этот компонент темы

Обзор

Этот компонент темы Discourse вставляет аватар автора темы в первую колонку всех маршрутов со списком тем и имеет настройки, позволяющие администратору указать форму и размер аватара. Кроме того, аватар автора не будет отображаться первым в списке постеров.

Также есть настройка, позволяющая отображать в колонке с аватарами постеров только последнего (самого свежего) участника, но только если в теме участвует более одного человека. Таким образом, аватар автора будет виден только при наличии других постеров в теме.

Кроме того, администраторы могут выбрать отображение автора темы на странице категории, когда включен вид списка последних тем (например: «Категории с последними темами»), а также доступны варианты размера и формы аватара.

Добавлен переключатель для вертикального выравнивания содержимого строки по верху или по центру.

На экранах с небольшим разрешением (мобильный размер) автор будет отображаться там, где обычно находится аватар последнего постера.

Этот компонент хорошо работает с Вставками из списка тем и AI-резюме Discourse.

Настройки

Скриншот настроек с параметрами по умолчанию на странице администрирования компонента

Настройки	Описание
Topic list author avatar size	Размер аватаров в колонке автора на страницах со списком тем — small (маленький), medium (средний) или large (большой).
Topic list author avatar border radius	Закругление аватаров на страницах со списком тем: 0% = квадрат → 50% = круг. tab_style = закруглённые левые углы
Topic list show last poster only	Отображать в колонке постеров только аватар последнего участника, но только если в теме участвует более одного человека.
Vertically align row top	Переключатель для выравнивания строк по верху или по центру
Show author on categories page	Отображать аватар автора вместо последнего постера в списках тем на странице категорий.
Category page topic avatar size	Размер аватаров в колонке автора в списках тем на странице категорий — small, medium или large.
Category page avatar border radius	Закругление аватаров на странице категорий: 0% = квадрат → 50% = круг. tab_style = закруглённые левые углы

Скриншоты

Ниже представлены скриншоты с различными настройками размера и формы аватаров, а также с раскрытыми AI-резюме.

Скриншоты различных страниц со списком тем с включёнными разными настройками компонента, показывающие как компактный, так и развёрнутый режимы гистов, а также развёрнутую/свёрнутую боковую панель

С настройками по умолчанию:

Аватары формы tab_style большого размера с раскрытыми резюме:

Маленькие аватары с закруглением 15% и включённой настройкой Topic_list_show_last_poster_only:

Аватары среднего размера с закруглением 0% (квадрат), включённой настройкой Topic_list_show_last_poster_only и раскрытыми резюме:

Скриншоты страницы категорий, показывающие два разных размера и формы аватаров с автором или последним постером.

Настройки компонента по умолчанию, аватары среднего размера и круглой формы, включена настройка Show_author_on_categories_page:

Аватары большого размера формы tab_style, настройка Show_author_on_categories_page отключена:

Скриншот мобильного вида

С аватарами автора формы tab_style:

---

Примечания

• Вставляет аватар автора и изменяет колонку постеров в ожидаемых местах на вкладках страницы профиля.
• Поведение на мобильных устройствах аналогично стандартному в списках тем в футере (предлагаемые/связанные темы) и на вкладках профиля и входящих сообщений.
• Не совсем совместим с темой Horizon.

---

Возможные задачи на будущее

• Добавить переключатель отключения для мобильных устройств?
• Исключения для категорий и тегов?
• Поддержка направления слева направо?
• Закругление аватаров постеров?

Как всегда, спасибо @Moin за идею, обратную связь и помощь в отладке.

---

Посмотрите другие мои материалы по Discourse

[jordanjay29]

Спасибо за создание этого плагина, он мгновенно решил потенциальную проблему для меня!

@Lilly

Дальнейшие улучшения стиля

Возможно, это уже запланировано, но хотел упомянуть, что я заметил странное отступление у колонки с аватаром автора слева (которого нет на мобильных устройствах, когда компонент отключен, для сравнения). Похоже, что атрибут text-align для td.posters влияет и на изображение.

Выравнивание списка аватаров авторов также меняется при включении компонента, и это выглядит так, будто выравнивание td.topic-list-data переопределяет значение по умолчанию. Если вас всё устраивает, я легко могу внести изменения в стили на своей стороне.

Отличный компонент, спасибо ещё раз.

[Lilly (Lillian)]

Спасибо за отчёт, я только что внёс исправление. Обновите компонент и дайте знать, если это поможет.

[jordanjay29]

Выравнивание аватара по левому краю на десктопе выглядит лучше. Я добавил этот CSS, чтобы настроить колонку среднего постера под свои предпочтения:

td.posters.topic-list-data {
    vertical-align: middle !important;
}

Думаю, ваше будущее отключение для мобильных устройств тоже поможет, так как стилизация использует чуть больше пустого пространства, чем необходимо.

[Lilly (Lillian)]

@jordanjay29

На десктопе выравнивание аватара по левому краю выглядит лучше. Я добавил этот CSS, чтобы настроить колонку среднего постера под свои предпочтения:

Вертикальное выравнивание сверху сделано намеренно, чтобы сохранить единообразие с остальными карточками тем, и менять его не будем.

Я не вносил изменений для мобильных устройств, но посмотрю.

[jordanjay29]

Вертикальное выравнивание, возможно, было применено слишком широко в вашем CSS, и, вероятно, нужно указывать только на custom-author-column, где вы используете td.topic-list-data. Я предполагаю, что изменение селектора на td.custom-author-column.topic-list-data решит проблему и устранит необходимость в кастомных стилях с моей стороны.

[Lilly (Lillian)]

Нет, я имел в виду, что колонка с постерами должна быть выровнена по верхнему краю, как и все остальные элементы строки. Выглядит неуместно, если она выровнена по центру (особенно если включены выдержки или AI-краткие содержания), но, полагаю, это вопрос вкуса, так что вы можете настроить как вам угодно.

Вертикальное выравнивание

По умолчанию:

С кратким содержанием:

Я внес небольшое изменение для мобильных устройств, которое должно исправить отступ слева.

[jordanjay29]

Так как на моём форуме не используются отрывки, сниппеты или сводки на базе ИИ, предпочтителен стандартный вид Discourse. Мне кажется, что такое изменение логичнее реализовать в отдельном компоненте темы, но у нас разные мнения, и я уже исправил это на своей стороне — без обид.

На мобильных устройствах теперь выглядит немного лучше, спасибо!

[Lilly (Lillian)]

@jordanjay29 после ещё раз обдумав это, я решил добавить переключатель выравнивания (это было несложно).

вот, пожалуйста

появилась новая настройка Выравнивать верхнюю строку по вертикали, которую можно отключить, чтобы вернуть выравнивание по центру по умолчанию. дай знать, если это поможет.

редактирование: я выпустил ещё одно исправление для выравнивания на странице категорий.