Json_Blob
20. November 2018 um 02:14
1
Hello
I run a discourse forum for my cycling team. And I find that pinned topics don’t really stand out much. I naturally find myself looking for some seperation or divider, bold titles on the threads, highlighting… something.
Currently aside from the little pin icon, they look exactly like standard topics which I find a little lack-luster.
Note the top two topics are pinned, but they’re listed just like everything else. I’d love to see simply a good, heavy divider between pinned topics and everything else but I’m open to other ideas. I just feel like right now they blend in to the mix and don’t call attention to themselves at all once they’re “read”.
Thoughts?
2 „Gefällt mir“
You can certainly apply whatever CSS you like to make that so via admin, customize.
3 „Gefällt mir“
Json_Blob
20. November 2018 um 06:20
3
Ah ok, i’ll have to do some homework then on CSS because it’s not my strength.
Thanks for the direction
dax
20. November 2018 um 10:27
4
To highlight pinned topics on the latest page just add in your /admin/customize/themes:
.topic-list-item.pinned {
background: #ffffc9;
}
You can of course customize with CSS the pinned topics as you prefer once you know the class to use
12 „Gefällt mir“
loginerror
17. April 2019 um 12:41
5
What would be the way to achieve the same for the pinned topics visible in the Category view (set to Category and Latest)?
dax
17. April 2019 um 14:15
6
There is no status class (.pinned) in this case. To target a pinned topic you need to use the id, eg
[data-topic-id="8"] {
background: #ffffc9;
}
The CSS above target the topic globally everywhere, on /latest, on /categories and on topic, see:
To target only the categories + latest page you need to add the appropriate class
.navigation-categories.categories-list [data-topic-id="8"] {
background: #ffffc9;
}
In this way the topic will be highlighted only on that page.
PS: to find the topic ID the simplest way is to open the dev console on your browser with F12:
6 „Gefällt mir“
loginerror
17. April 2019 um 14:26
7
Thanks @dax , it’s a nice solution, although we do have a rather quick rotation of pinned topics which makes it a bit less convenient.
dax:
Um nur die Kategorien und die letzte Seite auszuwählen, musst du die entsprechende Klasse hinzufügen:
.navigation-categories.categories-list [data-topic-id="8"] {
background: #ffffc9;
}
Hallo, ich habe das ausprobiert, aber etwas scheint falsch zu sein. Das ist das Ergebnis, das ich erhalte…
Hast du eine Idee, warum der Thread-Titel verdeckt wird?
Das liegt daran, dass wir Titeln viel Abstand hinzufügen, um eine große Klickfläche zu schaffen. Du kannst dies etwas anpassen, um die Überlappung mit
.topic-list .main-link a.title {
padding: 6px 0;
}
zu vermeiden.
6 „Gefällt mir“
Hallo Kris. Ich habe versucht, diesen Code hinzuzufügen, aber es scheint nichts verändert zu haben…
Vielleicht habe ich etwas übersehen? Ich habe auch die Zahlen geändert, aber das schien ebenfalls keine Wirkung zu haben.
dax
9. August 2019 um 09:31
11
Ein Link zu Ihrer Seite und zu diesem spezifischen Thema wäre hilfreich.
1 „Gefällt mir“
Hier ist der betreffende Thread…
Exchange Expansion Many of you in the community have been asking for a while now what we have been doing to get Peercoin listed on more exchanges. Lack of access to more exchanges with high trading volume has been one of Peercoin’s biggest problem...
Reading time: 3 mins 🕑
Likes: 24 ❤
dax
12. August 2019 um 10:40
13
Versuchen Sie es mit:
.latest-topic-list-item .main-link a.title {
padding: 6px 0;
}
4 „Gefällt mir“
@dax Das scheint funktioniert zu haben, zumindest auf dem Desktop in der Kategorienansicht. In der Kategorienansicht auf dem Mobilgerät passiert es jedoch weiterhin…
Gibt es außerdem eine Möglichkeit, dies auch in der Ansicht „Neueste“ zum Laufen zu bringen? Bisher funktioniert es nur in der Kategorienansicht.
dax
19. August 2019 um 16:59
15
Versuchen Sie es mit
.mobile-view .topic-list .main-link a.title {
padding: 3px 0;
}
Haben Sie dies hier gelesen?
There is no status class (.pinned) in this case. To target a pinned topic you need to use the id, eg
[data-topic-id="8"] {
background: #ffffc9;
}
The CSS above target the topic globally everywhere, on /latest, on /categories and on topic, see:
[image]
[image]
[image]
To target only the categories + latest page you need to add the appropriate class
.navigation-categories.categories-list [data-topic-id="8"] {
background: #ffffc9;
}
In this way the topic will be highlighted only on…
Sie müssen auch folgendes hinzufügen:
[data-topic-id="9582"] {
background: #fffff0;
}
1 „Gefällt mir“
Ja, aber es hat mir nicht besonders gefallen, dass der gesamte Thread inklusive aller Beiträge hervorgehoben wurde. Ich wollte eigentlich nur den Titel des Themas unter der Kategorie und der letzten Ansicht hervorheben, nicht aber den Thread selbst. Wenn es keine andere Möglichkeit gibt, werde ich das so machen.
Übrigens scheint der mobile Code das Problem dort behoben zu haben.
