Neuer Themenkopf-Button

I guess best behaviour would be to start the composer with empty category if the user does not have the permission to create new topic in the current one? Potentially with a modal and a notice about such.

Ich wollte diese Funktionalität auch haben, also habe ich das Repository geforkt und den „Neues Thema“-Button sowohl für anonyme als auch für angemeldete Benutzer angezeigt. Wenn ein anonymer Benutzer auf den Button klickt, wird er zum Anmelde-/Registrierungsmodal weitergeleitet.

Repository: GitHub - Peterlollo/discourse-new-topic-button-for-all-users-theme-component: Adds new topic button to header and shows it to every user regardless of logged in status

2 „Gefällt mir“

Es gibt einige veraltete Klassennamen, sodass die Stile nicht wie beabsichtigt angezeigt werden. Habe einen PR hinzugefügt, um sie zu aktualisieren: FIX: update declarations by nolosb · Pull Request #6 · discourse/discourse-new-topic-button-theme-component · GitHub

4 „Gefällt mir“

Ist es möglich, dieses Plugin auf die neue Version zu aktualisieren?

1 „Gefällt mir“

Ich habe gerade einen Refactor dieser Komponente zusammengeführt, damit sie mit diesen Updates funktioniert: Upcoming Header Changes - Preparing Themes and Plugins

Die Komponente sollte wie zuvor funktionieren, mit einigen kleinen Verbesserungen (sie spiegelt den Entwurfsstatus wider und reagiert auf die Berechtigungen der aktuellen Kategorie und Tags). Wenn Sie neue Probleme bemerken, lassen Sie es uns bitte wissen.

5 „Gefällt mir“

Ich habe gerade eine neue Einstellung show_to_anon (standardmäßig deaktiviert) hinzugefügt, die dies tun wird.

3 „Gefällt mir“

Wie “machbar” wäre es, ein Dropdown-Menü ähnlich dem in nolo’s Dropdown Wizard Component hinzuzufügen?

Da wir den benutzerdefinierten Wizard verwenden, um neue Themen in bestimmten Kategorien zu erstellen, möchten wir diese im Grunde in Dropdown-Menüs verlinken. Darüber hinaus möchten wir dem Button auch einige Links nur für Mitarbeiter hinzufügen (wie z. B. “Neue Kategorie” und “Neue Gruppe”).

Hallo, ich konnte das „pencil“-Symbol von Fontawesome Free in dieser Komponente nicht verwenden, obwohl ich es zu den „SVG-Icon-Subset“-Einstellungen hinzugefügt habe. Irgendeine Idee?

1 „Gefällt mir“

Ich glaube nicht, dass es in Version 5 ein kostenloses pencil-Symbol gibt.

Ich denke, für Bleistift in v5 ist es dasselbe, es ist pencil-alt.

4 „Gefällt mir“

Danke! Es funktioniert!

2 „Gefällt mir“

Ein Beitrag wurde in ein neues Thema aufgeteilt: Kein neuer Thema-Button

Hallo,

Ist es möglich, das TC mit dem neuen Entwurfsupdate zu aktualisieren?

Danke

2 „Gefällt mir“

Anfrage: Fügen Sie eine Option hinzu, um die Farben der Schaltfläche (Hintergrund, Text + Symbol) für ein helles und ein dunkles Thema zu definieren. Da neue Themen Teil des Wachstums einer Community sind, hat eine farbige Schaltfläche mehr Wirkung.

Danke

Es ist ganz einfach mit CSS:\n\nNew Topic Header Button - #18 by dax(Sie können dunkle und helle Themen mit CSS ansprechen)\n\n—\nBearbeiten: Hinzufügen eines ordnungsgemäßen Beispiels\n\nscss\n#new-create-topic {\n background-color: light-dark(red,green);\n}\n\nSetzt die Farbe des Buttons auf Rot in einem hellen Thema und auf Grün in einem dunklen Thema.

2 „Gefällt mir“

Ich bin mit CSS in Discourse noch nicht vertraut. Ich bin mit CSS vertraut, habe aber noch nicht begonnen, es innerhalb von Discourse zu erkunden.
Wie/wo füge ich das hinzu?

Ich denke immer noch, dass dies eine Funktion sein könnte, um zusätzliche Komplexität zu vermeiden, und für Leute, die überhaupt nicht mit CSS vertraut sind, macht es die Komponente einfach anzupassen.

1 „Gefällt mir“

Entweder in Ihrem/Ihren Theme(s) oder einer neuen Theme-Komponente – die dann in Ihrem/Ihren Theme(s) enthalten sein muss:


Ich habe den CSS-Code in meinem obigen Beitrag hinzugefügt.

1 „Gefällt mir“

Ich habe auch :hover getestet und es funktioniert für den Button und den Text, aber nicht für das Icon, es sei denn, ich fahre mit der Maus über das Icon selbst. Weißt du, wie man das Icon beim Überfahren des Buttons anvisiert, auch wenn sich die Maus nicht über dem Icon befindet?

#new-create-topic:hover {
    background-color: light-dark(red,red);
    color: light-dark(red,white);
}

#new-create-topic .d-icon:hover {
    color: light-dark(red,white);
}
1 „Gefällt mir“

Ihre zweite Regel bedeutet, dass Sie das Symbol anvisieren, wenn Sie mit der Maus über das Symbol fahren, nicht über die Schaltfläche.

Unter Verwendung der SCSS-Syntax, die

#new-create-topic:hover {
    background-color: light-dark(red,red);
    color: light-dark(red,white);
}
#new-create-topic:hover .d-icon {
    color: light-dark(red,white);
}

(es gibt auch keinen Bedarf für light-dark(red,red);, wenn Sie die gleiche Farbe für hell und dunkel verwenden)

Ich würde SCSS empfehlen, da es einfacher ist, unseren raffinierten Code aufzuräumen, aber das ist etwas Neues zu lernen 😄
#new-create-topic:hover {
    background-color: light-dark(red,red);
    .d-icon, & {
        color: light-dark(red,white);
    }
}
1 „Gefällt mir“

Du hast Recht. Mein Fehler… Danke!

Das sind nur Tests. Ich benutze eigentlich das Standardthema und ich weiß nicht, ob dieses Thema beide Optionen hat?

Was SCSS angeht, habe ich es vor ein paar Jahren gelernt, aber es war etwas, das ich nie wirklich benutzt habe, da ich kein Entwickler bin. Ich benutze HTML und CSS ziemlich oft, daher bin ich mit diesen beiden etwas vertrauter.

1 „Gefällt mir“

Ich habe diesen Code gefunden, um diese Änderung vorzunehmen, aber ich bin mir nicht sicher, ob dies der beste Weg ist:

<script type="text/discourse-plugin" version="0.8">
  api.onPageChange(() => {
    const newTopicButton = document.querySelector('.header-create-topic');
    const draftsButton = document.querySelector('.topic-drafts-menu-trigger');

    if (newTopicButton && draftsButton && !document.querySelector('.fk-header-buttons')) {
      const wrapper = document.createElement('div');
      wrapper.className = 'fk-header-buttons';

      const parent = newTopicButton.parentNode;
      parent.insertBefore(wrapper, newTopicButton);

      wrapper.appendChild(newTopicButton);
      wrapper.appendChild(draftsButton);
    }
  });
</script>