Criar e compartilhar um esquema de cores

[Discourse]

O Discourse agora suporta a importação de esquemas de cores de um repositório remoto. Aqui demonstrarei como você faria isso.

Navegue até cores e adicione um esquema de cores.

Acesse /admin/customize/colors no seu site e crie um esquema de cores.

Dicas:

• Eu usei um plugin do Chrome (color picker) para selecionar cores de uma imagem existente de uma paleta na web.

• Se você criar um tema, atribua o esquema de cores ao tema e visualize-o, as alterações serão refletidas ao vivo.

Crie um novo repositório git com o esquema de cores

mkdir my-awesome-scheme
cd my-awesome-scheme
git init .
vim about.json

Para about.json, adicione um arquivo de configuração esqueleto

{
  "name": "My awesome color schemes",
  "about_url": "",
  "license_url": "",
  "color_schemes": {}
}

Adicione um arquivo LICENSE, eu geralmente uso o MIT

vim LICENSE

Envie as alterações para o GitHub

Faça o commit de todas as suas alterações:

git add LICENSE
git add about.json
git commit -am "first commit"

Crie uma conta em GitHub.com e depois crie um novo repositório.

(Opcional) crie um tópico no Discourse como um lar para discutir suas cores

Idealmente, você criaria um tópico na categoria #plugin:theme com algumas capturas de tela do seu esquema de cores. Você usará isso como seu about_url

Preencha as informações ausentes no seu arquivo about.json

• Navegue até sua página LICENSE no GitHub, preencha essa URL como seu license_url

• Use a URL do projeto do GitHub ou a URL do tópico do Discourse como seu about_url

• Pressione Copy to Clipboard no seu esquema de cores e cole isso na seção color_schemes

Ao final do processo, seu arquivo about.json ficará parecido com:

{
  "name": "Solarized",
  "about_url": "https://github.com/SamSaffron/discourse-solarized",
  "license_url": "https://github.com/SamSaffron/discourse-solarized/blob/master/LICENSE",
  "color_schemes": {
    "Solarized Light": {
      "primary": "586E75",
      "secondary": "EEE8D5",
      "tertiary": "268BD2",
      "quaternary": "CB4B16",
      "header_background": "002B36",
      "header_primary": "93A1A1",
      "highlight": "B58900",
      "danger": "CB4B16",
      "success": "859900",
      "love": "DC322F"
    }
  }
}

Faça o commit da alteração e envie para o GitHub

git commit -am "added more details"
git push

Teste se seu esquema de cores está correto

• Exclua seu esquema de cores local
• Na tela admin/customize/theme, importe seu tema do GitHub

• Visite admin/customize/colors e certifique-se de que seu esquema de cores está correto.

Você pode compartilhar seu esquema de cores facilmente com outras pessoas!

Veja também:

Structure of themes and theme components

Discourse supports native themes that can be sourced from a .tar.gz archive or from a remote git repository including private repositories. [56] An example theme is at: GitHub - discourse/discourse-simple-theme: Sam's simple discourse theme [32] The git repository will be checked for updates (once a day), or by using the Check for Updates button. When changes are detected the Check for Updates button will change to the Update to Latest. [image] To create a theme you need to follow a spec…

---

Última Revisão por @SaraDev em 2022-06-03T01:00:00Z

---

Este documento é controlado por versão - sugira alterações no github.

[j127]

@Discourse

{
  "name": "Solarized",
  "about_url": "https://github.com/SamSaffron/discourse-solarized",
  "license_url": "https://github.com/SamSaffron/discourse-solarized/blob/master/LICENSE",
  "color_schemes": {
    "Solarized Light": {
      "primary": "586E75",
      "secondary": "EEE8D5",
      "tertiary": "268BD2",
      "quaternary": "CB4B16",
      "header_background": "002B36",
      "header_primary": "93A1A1",
      "highlight": "B58900",
      "danger": "CB4B16",
      "success": "859900",
      "love": "DC322F"
    }
  }
}

Eu acho que há mais dois campos que podem ser adicionados lá: hover e selected.