Por exemplo, este é um código Swift
func jjj () {
let jj: String = "1"
}
Eu quero que ele seja colorido como o seguinte,
Por exemplo, este é um código Swift
func jjj () {
let jj: String = "1"
}
Eu quero que ele seja colorido como o seguinte,
A cor é adicionada dependendo do idioma. Você pode verificar se o Swift é adicionado em highlighted_languages e, se a detecção ainda não funcionar, você também pode definir manualmente o idioma para um bloco de código.
A formatação do bloco de código está boa, foi adicionada como (sem as aspas)
" swift [código aqui] "
Ela é realçada da seguinte forma, mas o problema é a cor que ela fornece, eu não gosto. Ela é realçada como abaixo. (veja a cor vermelha “jjj”, eu quero que ela fique na cor azul.
Mas eu quero algo como o seguinte
É possível editar um arquivo etc. via terminal? para que eu possa mudar as cores padrão atribuídas para uma linguagem específica?
Os idiomas detectados são feitos através de uma configuração do site: idiomas destacados.
Swift pertence à lista por padrão, mas não no meta.
Os idiomas suportados por esta biblioteca de terceiros estão listados aqui:
editar: como explicado aqui ![]()
@PrettyGirl, dica de markdown: você pode escapar backticks de um codeblock envolvendo seu código com quatro backticks em vez de três ![]()
``` swift
[código aqui]
```
Olá ![]()
Você também pode tentar alterar as cores com este componente de tema ![]()
Obrigado pela dica e pelo link. No entanto, a configuração do site highlighted languages inclui swift. Ele é destacado, mas não gosto das cores que ele está destacando atualmente. Existe outra maneira? editar o highlight.js dentro da pasta discourse etc? deve haver uma maneira, não é? Notei que o highlight.js também é open source.
O Discourse vem com highlight.js por padrão?
Ah, desculpe por isso, eu li seu tópico errado. ![]()
Sim ![]()
Você tentou o componente de tema postado pelo beeper em sua última mensagem?
Eu não, porque não sei como outras áreas (em todo o aplicativo Discourse) ficarão diferentes se eu aplicar outros temas. Gosto da aparência e das configurações atuais, mas apenas de alguns problemas aqui e ali. Se o tema mudar a aparência ou as configurações, etc., além de fornecer bons blocos de código, não vale a pena. Eu só preciso corrigir esse problema específico.
Você pode direcionar separadamente os idiomas de código e substituir a detecção automática de idioma, como mencionado nas postagens acima.
Se você quiser direcionar o Swift, poderá fazê-lo com a classe .language-swift. Para ser mais específico… code.hljs.language-swift. E você pode alterar as cores do Swift no CSS.
Verifiquei isso e parece que está próximo do tema Xcode. Mas mudaremos essas duas cores para se adequarem mais às cores do código da sua captura de tela.
O problema com essas cores é que elas são difíceis de ler no modo escuro. É por isso que a página de demonstração do highlight.js tem um fundo branco e acho que é por isso que o Discourse usa uma combinação de cores genéricas padrão para os idiomas. Se bem me lembro, houve alguns relatos no passado sobre a dificuldade de leitura no modo escuro, etc…
Para alterá-lo apenas para Swift, você precisa criar um novo componente de tema ou adicionar isso a um existente. Nota: Essas cores também serão usadas no modo escuro (fundo branco, etc.), portanto, se você quiser cores diferentes no modo escuro, precisará criar novas definições de cores dark-light-choose().
Comum / CSS
code.hljs.language-swift {
background: #fff;
color: #000;
.xml .hljs-meta {
color: silver;
}
.hljs-comment,
.hljs-quote {
color: #007400;
}
.hljs-attribute,
.hljs-keyword,
.hljs-literal,
.hljs-name,
.hljs-selector-tag,
.hljs-tag {
color: #aa0d91;
}
.hljs-template-variable,
.hljs-variable {
color: #3f6e74;
}
.hljs-code,
.hljs-meta .hljs-string,
.hljs-string {
color: #c41a16;
}
.hljs-link,
.hljs-regexp {
color: #0e0eff;
}
.hljs-bullet,
.hljs-number,
.hljs-symbol,
.hljs-title {
color: #2b75a6;
}
.hljs-meta,
.hljs-section {
color: #643820;
}
.hljs-built_in,
.hljs-class .hljs-title,
.hljs-params,
.hljs-title.class_,
.hljs-type {
color: #442fa1;
}
.hljs-attr {
color: #836c28;
}
.hljs-subst {
color: #000;
}
.hljs-formula {
background-color: #eee;
font-style: italic;
}
.hljs-addition {
background-color: #baeeba;
}
.hljs-deletion {
background-color: #ffc8bd;
}
.hljs-selector-class,
.hljs-selector-id {
color: #9b703f;
}
.hljs-doctag,
.hljs-strong {
font-weight: 700;
}
.hljs-emphasis {
font-style: italic;
}
}
Antes
Depois
Um Theme component é adicionado ao Theme que você já usa. Portanto, ele não muda a aparência geral, mas adiciona ou altera algo específico. Assim, o componente de código personalizado apenas altera a aparência do código.
A descrição diz que ele altera apenas os blocos de código, que é exatamente o que você quer fazer.
Por favor, leia os links sobre como os temas funcionam que outros sugeriram.
Incrível, muito obrigado. Funciona ![]()
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.