Liste des sujets Discourse : auteurs et contributeurs

[Lilly]

	Résumé	Ajoute l’auteur du sujet dans la colonne de gauche des pages de liste des sujets, ainsi qu’une option pour n’afficher que le dernier auteur 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
	Nouveau sur les thèmes Discourse ?	Guide pour débutants sur l’utilisation des thèmes Discourse

Installer ce composant de thème

Vue d’ensemble

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 propose des 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ît pas comme le premier avatar dans la liste des auteurs.

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

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

Un interrupteur permet également d’aligner verticalement le contenu de la ligne en haut ou au milieu.

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

Ce composant fonctionne bien avec Extraits de liste de sujets et Résumés IA de Discourse.

Paramètres

Capture d'écran des paramètres avec les options par défaut dans 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 des avatars 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 dans le sujet.
Aligner verticalement la ligne en haut	Interrupteur pour aligner les lignes en haut ou au milieu
Afficher l'auteur sur la page des catégories	Afficher l’avatar de l’auteur au lieu 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 des avatars 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 qu’avec des résumés 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 résumés compacts et étendus, et la barre latérale développée/réduite

Avec les paramètres par défaut :

Forme d’avatar tab_style grande avec les résumés é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é) et Topic_list_show_last_poster_only activé, et résumés é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 tab_style de grande taille et Show_author_on_categories_page désactivé :

Capture d'écran de la vue en taille mobile

Avec des avatars d’auteur tab_style :

---

Notes

• 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 pieds 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.

---

Tâches futures possibles

• Ajouter un interrupteur de désactivation mobile ?
• Exemptions de catégories et de tags ?
• Prise en charge de la lecture de gauche à droite ?
• Façonner les avatars des auteurs ?

Comme toujours, merci à @Moin pour l’idée, les retours 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]

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]

[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]

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]

@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.