Tenho um cliente do Teams solicitando blocos de código em linha que se destaquem mais. Atualmente, seja no modo escuro ou claro, o bloco de código não é muito diferente em cor de outros textos. Poderíamos alterar a cor do texto por padrão no Discourse para que uma cor diferente seja usada e se destaque mais, por exemplo, vermelho?
Sei que para a maioria dos clientes isso não é um grande problema porque eles podem personalizar o tema para alterar o CSS em seu site, mas para o Discourse for Teams esse nível de personalização não é possível. Enquanto isso, para equipes que discutem código, é muito importante que ele se destaque como algo muito diferente do outro texto.
Obrigado, Tobias. Para constar, eu sou o cliente e quero enfatizar que estou falando exclusivamente sobre blocos inline. Não tenho nenhuma preocupação com multilinhas.
Para constar, se você é um novato em HTML como eu (tive que pesquisar):
<kbd>Fancy!</kbd> é feito com <code><kbd>Fancy!</kbd></code>
<ins>Ohhhh!</ins> é feito com <code><ins>Ohhhh!</ins></code>
É útil saber, obrigado @tobiaseigen.
Ainda acho que faria sentido ajustar o CSS para isso também. Temos alguns posts técnicos que usam muito as crases, e usar as 2 alternativas definitivamente não é tão amigável para o usuário.
Ah, existe uma terceira forma de destacar que também é legal e que eu continuo esquecendo. Fica assim e é feita usando esta marcação HTML <mark>texto</mark>. Existe um componente de tema contribuído pela comunidade (não disponível no Teams) que permite usar ==texto== em vez disso, o que é bastante útil. Não estou encontrando imediatamente por algum motivo.
Mas, de qualquer forma, vou discutir com meus colegas sobre a atualização do estilo padrão dos blocos de código para que sejam mais óbvios. Talvez até mesmo tornar a cor de fundo do bloco de código mais distinta seja suficiente.
O código inline sempre pareceu código normal, em uma fonte monoespaçada (monospace). Qualquer coisa muito brilhante e chocante dependeria muito da comunidade e definitivamente não seria consistente com a forma como vejo código usado na maioria dos lugares na web.
A questão do realce de sintaxe é diferente; você precisaria de várias linhas de código para determinar com qual sintaxe está lidando. Talvez essa tenha sido a raiz do problema – se você quer realce de sintaxe, precisa de um bloco de código, por exemplo.
var x, y, z; // Declara 3 variáveis
x = 5; // Atribui o valor 5 a x
y = 6; // Atribui o valor 6 a y
z = x + y; // Atribui a soma de x e y a z
document.getElementById("demo").innerHTML =
"O valor de z é " + z + ".";
Um único elemento código está divorciado de todo o contexto necessário para fazer o realce de sintaxe. Você poderia fazer uma única linha de JavaScript, no entanto:
"o valor de z é " + z + ".";
Que se parece com
``` javascript
"o valor de z é " + z + ".";
```
Então, acho que isso é sobre blocos de código versus uma palavra de código.
Acho que @jordan.vidrine tem ordens aqui. Apenas para prosseguir e reverter totalmente a alteração. Talvez criar um componente de tema para “estilos de código alternativos”, ele pode usar totalmente o Slack em código inline e torná-lo vermelho, sendo um componente e tudo mais.
Acho que o pedido aqui foi realmente por uma maneira rápida e fácil de destacar texto em discussões. Muitas pessoas (eu incluída) passaram a usar crases para destacar texto porque é super fácil. Você nem precisa pressionar Shift, e é fácil de encontrar no menu. Mas não se destaca muito do resto do texto no parágrafo.
Negrito e itálico também estão no menu e também não se destacam muito. Outras maneiras de destacar texto inline exigem mais teclas. Além disso, não são documentados de forma proeminente, então também exigem conhecimento interno.
Isso precisaria ser feito em um plugin no momento, pois você gostaria de incorporá-lo ao HTML e não apenas realizar uma transformação do lado do cliente.
Encontrei o plugin que faz isso aleatoriamente hoje enquanto rolava pela categoria Plugin… engraçado como em alguns casos você simplesmente não consegue pensar na palavra-chave certa para encontrar um plugin.
Eu argumentaria que tanto a sublinhado verde quanto a destaque têm o problema exatamente oposto, com contraste desnecessariamente super alto, mas isso é mais uma questão de gosto do que um problema de UX.
Que tal implementar a abordagem do GitHub com um fundo cinza mais escuro e algum preenchimento?
Onde isso se complica é defender uma grande mudança em todas as instâncias do Discourse, muitas das quais estão acostumadas ao estilo suave atual. Este é um movimento de queijo importante.
A solução alternativa de apenas adicionar CSS já existe para a maioria das instalações.