É possível mover a opção Criar Pesquisa (no desktop) do menu extra e colocá-la ao lado dos demais botões de formatação?
Assim como sua solicitação no mobile, isso requer uma edição um pouco mais complexa, que não posso adicionar neste componente de tema. Mas deve ser viável em um componente personalizado para desktop, seguindo a lógica apresentada por angus e spirobel.
3 curtidas
Como remover o botão central e alinhar os botões à esquerda e à direita?
Adoro esse componente, aliás.
Olá!
Você pode adicionar essas linhas de CSS no seu tema ou em um componente:
.align_center_button, .align_right_button, .align_justify_button {
display: none;
}
Acho que você quis dizer o botão de justificar, já que o alinhamento à esquerda não foi adicionado no mesmo componente.
1 curtida
É possível mover todos esses novos botões para dentro do botão/menu Opções?
É possível, mas você precisará explorar um pouco o código.
Em Desktop > Head, você encontrará todo o JavaScript; será necessário alterar algumas linhas.
Por exemplo, o código para um botão na barra de ferramentas se parece com isto:
api.onToolbarCreate(toolbar => {
toolbar.addButton({
id: "underline_button",
group: "fontStyles",
icon: "underline",
perform: e => e.applySurround('[u]', '[/u]', 'underline_text')
});
});
Você precisa alterar usando este:
api.addToolbarPopupMenuOptionsCallback(() => {
return {
action: "underline",
icon: "underline",
label: "underline_button"
};
});
E adicione a ação nesta parte:
api.modifyClass("controller:composer", {
actions: {
underline() {
this.get("toolbarEvent").applySurround('[u]', '[/u]', "underline_text");
},
floatleft() {
this.get("toolbarEvent").applySurround('[wrap="floatl"]\n', '\n[/wrap]', "float_left_text");
},
columns() {
this.get("toolbarEvent").applySurround('[wrap="columns"]\n', '\n[/wrap]', "columns_text");
}
}
});
A tradução deve estar correta.
Você verá rapidamente se algo estiver errado, pois o Discourse exibe mensagens de erro ao salvar as alterações.
5 curtidas
Ótimo componente, @Steven!
Seria incrível se pudéssemos ter também H1, H2 e H3.
2 curtidas
É possível adicionar o [color] [/color] a este componente do tema? Se for possível, ficaria perfeito, pois assim seria possível usar o editor bbcode+md oficial do Discourse. Atualmente estou usando a barra de ferramentas de formatação + mdcomposer. Claro, posso usar CSS para ocultar os botões extras, mas há lugares onde o CSS não é aplicado, como no painel administrativo ou no plugin Custom Wizard do pavilion. O botão de cor é muito utilizado.
Isso é o que tenho com CSS: (o que é perfeito)
Isso é o que tenho sem:
1 curtida
Meu plano é ter um componente para quem não quer usar um plugin. Mas vou criar uma branch com color bbcode. Vou testar em algumas horas, se tiver tempo. Avisarei quando estiver pronto e como instalar.
Provavelmente usarei esse tempo para reorganizar o componente do tema. Prefiro um tc simples por padrão; vou usar uma branch com todas as opções, com botões de subscrito, e uma branch bbcode para quem tem o plugin bbcode oficial.
2 curtidas
Obrigado, os botões de subscrito/superscrito são uma das razões para continuar usando o editor Markdown, algo que outros plugins e componentes de tema não possuem. O BBCode oficial inclui muitas funcionalidades que não estão na barra de ferramentas de formatação, como o [spoiler] [/spoiler]. Para ter o melhor dos dois mundos, acho que é melhor manter o BBCode do Discourse e depois adicionar os botões que precisamos por meio do mdcomposer.
Eu não achava que os botões de script fossem populares, então vou mantê-los no componente base.
Vou criar alguns ramos: um simples, com apenas alguns botões de formatação básicos, e um ramo de cores que adiciona um bbcode de cor.
2 curtidas
E aí, pessoal,
Só queria avisar que uma nova branch color foi adicionada ao md composer. Agora vocês podem usar o plugin oficial bbcode do Discourse + md composer (branch color) + discourse spoiler-alert (esconder spoilers). Acredito que essa seja a melhor combinação disponível para os botões do composer no Discourse.
Também temos a ideia de adicionar um seletor de cores usando esta biblioteca gratuita:
Se alguém quiser ajudar e souber como adicionar um seletor de cores, fique à vontade para ajudar o Steven!
2 curtidas
Como eu poderia ocultar ou remover completamente alguns desses botões? Precisamos apenas de alguns deles e notei que remover um botão não remove o item que ainda está listado (ainda haverá um espaço em branco sem ícone visível).
A melhor maneira é adicionar algumas linhas de CSS ao seu tema atual.
Forneço esses exemplos para os botões de alinhamento, caso queira removê-los:
.align_center_button, .align_right_button, .align_justify_button {
display: none;
}
Também posso fornecer o código CSS para os botões específicos que deseja ocultar.
5 curtidas
Olá Steven, ótimo componente. Obrigado por compartilhar!
Uma pergunta rápida: seria possível implementar alguns botões para adicionar espaços não separáveis (por exemplo, nbsp ; ensp ; emsp? O que devo usar em vez de applySurround?
Alguns membros da minha comunidade têm dificuldade em formatar as postagens (principalmente a indentação) e acredito que isso seria útil para eles.
Obrigado!
Sim, você pode facilmente adicionar um botão e, em vez de applySurround, eu uso addText
Eu tenho este exemplo antigo que você pode usar
api.onToolbarCreate(toolbar => {
toolbar.addButton({
id: "br_button",
group: "extras",
icon: "level-down-alt",
perform: e => e.addText('<br>', 'br_text')
});
});
3 curtidas
Obrigado! Isso vai resolver!
Hmm… Você não parece ter riscado na Barra de Ferramentas de Formatação do Discourse, mas tem aqui. Eu prefiro a Barra de Ferramentas de Formatação, pois ela tem tudo o mais e mais, mas gostaria de ter o riscado como uma opção. O que você recomenda, visto que a compatibilidade é um problema entre esses dois?
Eu poderia adicionar um botão de riscado na barra de ferramentas do plugin, pode ser relevante no futuro.
Vou pensar sobre isso, mas, enquanto isso, você pode usar o plugin e adicionar este componente: GitHub - MonDiscourse/discourse-strikethrough: Add a strikethrough button in the composer
Ele adicionará um botão de riscado no menu pop-up de ação, é compatível com o plugin.
3 curtidas
Enviei um PR: https://github.com/MonDiscourse/md-composer-extras/pull/10 que, a menos que eu tenha esquecido uma vírgula ou algo assim, deve corrigir
Para evitar erros em testes, adicione uma chave `pluginId` à sua chamada `modifyClass`. Isso garantirá que a modificação seja aplicada apenas uma vez.
2 curtidas