As notícias de desenvolvimento, também conhecidas como o site de [`/news`](https://www.freecodecamp.org/news), são fornecidas por [Ghost](https://ghost.org/). Usamos um tema personalizado para a aparência do site. O código fonte do tema está disponível aqui: <https://github.com/freeCodeCamp/news-theme>.
Ghost usa uma linguagem simples de template chamada [Handlebars](http://handlebarsjs.com/) para seus temas. O tema usado em `/news` é baseado no [tema casper](https://github.com/TryGhost/Casper) padrão.
O tema padrão é bastante comentado então deve ser razoavelmente fácil resolver o que for preciso apenas lendo o código e os comentários. Quando você se sentir confortável com a forma como tudo lá funciona, Ghost também tem uma [documentação da API de tema](https://themes.ghost.org) completa que explica cada helper e template do Handlebars possível.
Um truque muito legal é que você também pode criar modelos personalizados únicos, apenas adicionando o slug de uma página a um arquivo de modelo. Por exemplo:
Certifique-se de executar comandos `ghost` do diretório `ghost-local-site`. Siga instruções adicionais na [documentação oficial do Ghost](https://docs.ghost.org) se não estiver familiarizado com a interface.
Os estilos do tema são compilados utilizando Gulp/PostCSS para poliencher as especificações CSS futuras. Você precisará do [Node.js](https://nodejs.org/). Certifique-se de que sua versão do Node.js é compatível com o `ghost`.
a. Digite `http://localhost:2368/ghost/` na sua barra de pesquisa. Continue com a configuração solicitada na página (se estiver executando ghost pela primeira vez).
c. _(Apenas uma vez, durante a configuração)_ Uma vez que você tenha feito isso, vá até `http://localhost:2368/ghost/#/settings/design` e role para baixo. Certifique-se de clicar em ativar no `freecodecamp-news-theme`.
- Autoprefixer - Não se preocupe em escrever os prefixos do navegador de qualquer tipo, tudo é feito automaticamente com suporte para as 2 versões principais mais recentes de cada navegador.
- Variáveis - Variáveis CSS simples
- [Função de Cor](https://github.com/postcss/postcss-color-function)
O tema usa ícones SVG embutidos, incluídos via partial Handlebars. Você pode encontrar todos os ícones dentro de `/partials/icons`. Para usar um ícone, inclua o nome do arquivo relevante, por exemplo. Para incluir o ícone SVG em `/partials/icons/rss.hbs` - use `{{> "icons/rss"}}`.