Список тем и авторов обсуждений 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]

Thank you for making this, it instantly resolved a potential issue for me!

@Lilly

Further styling improvements

Perhaps this is already planned, wanted to mention that I noticed the padding and alignment of the poster avatar column on the left has an odd indentation (that isn’t present on mobile with the component disabled, for comparison). This looks like the td.posters text-align attribute is affecting the image as well.

The posters avatar list alignment also changes when enabled, and this looks like td.topic-list-data alignment is overriding the default. Easy enough to make stylesheet changes on my end if you’re happy with these otherwise.

Fantastic component, thanks again.

[Lilly]

thanks for the report, i just pushed a fix. update the component and let me know if that helps.

[jordanjay29]

The avatar left alignment is better on desktop. I added this CSS to adjust the middle poster’s column to my preferences:

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

I think your future mobile disable will help, too, because the styling uses a bit more whitespace than needed.

[Lilly]

@jordanjay29

The avatar left alignment is better on desktop. I added this CSS to adjust the middle poster’s column to my preferences:

the top vertical alignment is intentional to be consistent with the rest of the topic card and won’t be changed.

i didn’t make any changes to mobile but i’ll look.

[jordanjay29]

The vertical alignment may have been too broadly applied in your CSS and probably only needs to target the custom-author-column where you’re using td.topic-list-data. I suspect changing the target to td.custom-author-column.topic-list-data will resolve and remove the need for custom styling to fix on my end.

[Lilly]

no i intended for the posters column to vertically aligned top along with all the other row elements. it looks out of place aligned middle (especially if you enable excerpts or ai-gists), but i suppose it is a matter of taste so you an adjust how you like.

vertical alignment

default:

with summary:

i pushed a small change for mobile that should fix the space on the left.

[jordanjay29]

Since my forum doesn’t use excerpts or gists or AI summaries, the default Discourse look is preferred. That change sounds like it makes more sense in a dedicated theme component to me, but we differ and I fixed it on my end so no hard feelings.

Mobile looks a tad better, thanks!

[Lilly]

@jordanjay29 after thinking about this more, i decided to add an alignment toggle (easy enough).

here you go

there is a new setting Vertically align row top that you can disable to get the middle default. let me know if that works for you.

edit: i pushed another fix for the categories page alignment.