Botão do Composer Highlighter

:information_source: Resumo Um botão de destaque de texto para a barra de ferramentas do compositor do Discourse
:eyeglasses: Prévia Demonstração em Vídeo
:hammer_and_wrench: Repositório GitHub - denvergeeks/discourse-highlight-wrap-theme-component: A Text Highlighter Button for the Discourse Composer Toolbar
:question: Guia de Instalação Como instalar um tema ou componente de tema
:open_book: Novo em Temas do Discourse? Guia para iniciantes sobre como usar temas do Discourse

Instale este componente de tema

O botão se parece com uma caneta marca-texto… discourse-highlighter-button Ele serve ao propósito muito específico e limitado de clicar em um botão na barra de ferramentas do compositor para inserir <mark>isto</mark>.

:information_source: Ctrl-H é o atalho de teclado que você pode usar em vez de clicar no botão.

Nas configurações, você pode substituir tanto a cor de fundo (Highlighter) quanto a cor do texto nas partes destacadas.

Muito obrigado a @pfaffman e @merefield e @Lilly e @JammyDodger e @Canapin por ajudarem com isso!

14 curtidas

Isso é incrível. Bom trabalho :clap:t2: :star_struck:

3 curtidas

isto é muito bom.

onde o .d-wrap é definido?
ele aparece com esta cor no meu com o tema padrão… gostaria de ter a cor do realce como no seu vídeo, obrigado

image

Parece que é a configuração da variável de cor --highlight-medium na paleta que você está usando para esse tema

Aqui está como uma das minhas paletas se parece:

Este componente está usando o tom médio da cor de destaque. Você pode ver o exato em seu guia de estilo se ele estiver habilitado em admin-settings-(styleguide enabled ou styleguide admin only) o guia de estilo para as cores do tema está em /styleguide/atoms/colors

2 curtidas

Na verdade, pode valer a pena enviar um PR ou uma sugestão para uma substituição da cor do realce. :slight_smile:

2 curtidas

Sim, estava pensando, é melhor ter uma configuração para isso

2 curtidas

Adicionando uma configuração agora… volto logo

1 curtida

Usar <mark>mark</mark> seria mais esperado? Acho que isso usa a cor ‘destaque’ na paleta de cores.

<mark>mark</mark>

3 curtidas

OK, coloquei uma configuração lá para usar #ff8 por padrão.

1 curtida

Hah, eu estava prestes a enviar um pr para você :slight_smile:

Happy Super Hero Girls GIF by DC

Ótimo, acabei de puxar, funciona muito bem! :grinning:

2 curtidas

Olá @denvergeeks :slight_smile:

Veja como seu estilo difere (com configurações padrão) de \u003cmark\u003e (que usa uma variável de cores do Discourse, tornando-o legível, qualquer que seja o esquema de cores que você escolheu):

Em um tema escuro:

3 curtidas

Perfeito @Canapin, vou incluir isso!

Ou, se alguém quiser QPR (Questionar, Propor, Revisar) isso, me avise, pois posso não conseguir fazer isso hoje.

OK, isso agora usa a sugestão de @Canapin de usar o \u003cmark\u003e integrado e os padrões CSS correspondentes.

Além disso, agora oferece configurações para substituir a cor de fundo (Highlighter) e a cor do texto nas porções destacadas. Graças a @Lilly por esse CSS condicional.

1 curtida

Estou tentando criar um seletor de cores json, mas não está funcionando. Recebo apenas uma janela pop-up em branco com um botão Salvar. :woman_facepalming:t2:
Talvez eu veja se um em javascript é possível de alguma forma. A paleta de cores e a interface de emblema têm funções de seletor de cores js, mas talvez funcionem apenas com um plugin.

1 curtida

Para mim, essas configurações não são substituições. Elas devem ser preenchidas, caso contrário, não faz nada.

E… estou no tema padrão e, por falta de café matinal, estou em modo lento — não verifiquei se isso vem do próprio tema.

Editar: não, o tema ou o esquema de cores não desempenham nenhum papel. Então, ele seguirá o esquema de cores e será uma substituição, ou é uma configuração obrigatória?

Tente atualizar o componente e recarregar a página. Não consigo reproduzir o erro.

Ele está inserindo a tag <mark></mark>?

Eu atualizei primeiro antes de tentar. E não, ele usa wrap. Então estou um pouco atrasado?

A configuração JSON do seletor de cores (em um tema/componente) não está funcionando no Discourse, de fato.
Acho que uma boa prática seria usar variáveis de cores do Discourse em geral em vez de escolher cores arbitrárias em um tema ou componente que não se misturarão bem dependendo de outros temas e cores que os usuários escolheram.

Um usuário criou um seletor de cores para o compositor há algum tempo, mas não tenho certeza se o código foi lançado:

2 curtidas