In my forum,
1.I have an ample amount of space to use it for extending the post created by user.It rather looks clumpsy now.I want to utilize the space so that the post looks good,like the homepage is screen friendly using code:
@media screen and (min-width: 1400px) {
.wrap { max-width: 1500px; }
}
I want the post to be such
eg.
Please suggest how to do this
Any suggestion will be helpful
not a developer, but i think this may help:
https://meta.discourse.org/t/material-design-for-discourse/28864
My forum slightly increases post size by:
.topic-body{
min-width: 65%;
}
You can adjust as needed.
Consider readability before making it too wide:
I ended up going 75% because we are a very media heavy site. That’s the great part about Discourse, you can make it whatever you want it to be as long as you make sure it doesn’t conflict with other elements on the page.
I had 75 originally but line breaks in the “reply by new topic” button looked really weird, along with the topic links in the gutter.
I think the team has plans to move the topic links below the posts and clear out the gutter in a later release, but until then just be mindful of the gutter content.
Brilliant! Thank you for this snippet!
I changed my Topic Body as follows (by adding to my CSS):
.topic-body {
min-width: 80%;
}
After switching to 80%, I noticed that the Topic Timeline scrunches over the Topic Body starting at 1260px, until the time when it naturally disappears for mobile (maybe 800px?)
So I added this little snippet to my CSS to remove the timeline when the screen size shrinks below 1260px…
@media screen and (max-width: 1260px) {
.topic-timeline {
display: none;
}
}
Works like a charm now!
Je pense que quelque chose comme ça a plus de sens :
@media screen and (min-width: 1260px) {
.topic-body {
min-width: 80%;
}
}
Je n’ai pas essayé cela, mais je soupçonne que vous avez raison ! Mon CSS n’est pas toujours la meilleure approche ! J’essaie simplement plusieurs méthodes différentes jusqu’à ce que la page fasse ce que je veux ! Je suis en train de créer une nouvelle communauté. Si j’ai besoin de la même chose à l’avenir, je reviendrai vous dire comment cela s’est passé ! Merci d’avoir partagé une autre solution (probablement meilleure) !
Voici également mon composant de thème avec ce CSS. C’est maintenant la méthode recommandée pour éviter de modifier manuellement tous les thèmes.
J’ai refactorisé et étendu ce composant.
La taille est maintenant spécifiée en px au lieu de % pour éviter toute confusion et permettre son utilisation ailleurs.
.topic-post:not(.d-toc-post) .topic-body {
width: calc(#{$topic-body-width} + (#{$topic-body-width-padding} * 2) + #{$additional_post_width});
}
Les deux premiers termes de cette somme sont issus du SCSS standard de Discourse.
Quelques améliorations mineures de l’interface ont été apportées, comme l’augmentation de la taille des séparateurs et des messages d’action des modérateurs. De plus, cette fonctionnalité est désormais désactivée sur les messages DiscoTOC, car elle se comporte de manière étrange dans ce contexte.
J’ai également ajouté une option pour augmenter la largeur maximale de l’éditeur afin que l’aperçu corresponde à la largeur du message. Ce n’est pas exactement la même largeur, mais la version standard présente le même problème.
Très bien, @Alex_P. Si vous pouviez le faire fonctionner avec le thème Material Design, ce serait formidable. Le problème, c’est que l’avatar à gauche du message passe du côté au-dessus du message lui-même.