Liste des sujets MD Composant Mobile

[Steven]

Après avoir travaillé sur une petite refonte des pages de liste de sujets sur ordinateur, j’ai développé une version mobile avec des idées similaires : plus d’espace pour les titres des sujets, une deuxième ligne avec plus d’informations et une colonne dédiée uniquement au dernier message.

Compatibilité

Ce composant de thème est compatible avec les fonctions des balises, des liens mis en avant, ainsi qu’avec toutes les fonctions disponibles dans la version originale de la liste des sujets. Toute présentation de style de catégorie (puces, barre, boîte) devrait fonctionner avec ce composant.

Le composant de thème a été testé sur plusieurs palettes de couleurs et fonctionnera avec des thèmes clairs, neutres ou sombres.

Malheureusement, ce composant de thème pourrait ne pas fonctionner avec des plugins qui modifient déjà la présentation de la liste des sujets, comme les aperçus de liste de sujets.

N’hésitez pas à me faire part de tout problème !

	Aperçu	md-topic-list-mobile - Aperçu
	Dépôt	md-topic-list-mobile
	Guide d’installation	Comment installer un thème ou un composant de thème
	Nouveau sur les thèmes Discourse ?	Guide pour les débutants sur l’utilisation des thèmes Discourse

[Heliosurge (Dan DeMontmorency)]

Nice Plugin. Though a general Reccommendation can we have Theme & Components list min Discourse version? I am on Stable branch but do have a test sandbox for 2.5beta. @codinghorror?

[Steven]

I just did a specific branch for older versions.

When installing, use the link https://github.com/iunctis/md-topic-list-mobile the advanced options and add older-discourse

You’ll know if it works if the avatars on the right column works fine. In a few weeks, when the avatars will be broken, you’ll just have to reinstall the component without using the advanced option

[Canapin (Coin-coin le Canapin)]

A direct comparison:

Default / Component

I like the fact that the last poster avatar is on the right.
On the default mobile layout, the big avatar just on the left of the topic title screams “author”.

Just out of curiosity, I looked at the scss file, any reason for which you didn’t use nested syntax provided by scss?

[Heliosurge (Dan DeMontmorency)]

@Steven

When installing, use the link https://github.com/iunctis/md-topic-list-mobile the advanced options and add older-discourse

Tried the advanced option. Still says disabled req 2.5 beta2

[Steven]

@Canapin

Just out of curiosity, I looked at the scss file, any reason for which you didn’t use nested syntax provided by scss?

Mostly because I make more mistakes with nested syntax on css

But I could rewrite it in a few weeks when I’m more confident with the topic list design

@Heliosurge I edited the about.json file, it should be ok now

[Heliosurge (Dan DeMontmorency)]

Thank you for your awesome work.

[Steven]

I pushed a little upgrade just now. No new feature but I added the compatibility with the new thumbnails functions.

The theme component is now fully compatible with these components:

Topic List Thumbnails

Summary Topic List Thumbnails allows you to show topic thumbnails in topic list views. Preview Theme category - Discourse Meta Repository Link https://github.com/discourse/discourse-topic-thumbnails New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component Optimized images are generated for the lists, and different resolutions are made available for high-dpi displays. Images ar…

Topic List Excerpts

Summary Topic List Excerpts allows you to enable excerpts for unpinned topics (by default, Discourse only displays topic excerpts for pinned topics). Preview Preview on theme creator Repository Link https://github.com/discourse/discourse-topic-excerpts New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component [Screenshot 2020-05-14 at 18.56.29] Works great alongside Topic Li…

[Merlls_Rizzini]

I love it, so clean. @Steven I was wondering if its possible too add with CSS this native feature when you click in total replies?

[Steven]

Not with css but the template can be corrected.

I personally only use this feature to access the first post but I shouldn’t impose my way of navigating to everyone. I’ll see if I can reinstore the feature

[Steven]

I upgraded the component to reinstore this feature, I tested on two supports but if there’s any issue let me know

[Canapin (Coin-coin le Canapin)]

Hey @Steven, it seems that the new messages notifications are shown twice. Once on the right of the topic title, once instead of the reply counter. Is that a bug or am I missing something here?

Very nice mobile topic view by the way. My users like it.

[Steven]

It must come from the last update with the topic entrance button. I think it’ll be better to go back to the previous version. It’s not really adapted to the component.

I’ll upgrade in a few minutes

edit: Upgraded just now, let me know if it’s better

[Canapin (Coin-coin le Canapin)]

Yes it works perfectly now, thank you it was fast

[Canapin (Coin-coin le Canapin)]

I think you shoud remove the tag emoji you added in front of the tag list:

It looks different on different os:

It may not fit the forum’s design, and it should honor desktop design choices (where there is no icon by default)

If you actually add a tag icon with tag icons component, it will look like this:

So I hid the emoji with CSS, but I think it shouldn’ be here in the first place

How it is displayed on my forum now:

.md-tlm .discourse-tags::before {
    display: none;
}
.md-tlm .tl-replies {
    margin-right: 8px;
}

[Steven]

Thanks for the feedback, I have major internet issues so I’m a bit behind on all discourse work.

I like the idea of the tag icon or emoji, but I’ll probably change the two theme components to a d-icon tag. At the same time, I’ll create a branch without any icon for a compatibility with the tag icons component

[Canapin (Coin-coin le Canapin)]

Salut Steven !
Il semble y avoir quelques problèmes de mise en page avec la version actuelle de Discourse.
J’ai créé un thème vide et j’ai juste inclus le composant mobile MD Topic List, et cela semble effectivement être le problème.
Voici la vue mobile :

Il y a quelque chose d’étrange avec les marges/remplissages.

[Steven]

Merci, je vais regarder ça tout de suite.

Je vais essayer de réécrire le template pour supprimer le maximum de classes personnalisées également, je pense que c’est mieux avec la refonte en cours dans le cœur.

edit : Nouveau commit, j’ai réécrit le template et la feuille de style pour faciliter les mises à jour futures.

Template rewrite

Faites-moi savoir si vous rencontrez des problèmes @Canapin

[Canapin (Coin-coin le Canapin)]

Cela semble parfait. Merci !

[Mr.X_Mr.X]

Pouvons-nous ajouter le nombre total de mentions J’aime et de vues du sujet à côté du nombre de réponses ?