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!
Ich denke, so etwas ergibt mehr Sinn:
@media screen and (min-width: 1260px) {
.topic-body {
min-width: 80%;
}
}
Ich habe das zwar noch nicht ausprobiert, aber ich vermute, du liegst richtig! Mein CSS ist nicht immer der beste Ansatz! Ich probiere einfach ein paar verschiedene Methoden aus, bis die Seite das tut, was ich will! Ich arbeite gerade daran, eine neue Community aufzubauen. Falls ich später genau das Gleiche brauche, melde ich mich wieder und berichte, wie es läuft! Danke, dass du mit einer (wahrscheinlich besseren) Lösung eingegriffen hast!
Hier ist auch meine Theme-Komponente mit diesem CSS. Dies ist derzeit die empfohlene Methode, um das manuelle Bearbeiten aller Themes zu vermeiden.
Ich habe diese Komponente refaktoriert und erweitert.
Die Größe wird nun in px statt in % angegeben, um Verwirrung zu vermeiden und eine Verwendung an anderen Stellen zu ermöglichen.
.topic-post:not(.d-toc-post) .topic-body {
width: calc(#{$topic-body-width} + (#{$topic-body-width-padding} * 2) + #{$additional_post_width});
}
Die ersten beiden Teile der Summe stammen aus dem Standard-Discourse-SCSS.
Es gibt einige kleine UI-Verbesserungen, wie zum Beispiel die Vergrößerung der Trennlinien und der Beiträge mit Moderatoraktionen. Zudem wurde die Funktion für DiscoTOC-Beiträge deaktiviert, da sie dort seltsam reagiert.
Außerdem habe ich eine Option hinzugefügt, um die maximale Breite des Editors zu erhöhen, damit die Vorschau besser mit der Breite des Beitrags übereinstimmt. Nicht exakt dieselbe Breite, aber das Standardverhalten hat das gleiche Problem.
Sehr schön, @Alex_P. Wenn du es mit dem Material Design Theme zum Laufen bringen könntest, wäre das großartig. Das Problem dabei ist, dass der Avatar links neben dem Beitrag von der Seite nach oben über den Beitrag selbst springt.