Extras do MD Composer

Fiz como você sugeriu e suprimi os desnecessários desta forma:

// Esconde botões desnecessários do TC de Extras do MD Composer 
.d-editor-button-bar {
    .superscript_button,.subscript_button, .align_center_button,.align_right_button, .align_justify_button {
        display: none;
    }
}

No entanto, seria muito bom poder escolher quais botões incluir nas configurações do TC para isso. Eu me pergunto se isso poderia ser feito simplesmente fazendo com que, se não houver texto na configuração de um botão, ele não seja criado.

Eu tentei fazer isso, mas estava além das minhas humildes habilidades; eu simplesmente não consegui tornar cada parte condicional à configuração relevante.

1 curtida

Olá Steven# Componente muito bom, mas encontrei um pequeno bug. Sobrescrito tem um pequeno erro. Veja abaixo.

Fechando com /sub em vez de /sup

2 curtidas

Apenas uma ideia, você provavelmente poderia ter um “tudo em um” que usa alternâncias de configurações na versão avançada.

ou seja, uma alternância se usar o plugin bbcode e ambos poderiam ter opções para ocultar botões ou adicionar botões à barra. Com o mesmo se os administradores quiserem excluir opções no dropdown :gear:.

Ainda sou bem iniciante aprendendo CSS. No entanto, um componente complementar poderia provavelmente ser feito para um brilho extra para organizar o dropdown com dropdown em cascata..

ou seja, dropdown principal de engrenagem com seletor de opção de cor.

:gear: .
Inserir Enquete
Inserir Tabela
COR do Texto. \u003e Vermelho
Verde
Azul
Laranja

Poder-se-ia agrupar outras opções de formatação no dropdown e/ou na barra de ferramentas para ter um menu para escolher uma opção de formatação.

1 curtida

Obrigado, corrigi esse problema.

2 curtidas

De nada e muito obrigado pela resposta rápida e pela correção! :vulcan_salute::smiling_face_with_sunglasses::handshake:

Eu recomendaria atualizar seu Op Post para incluir como usar a instalação opcional do branch. Encontrei suas alternativas de branch “color” e “simple”.

No meu branch color, fiz uma pequena alteração no bbcode_color

em “Desktop\Head” - linha 65 e “Mobile\Head” - linha 96

de “[color=##233]” para “[color=name]” Pois farei um guia para meu site WiP sobre como mudar o nome para nome da cor.

O valor hexadecimal não é o que você tinha. Apenas coloquei isso como referência ao que era.

Ainda sou iniciante em algumas coisas e precisarei criar um github e aprender como fazer pull requests algum dia.

Muito obrigado por este componente descomplicado e repleto de recursos! Muito apreciado.

E uma pequena sugestão, seria possível usar a convenção Markdown de ~~isso~~ para riscar em vez da convenção mais verbosa de <s></s>?

1 curtida

Comentando sobre isso :slight_smile:

Seria ótimo ter uma opção nativa para exibir os extras do compositor MD apenas para grupos específicos. No nosso caso, gostaríamos de testar os botões extras apenas para nossa equipe neste momento.

Por enquanto, eu o ocultei adicionando body:not(.staff) ao código do Nathan:

// Oculta botões desnecessários do TC de Extras do Compositor MD de usuários não-staff
body:not(.staff) .d-editor-button-bar {
    .superscript_button,.subscript_button, .align_center_button,.align_right_button, .align_justify_button {
        display: none;
    }
}

O próximo nível seria uma configuração de permissão para cada botão individual. :drooling_face:

2 curtidas

@jrgong você pode fazer isso adicionando este componente e algum CSS

pode conferir minhas seções de menu de navegação de grupo TC para exemplo de CSS - link no meu cartão de usuário.

5 curtidas

Como isso ainda não está no core? :smiley: Obrigado por compartilhar, eu realmente aprecio.

3 curtidas

Ainda é o caso de que o Plugin tem vantagens sobre este Componente de Tema?

Ainda acho que o plugin é melhor, mas se as opções apresentadas aqui te agradam, tudo bem.

2 curtidas

Obrigado pela resposta rápida. Você pode explicar o porquê?

Apenas uma opinião pessoal, acho que adicionamos muitos botões ao componente.

O plugin é mais focado em funções básicas, o sistema bbcode também é mais fácil ([center] em vez de [wrap="center"]), mas o componente é claramente mais fácil de instalar.

4 curtidas

Caso ainda não tenha visto:

image

3 curtidas

Eu fiz um PR :+1:

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

2 curtidas

Seria possível adicionar uma classe CSS md-composer-extras a todos os botões? Meu objetivo é ocultá-los todos de uma vez para usuários não-staff e isso tornaria o direcionamento CSS muito mais simples.

Não tenho certeza se isso é possível, com o código de exemplo do arquivo da API do plugin, não vejo uma maneira de adicionar uma espécie de classe raiz para todos esses ícones. Posso estar enganado, no entanto

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

Uma classe staff é aplicada ao elemento <body>.

Assim, você pode segmentar quaisquer botões como:

body:not(.staff) .d-editor-button-bar {
    /* Esconde tudo
     * (botões visíveis, incluindo o botão do menu suspenso)
     */
    button,
    .toolbar-popup-menu-options {
        display: none;
    }
}
body:not(.staff) .d-editor-button-bar {
    /* Esconde botões específicos */
    button {
        /* Botões inline */
        &.align_justify_button,
        &.align_right_button
        /* ... */
        {
            display: none;
        }

        /* Menu suspenso */
        &.toolbar-popup-menu-options {
            [data-name="Float left"],
            /* ... */ {
                display: none;
            }
        }
    }
}

Isso ajudaria?

Observação: você pode se interessar por este componente:

Olá Arkshine! Isso definitivamente ajuda! No entanto, IMHO seria uma abordagem mais eficiente adicionar uma classe CSS md-composer-extras a cada um dos botões. Dessa forma, a marcação CSS para ocultar todos os elementos é super simples :slight_smile:

Obrigado! Na verdade, já estamos usando isso :wink: