MD Composer Extras

Themenkomponente
41

Ich habe wie vorgeschlagen einige meiner unerwünschten Elemente unterdrückt:

// Versteckt unnötige Buttons aus dem MD Composer Extras TC
.d-editor-button-bar {
    .superscript_button,.subscript_button, .align_center_button,.align_right_button, .align_justify_button {
        display: none;
    }
}

Es wäre jedoch wirklich schön, wenn man in den TC-Einstellungen dafür auswählen könnte, welche Buttons enthalten sein sollen. Ich frage mich, ob dies einfach dadurch erreicht werden könnte, dass, wenn für einen Button kein Text in der Einstellung vorhanden ist, dieser nicht erstellt wird.

Ich habe versucht, dies zu tun, aber es überstieg meine bescheidenen Fähigkeiten; ich konnte es einfach nicht schaffen, jeden Teil von der jeweiligen Einstellung abhängig zu machen.

1 „Gefällt mir“
42

Hallo Steven,

Sehr schönes Component, aber ich habe einen kleinen Fehler gefunden. Hochgestellt hat einen kleinen Fehler. Siehe unten.

Screenshots_2023-01-16-06-18-41
Screenshots_2023-01-16-06-18-41806×703 30.8 KB

Schließen mit /sub statt /sup

2 „Gefällt mir“
43

Nur ein Gedanke, Sie könnten wahrscheinlich eine All-in-One-Lösung haben, die Einstellungen-Schalter in der erweiterten Version verwendet.

d.h. ein Schalter, wenn das bbcode-Plugin verwendet wird, und beide könnten Optionen haben, Schaltflächen auszublenden oder Schaltflächen zur Leiste hinzuzufügen. Mit demselben, wenn Administratoren Optionen im :gear:-Dropdown ausschließen möchten.

Ich bin immer noch ziemlich grün im Erlernen von CSS. Eine ergänzende Komponente könnte jedoch wahrscheinlich für zusätzlichen Glanz hergestellt werden, um das Dropdown mit einem kaskadierenden Dropdown zu organisieren.

d.h. Haupt-Dropdown-Zahnrad mit Farbauswahl.

:gear: .
Umfrage einfügen
Tabelle einfügen
TextFARBE. > Rot
Grün
Blau
Orange

Man könnte andere Formatierungsoptionen im Dropdown und/oder in der Symbolleiste gruppieren, um ein Menü zur Auswahl einer Formatierungsoption zu haben.

1 „Gefällt mir“
44

Danke, ich habe eine Korrektur für dieses Problem vorgenommen.

2 „Gefällt mir“
45

Gern geschehen und vielen Dank für die schnelle Antwort und die schnelle Lösung! :vulcan_salute::smiling_face_with_sunglasses::handshake:

46

Ich würde empfehlen, Ihren Op Post zu aktualisieren, um die Verwendung der optionalen Branch-Installation aufzunehmen. Ich habe Ihre Alternativen für die Zweige „color“ und „simple“ gefunden.

In meinem Farbzweig habe ich eine kleine Änderung am bbcode_color vorgenommen

in „Desktop\Head“ - Zeile 65 und „€Mobile\Head*“ - Zeile 96

„[color=##233]“ zu „[color=name]“ , da ich eine Anleitung für meine WiP-Website zum Ändern von Namen in Farbnamen erstellen werde.

Der Hex-Wert ist nicht der, den Sie hatten. Ich habe ihn nur als Referenz angegeben, um zu zeigen, was es war.

Ich bin noch neu in der Materie und muss irgendwann einen GitHub-Account erstellen und lernen, wie man Pull-Anfragen stellt.

47

Vielen Dank für diese unkomplizierte und funktionsreiche Komponente! Sehr geschätzt.

Und ein kleiner Vorschlag: Wäre es möglich, die Markdown-Konvention ~~dies~~ für durchgestrichenen Text anstelle der umständlicheren Konvention <s></s> zu verwenden?

1 „Gefällt mir“
48

Melde mich hier mal kurz :slight_smile:

Es wäre toll, eine native Option zu haben, die MD Composer Extras nur für bestimmte Gruppen anzuzeigen. In unserem Fall möchten wir die zusätzlichen Buttons vorerst nur für unsere Mitarbeiter testen.

Vorerst habe ich sie versteckt, indem ich body:not(.staff) zu Nathans Code hinzugefügt habe:

// Versteckt unnötige Buttons aus dem MD Composer Extras TC für Nicht-Mitarbeiter
body:not(.staff) .d-editor-button-bar {
    .superscript_button,.subscript_button, .align_center_button,.align_right_button, .align_justify_button {
        display: none;
    }
}

Die nächste Stufe wäre eine Berechtigungseinstellung für jeden einzelnen Button. :drooling_face:

2 „Gefällt mir“
49

@jrgong Sie können dies tun, indem Sie diese Komponente und etwas CSS hinzufügen

Sie können sich meine Gruppen-Navigationsmenü-Abschnitte TC für CSS-Beispiele ansehen - Link auf meiner Benutzerkarte.

5 „Gefällt mir“
50

Wie ist das noch nicht im Kern? :smiley: Danke fürs Teilen, ich weiß es wirklich zu schätzen.

3 „Gefällt mir“
51

Ist dies immer noch der Fall, dass das Plugin Vorteile gegenüber dieser Theme-Komponente hat?

52

Ich finde das Plugin immer noch besser, aber wenn die hier vorgestellten Optionen für Sie passen, ist das in Ordnung.

2 „Gefällt mir“
53

Vielen Dank für die schnelle Antwort. Können Sie bitte erklären, warum?

54

Nur meine persönliche Meinung, ich denke, wir haben zu viele Schaltflächen in die Komponente aufgenommen.
Das Plugin konzentriert sich mehr auf grundlegende Funktionen, das bbcode-System ist auch einfacher ([center] anstelle von [wrap="center"]), aber die Komponente ist eindeutig einfacher zu installieren.

4 „Gefällt mir“
55

Falls Sie es noch nicht gesehen haben:

image

3 „Gefällt mir“
56

Ich habe einen PR erstellt :+1:

https://github.com/MonDiscourse/md-composer-extras/pull/12

2 „Gefällt mir“
57

Wäre es möglich, allen Buttons eine CSS-Klasse namens md-composer-extras hinzuzufügen? Mein Ziel ist es, sie für Nicht-Mitarbeiter-Benutzer auf einmal auszublenden, und das würde die CSS-Ausrichtung erheblich vereinfachen.

58

Ich bin mir nicht sicher, ob das möglich ist. Mit dem Beispielcode aus der Plugin-API-Datei sehe ich keine Möglichkeit, eine Art Stammklasse für all diese Symbole hinzuzufügen. Ich könnte mich aber auch irren.

api.onToolbarCreate(toolbar => {
  toolbar.addButton({
  id: 'pop-text',
  group: 'extras',
  icon: 'bolt',
  action: 'makeItPop',
  title: 'pop_format.title'
  });
 });
60

Ein staff-Klasse wird auf das <body>-Element angewendet.

Sie können also beliebige Schaltflächen anvisieren, wie zum Beispiel:

body:not(.staff) .d-editor-button-bar {
    /* Versteckt alles 
     * (sichtbare Schaltflächen, einschließlich der Schaltfläche für das Popup-Menü) 
     */
    button, 
    .toolbar-popup-menu-options {
        display: none; 
    }
}

body:not(.staff) .d-editor-button-bar {
    /* Spezifische Schaltflächen ausblenden */
    button {    
        /* Inline-Schaltflächen */
        &.align_justify_button, 
        &.align_right_button 
        /* ... */
        {
            display: none;
        }
        
        /* Popup-Menü */
        &.toolbar-popup-menu-options {
            [data-name="Float left"],
            /* ... */ {
                display: none;
            }
        }
    }
}

Würde das helfen?

Nebenbei bemerkt, könnten Sie an dieser Komponente interessiert sein:

61

Hallo Arkshine! Das hilft auf jeden Fall! Doch meiner bescheidenen Meinung nach wäre es ein effizienterer Ansatz, jedem der Buttons eine CSS-Klasse md-composer-extras hinzuzufügen. Auf diese Weise ist das CSS-Markup zum Ausblenden aller Elemente super einfach :slight_smile:

Danke! Wir nutzen das tatsächlich schon :wink: