Alternative Icons

Dokumentation Entwicklerhandbücher
,
1

Standardmäßig bündelt Discourse Icons aus der hervorragenden FontAwesome-Bibliothek. Es gibt jedoch viele frei nutzbare Icon-Bibliotheken. Dieses Thema ist der zentrale Ort für alternative Icon-Sets. Hier werden einige Theme-Komponenten aufgelistet, die du sofort ausprobieren kannst, aber es wird auch beschrieben, wie du dazu beitragen kannst, dass Discourse andere Icon-Sets unterstützt.

Alternative Icon-Sets

Wenn du Interesse daran hast, ein anderes Icon-Set auszuprobieren, findest du hier eine Liste von Theme-Komponenten, die du testen kannst:

(Weitere Informationen zur Installation eines Themas oder einer Theme-Komponente findest du unter So installierst du ein Thema oder eine Theme-Komponente, um eines dieser Repositories auf deiner Discourse-Website einzurichten.)

Diese Komponenten sind noch in Arbeit. Du kannst sie verwenden, beachte jedoch, dass nicht für jedes einzelne Icon aus dem Kernbereich eine geeignete Alternative vorhanden ist. (Beiträge sind jedoch willkommen, siehe unten.)

Einige Screenshots:

image
image1824×1158 41.6 KB

Feather Icons (mit dem WCAG Dark-Farbschema)

image
image1926×1282 41.8 KB

Heroicons (mit dem WCAG Light-Farbschema)

image
image1732×1256 42 KB

Unicons (mit dem Grey Amber-Farbschema)

image
image1726×1256 43.1 KB

Phosphor Duotone (mit dem WCAG Light-Farbschema)

Mitwirken

Theme-Entwickler und Designer, dieser Abschnitt richtet sich an euch.

Die oben aufgeführten Komponenten werden mit dem discourse-alt-icons-Utility-Repository generiert, das den Austausch von Icons in der Discourse-Kernversion durch Icons aus anderen Open-Source-Icon-Sets vereinfacht. Der Kern des Repositories ist ein Build-Skript, das eine Theme-Komponente aus einer JSON-Datei mit Icon-Namenszuordnungen generiert.

Beiträge sind willkommen und erwünscht. Discourse verwendet viele Icons aus FontAwesome, und das Finden von Entsprechungen aus anderen Icon-Sets ist eine unterhaltsame, aber zeitaufwändige Aufgabe. Wenn du helfen möchtest, kannst du das discourse-alt-icons-Repository ziehen und die Schritte in der Readme-Datei befolgen, um Zuordnungen für Icons hinzuzufügen, für die es diese noch nicht gibt.

Unterstützung anderer Icon-Sets

Bitte schlage in den Antworten unten vor, Unterstützung für ein anderes Icon-Set hinzuzufügen. Oder noch besser: Mit ein wenig Arbeit kannst du einen Pull Request an das discourse-alt-icons-Repository senden. Beachte, dass nur Icon-Sets mit sehr permissiven Lizenzen (d. h. sie müssen Modifikation, Verbreitung und private Nutzung erlauben) berücksichtigt werden.

Dieses Dokument wird versioniert – Vorschläge für Änderungen auf GitHub.

30 „Gefällt mir“
Harmonizing Discourse icons and emojis
2

Wenn jemand ein Icon-Set beisteuern möchte, aber noch keines im Kopf hat:

Lizenziert unter MIT, entworfen von den Leuten bei tailwindlabs.com

4 „Gefällt mir“
3

Hoffe, das hilft. Hier sind einige Icons, die du verwenden kannst:

https://www.flaticon.com/

4

Toller Vorschlag! Ich habe das hinzugefügt und den Eröffnungspost mit einem Screenshot aktualisiert. Es enthält nicht viele Icons – zum Beispiel fehlen Icons für die Symbolleiste des Editors –, aber die vorhandenen sind sehr schön. Danke!

2 „Gefällt mir“
5

Bedeutet das, dass Google Fonts nicht infrage kommt?

6

Die Lizenz von Googles Material Icons ist hinreichend permissiv. Doch ihr Repository ist riesig, und es könnte zeitaufwendig sein, den Pfad zu jedem einzelnen Icon zu finden.

1 „Gefällt mir“
7

Ja, aber wenn es einmal erledigt ist, musst du es nicht noch einmal tun. :slight_smile:

1 „Gefällt mir“
8

Könnten wir zufällig auch die Phosphor Regular Icons bekommen?

2 „Gefällt mir“
9

Mit ein wenig Arbeit können Sie (oder eigentlich jeder) ein Phosphorus Regular-Repository aus dem Duotone-Repository erstellen. Ich bin gerne bereit, es zu überprüfen und in die Liste hier aufzunehmen, wenn wir ein Repository haben.

2 „Gefällt mir“
10

Das wäre fantastisch. Wir sollten standardmäßig eine Liste von Icon Sets in /admin haben, da FontAwesome irgendwie hässlich ist. :ok_man:

11

Hässlichkeit ist Geschmackssache. Aber heutzutage ist das Angebot an kostenlosen Icons von Font Awesome wirklich begrenzt.

Andererseits – wie viele wirklich gut aussehende Icons gibt es :joy:

13

Es scheint, dass beim Laden eines dieser Sätze die fehlenden Symbole nicht durch die standardmäßigen Font Awesome-Symbole ersetzt werden, sodass sie einfach leer und nicht sehr brauchbar sind… :thinking:

Ich mag das Feather-Set, aber es fehlen viele nützliche Symbole.

Ich habe einen PR im Repo erstellt. Einige Änderungen sind alles andere als perfekt, aber ein schlechtes Symbol ist immer noch besser als gar kein Symbol :smiling_face_with_tear:

Hier sind alle neu hinzugefügten Symbole (schlecht nach Stimmung codierte Seite, veraltete „Alternativen“-Spalte)

Haupt- und nicht so gute Änderungen:

image
Die Kreditkarte ist der Adresskarte in Bezug auf die Formen am ähnlichsten. Andere Alternativen könnten ein geschlossenes oder offenes Buch sein…

image
Das Beste ist das Fadenkreuz, denke ich. Ein einfacher Stift hat eine ziemlich ähnliche Form, aber es ist ein Stift und wird bereits für Bearbeitungen verwendet.

image
Nichts Ähnliches. Meiner Meinung nach passt das CPU-Symbol am besten. Ich habe es in meinem PR vermasselt und das Zap-Symbol verwendet, also werde ich einen weiteren PR senden, um dies zu beheben.

2 „Gefällt mir“
14

Mir sind gerade Lucide-Icons aufgefallen:

Dies ist ein Fork von Feather, der aktuell ist. Feather hat nur 287 Icons, Lucide hat 1701 (und sie haben natürlich die meisten, wenn nicht alle fehlenden Icons).

Beide Sets stehen unter der MIT-Lizenz.

Ich denke also, in diesem Fall sollte die Unterstützung für Feather fallen gelassen und durch Lucide ersetzt werden.

Mein Pull Request scheint jetzt etwas bedeutungslos zu sein :lolsob:

Vielleicht kann ich versuchen, ein Repository für dieses Set zu erstellen, falls das Team zustimmt…

3 „Gefällt mir“
15

Irrelevant, aber wenn man zu https://canapin.dev geht, ganz nach unten scrollt und auf das Forum von Virtualmin klickt, war es Discourse :discourse: !

1 „Gefällt mir“
16

Ich habe fast das gesamte Set an Lucide-Icons für Discourse erstellt, aber wo finde ich die vollständige Liste der von Discourse Core verwendeten Icons, damit ich keines übersehe?

Diese Vorlage discourse-alt-icons/mappings/template.json at main · discourse/discourse-alt-icons · GitHub lässt einige aus. Ein einzelnes Beispiel, die Palette

17

könnte Ihnen helfen.

Plugins und Komponenten können zusätzliche Symbole hinzufügen. Ich bin mir nicht sicher, wie man dort beliebte findet. Es könnte sinnvoll sein, sich die Plugins anzusehen, die als #included-in-core gekennzeichnet sind. Eine Suche wie Repository search results · GitHub könnte also funktionieren.

1 „Gefällt mir“
18

Hier ist das Repository:

Fühlen Sie sich frei, es offiziell zu machen.

Font-Awesome

image
image2560×1271 258 KB

Lucide

image
image2560×1271 265 KB

3 „Gefällt mir“
19

Ist es möglich, andere Symbole in den Einstellungen hinzuzufügen? Es sieht so aus, als ob Zeitung, Mikrofon und Gamepad fehlen

20

Sicher. Ich muss auch das Schriftgrößen-Symbol aus dem Composer korrigieren.

Bearbeitung: Ich habe das vielleicht falsch verstanden, und ich bin mir nicht sicher, ob wir Discourse-Symbole aus einem der neuen Sätze außerhalb der Komponente ersetzen können :thinking:

1 „Gefällt mir“
21

Du,

Für eine vollständige Liste der in Discourse enthaltenen Symbole rufen Sie /styleguide in Ihrer Discourse-Instanz auf.

Von GitHub - discourse/discourse-alt-icons · GitHub

Ich denke, das ist es, was KI mit mir macht, ich lese nicht einmal mehr die Dokumentation :person_facepalming:

Ich finde sie weder unter /styleguide noch unter discourse/lib/svg_sprite.rb at main · discourse/discourse · GitHub. Wo werden sie in Discourse verwendet?

3 „Gefällt mir“