Список тем и авторов обсуждений Discourse

[Lilly]

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

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

Обзор

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

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

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

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

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

Этот компонент хорошо работает с Выдержками из списка тем и Обзорными гистами Discourse AI.

Настройки

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

Настройки	Описание
Размер аватара автора в списке тем	Размер аватаров в колонке автора на страницах со списком тем — small, medium или large.
Скругление аватара автора в списке тем	Скругление аватара на страницах со списком тем: 0% = квадрат → 50% = круг. tab_style = скруглённые левые углы
Показывать только последнего постера в списке тем	Показывать только аватар последнего постера в колонке постеров, но только если в теме участвует более одного человека.
Вертикальное выравнивание строки сверху	Переключатель для выравнивания строк сверху или по центру
Показывать автора на странице категорий	Показывать аватар автора вместо последнего постера в списках тем на странице категорий.
Размер аватара темы на странице категорий	Размер аватаров в колонке автора в списках тем на странице категорий — small, medium или large.
Скругление аватара на странице категорий	Скругление аватара на странице категорий: 0% = квадрат → 50% = круг. tab_style = скруглённые левые углы

Скриншоты

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

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

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

Аватары большого размера с формой 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 за идею, обратную связь и помощь в отладке.

[jordanjay29]

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

@Lilly

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

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

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

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

[Lilly]

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

[jordanjay29]

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

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

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

[Lilly]

@jordanjay29

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

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

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

[jordanjay29]

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

[Lilly]

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

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

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

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

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

[jordanjay29]

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

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

[Lilly]

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

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

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

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