Componente de lista de temas MD

Una presentación más ligera de la lista de temas para tu foro Discourse. La columna de publicadores ha sido eliminada, pero se ha agregado información (nombre y avatar del último publicador) en la columna de actividad y debajo del título del tema (nombre del creador del tema y un pequeño emoji para las etiquetas).


Compatibilidad

Este componente de tema es compatible con las funciones de etiquetas y enlaces destacados, así como con cualquier función disponible en la versión original de la lista de temas. Cualquier estilo de presentación de categoría (viñeta, barra, cuadro) debería funcionar con este componente.

El componente de tema se ha probado en varias paletas de colores; funcionará con temas claros, neutros u oscuros.

Lamentablemente, es posible que el componente de tema no funcione con plugins que ya modifican la presentación de la lista de temas, como las Vistas previas de la lista de temas.

¡Háganmelo saber si tienen algún problema!

29 Me gusta

Me encanta este componente.
¿Hay alguna forma sencilla de hacer que el div poster-info quede exactamente como en la captura de pantalla?
Creo que esto lo hace más legible

Nombre del autor arriba :arrow_up:
Fecha relativa abajo :arrow_down:
image

2 Me gusta

En realidad, no es una mala idea; podría usar esto de forma predeterminada :thinking:

Pero por ahora, puedes editar el componente, en la parte del encabezado, alrededor de las líneas 60 a 69.

Original

<div class='poster-avatar'>
<a href="{{topic.lastPostUr}}" data-user-card="{{topic.last_poster_username}}">{{avatar topic.lastPoster usernamePath="username" imageSize="medium"}}</a>
</div>
<div class='poster-info'>
<a href="{{topic.lastPostUrl}}">
{{format-date topic.bumpedAt format="tiny"}}
</a>
<br />
<span class='editor'><a href="/users/{{topic.last_poster_username}}" data-auto-route="true" data-user-card="{{topic.last_poster_username}}">{{topic.last_poster_username}}</a></span>
</div>

Lo que quieres usar

<div class='poster-avatar'>
<a href="{{topic.lastPostUr}}" data-user-card="{{topic.last_poster_username}}">{{avatar topic.lastPoster usernamePath="username" imageSize="medium"}}</a>
</div>
<div class='poster-info'>
<span class='editor'><a href="/users/{{topic.last_poster_username}}" data-auto-route="true" data-user-card="{{topic.last_poster_username}}">{{topic.last_poster_username}}</a></span>
<br />
<a href="{{topic.lastPostUrl}}">
{{format-date topic.bumpedAt format="tiny"}}
</a>
</div>

Necesitarás editar esto después de cada actualización, pero el componente no se actualizará demasiado.

También podrías bifurcar el repositorio, editar el archivo y usar esta versión en tu foro, si estás familiarizado con GitHub.

5 Me gusta

Probé este cambio en mi foro y creo que es una buena idea; he subido una actualización

Si prefieres lo que usábamos anteriormente, házmelo saber; puedo crear una versión alternativa

6 Me gusta

@Steven, ¿dejó de funcionar con la última actualización? Se ha roto aquí.

1 me gusta

Todavía no me he dado cuenta, por lo general hago mis actualizaciones los fines de semana, lo revisaré esta noche

He actualizado un foro y revisado los registros; no tengo ningún problema.

¿Podrías compartir una captura de pantalla del problema en tu foro? Si recuerdo bien, usas un tema muy personalizado; creo que el problema podría venir de ahí. Pero veré qué puedo hacer.

3 Me gusta

Ya no uso este tema.

Lo probé en Material Design sin personalizaciones de CSS, pero no logro que funcione en ningún tema. ¿Quizás sea un complemento?

Si tienes vistas previas de temas de Discourse, por ejemplo, el componente no funcionará, ya que también utiliza la plantilla topic-list-item.raw.

1 me gusta

Tienes razón al respecto. Pero yo solo lo uso para News Plugin 📰, que requiere la vista previa del tema.

Así que tengo que elegir entre ambos. :sleepy:

¡Se ve increíble en mi foro y el pequeño emoji de etiqueta es genial, jaja! ¡Buen trabajo!

2 Me gusta

Yo también lo estoy usando en mi instancia. Se ve mucho más limpio. Nunca entendí el concepto de los 5 avatares, se ve muy desordenado.

1 me gusta

Acabo de actualizar a la versión más reciente de Discourse (2.5.0.beta2) y parece que los avatares de los usuarios en las publicaciones han desaparecido.

Enlace al foro: https://techscammersunited.com/

1 me gusta

Lo revisaré mañana. Lo actualicé hace unos días y funcionaba bien; quizás algo haya cambiado.

3 Me gusta

Gracias por el informe, ya está solucionado. Puedes actualizar el componente y volver a activarlo.

3 Me gusta

¡Ah, gracias por la solución rápida, amigo! Ahora funciona a la perfección :slight_smile:

He actualizado a la versión más reciente y mis avatares han desaparecido (2.4.1).
He tenido que desactivar este componente por ahora.

También necesitas actualizar Discourse y se solucionará.

2 Me gusta

Por desgracia para mí, eso significa muchas actualizaciones (18 plugins personalizados), así que suelo actualizar cada 3 o 4 meses. Supongo que no tengo suerte :smiley:

¿Hay alguna forma de acceder a la versión anterior?