Liste des sujets Discourse : auteurs et participants

[Lilly (Lillian)]

	Résumé	Ajoute l’auteur du sujet dans la colonne de gauche des pages de liste de sujets, ainsi qu’une option pour n’afficher que l’auteur le plus récent dans la colonne par défaut des auteurs. L’avatar de l’auteur peut également être redimensionné et remodelé.
	Aperçu	https://discourse.theme-creator.io/theme/Lilly/discourse-topic-list-author-posters
	Dépôt	https://github.com/Lillinator/discourse-topic-list-author-posters
	Guide d’installation	Comment installer un thème ou un composant de thème

Installer ce composant de thème

Aperçu général

Ce composant de thème Discourse insère l’avatar de l’auteur du sujet dans la première colonne de toutes les routes de liste de sujets et dispose de paramètres permettant à l’administrateur de spécifier la forme et la taille de l’avatar. De plus, l’avatar de l’auteur n’apparaîtra pas en tant que premier avatar dans la liste des auteurs.

Il existe également un paramètre pour faire en sorte que la colonne des avatars des auteurs n’affiche que le dernier (le plus récent) auteur, mais uniquement s’il y a plus d’un participant au sujet. Ainsi, l’avatar de l’auteur ne s’affichera que s’il y a d’autres auteurs dans le sujet.

En outre, les administrateurs peuvent également choisir d’afficher l’auteur du sujet sur la page de catégorie lorsque les vues de liste de sujets récents sont activées (c’est-à-dire : « Catégories avec les sujets les plus récents »), et il existe également des options de taille et de forme pour l’avatar.

Il existe également un commutateur pour aligner verticalement le contenu de la ligne en haut ou au milieu.

Sur les petits écrans (taille mobile), l’auteur apparaîtra à l’endroit où se trouve l’avatar du dernier auteur.

Ce composant fonctionne bien avec Les extraits de liste de sujets et Les résumés gists de Discourse AI.

Paramètres

Capture d'écran des paramètres avec les options par défaut sur la page d'administration du composant

Paramètres	Description
Taille de l'avatar de l'auteur dans la liste des sujets	Taille des avatars dans la colonne de l’avatar de l’auteur des routes de page de liste de sujets - petit, moyen ou grand.
Rayon de bordure de l'avatar de l'auteur dans la liste des sujets	Arrondi de l’avatar sur les routes de page de liste de sujets : 0% = carré → 50% = cercle. tab_style = coins arrondis à gauche
Afficher uniquement le dernier auteur dans la liste des sujets	Afficher uniquement l’avatar du dernier auteur dans la colonne des auteurs, mais uniquement s’il y a plus d’un participant au sujet.
Aligner verticalement la ligne en haut	Commutateur pour aligner les lignes en haut ou au milieu
Afficher l'auteur sur la page des catégories	Afficher l’avatar de l’auteur à la place du dernier auteur dans les listes de sujets sur la page des catégories.
Taille de l'avatar sur la page des catégories	Taille des avatars dans la colonne de l’avatar de l’auteur dans les listes de sujets de la page des catégories - petit, moyen ou grand.
Rayon de bordure de l'avatar sur la page des catégories	Arrondi de l’avatar sur la page des catégories : 0% = carré → 50% = cercle. tab_style = coins arrondis à gauche

Captures d’écran

Voici quelques captures d’écran avec différentes tailles et formes d’avatar, ainsi que des résumés gists d’IA étendus.

Captures d'écran de diverses pages de liste de sujets avec différents paramètres de composant activés, montrant à la fois les modes gists compacts et étendus, et la barre latérale étendue/réduite

Avec les paramètres par défaut :

Forme d’avatar tab_style grande avec les résumés gists étendus :

Petits avatars avec une forme de rayon de bordure de 15% et Topic_list_show_last_poster_only activé :

Avatars de taille moyenne avec un rayon de bordure de 0% (carré), Topic_list_show_last_poster_only activé et les résumés gists étendus :

Captures d'écran de la page des catégories montrant 2 tailles et formes différentes d'avatars avec l'auteur ou le dernier auteur.

Paramètres par défaut du composant, avec des avatars ronds de taille moyenne et Show_author_on_categories_page activé :

Avatars de grande taille de style tab_style et Show_author_on_categories_page désactivé :

Capture d'écran de la vue en taille mobile

Avec des avatars d’auteur de style tab_style :

---

Remarques

• Insère l’avatar de l’auteur et modifie la colonne des auteurs là où c’est attendu dans les onglets de la page de profil.
• Le comportement mobile est le même que par défaut dans les listes de pied de page des sujets (sujets suggérés/connexes) et dans les pages d’onglets de profil et de boîte de réception.
• Pas vraiment compatible avec le thème horizon.

---

Futurs travaux possibles

• Ajouter un commutateur de désactivation mobile ?
• Exceptions pour les catégories et les balises ?
• Prise en charge de la lecture de gauche à droite ?
• Remodeler les avatars des auteurs ?

Comme toujours, merci à @Moin pour l’idée, les commentaires et l’aide au débogage.

---

Découvrez mes autres créations Discourse

[jordanjay29]

Merci d’avoir créé ceci, cela a instantanément résolu un problème potentiel pour moi !

@Lilly

Améliorations de style supplémentaires

Peut-être que c’est déjà prévu, je voulais mentionner que j’ai remarqué que le rembourrage et l’alignement de la colonne de l’avatar de l’afficheur à gauche ont une indentation étrange (qui n’est pas présente sur mobile avec le composant désactivé, à titre de comparaison). Cela ressemble à l’attribut text-align de td.posters qui affecte également l’image.
L’alignement de la liste des avatars des afficheurs change également lorsqu’il est activé, et il semble que l’alignement de td.topic-list-data écrase la valeur par défaut. Il est assez facile d’apporter des modifications de feuille de style de mon côté si vous êtes satisfait de ces éléments par ailleurs.
Composant fantastique, merci encore.

[Lilly (Lillian)]

merci pour le signalement, je viens de pousser un correctif. mettez à jour le composant et faites-moi savoir si cela aide.

[jordanjay29]

L’alignement de l’avatar à gauche est meilleur sur ordinateur. J’ai ajouté ce CSS pour ajuster la colonne de l’afficheur du milieu à mes préférences :

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

Je pense que votre future désactivation mobile aidera aussi, car le style utilise un peu plus d’espace blanc que nécessaire.

[Lilly (Lillian)]

[quote=“jordanjay29, post:4, topic:394364”]L’alignement à gauche de l’avatar est meilleur sur ordinateur. J’ai ajouté ce CSS pour ajuster la colonne de l’afficheur du milieu à mes préférences :

[/quote]

L’alignement vertical supérieur est intentionnel pour être cohérent avec le reste de la carte du sujet et ne sera pas modifié.

Je n’ai fait aucun changement pour le mobile, mais je vais regarder.

[jordanjay29]

L’alignement vertical a peut-être été appliqué de manière trop large dans votre CSS et n’a probablement besoin de cibler que la custom-author-column là où vous utilisez td.topic-list-data. Je soupçonne que le changement de cible à td.custom-author-column.topic-list-data résoudra le problème et supprimera la nécessité d’un style personnalisé pour le corriger de mon côté.

[Lilly (Lillian)]

non, j’avais l’intention que la colonne des affiches soit alignée verticalement en haut avec tous les autres éléments de la ligne. Elle semble déplacée alignée au milieu (surtout si vous activez les extraits ou les aperçus IA), mais je suppose que c’est une question de goût, vous pouvez donc ajuster comme vous le souhaitez.

j’ai poussé un petit changement pour le mobile.

[jordanjay29]

Puisque mon forum n’utilise pas d’extraits, de gists ou de résumés IA, l’apparence par défaut de Discourse est préférée. Ce changement me semble plus pertinent dans un composant de thème dédié, mais nous sommes en désaccord et j’ai réglé cela de mon côté, donc pas de rancune.

L’affichage mobile est un peu meilleur, merci !

[Lilly (Lillian)]

@jordanjay29 après y avoir réfléchi davantage, j’ai décidé d’ajouter une bascule d’alignement (assez facile).

Voilà

Il y a un nouveau paramètre Aligner verticalement le haut de la ligne que vous pouvez désactiver pour obtenir le centrage par défaut. Faites-moi savoir si cela fonctionne pour vous.