Como instalar o modo escuro (não oficial) para folga
Slack ainda não tem um modo escuro. Eles têm temas escuros, mas eles só permitem personalizar as cores da barra lateral, deixando a janela principal em branco. Com o lançamento de modos escuros em todo o sistema no macOS Mojave e no Windows 10, o Slack se sente muito deslocado.
Esse método não é oficial e envolve escavar os arquivos de origem do Slack. É bastante fácil de fazer, mas como ele será sobregravado toda vez que você atualizar, você terá que fazer isso várias vezes.
Download de um tema
Como o Slack é executado no Electron, uma estrutura para o desenvolvimento de aplicativos Node.js de área de trabalho, você pode editar os estilos como se fosse editar o CSS de um website. Mas os arquivos CSS do Slack estão enterrados na fonte, então você terá que carregar seus próprios temas.
O tema mais popular do modo escuro é o tema preto-escuro por Widget. E como o Electron compartilha códigos entre plataformas, esse tema também funcionará no Windows e no Linux. Descobrimos que havia alguns problemas com o tema no macOS Mojave, portanto, se não funcionar, você pode experimentar este fork, que diz que funciona apenas no macOS, mas também pode funcionar para usuários do Windows.
Folga de remendo
Esta parte, você terá que fazer novamente toda vez que o Slack for atualizado. No macOS, você pode acessar o diretório de código-fonte do Slack clicando com o botão direito do mouse no próprio aplicativo e selecionando “Show Package Contents”. No Windows, você encontrará em ~ \ AppData \ Local \ slack \ .
Em seguida, navegue por algumas pastas até recursos / app.asar.unpacked / src / static / . Você vai querer encontrar o ssb-interop.js arquivo, onde você editará o código. Verifique se o Slack está fechado, abra o arquivo no seu editor de texto favorito e vá até o final:
Copie e cole o seguinte código no final do ssb-interop.js Arquivo:
// Primeiro, certifique-se de que o aplicativo wrapper esteja carregado document.addEventListener ("DOMContentLoaded", function () // Em seguida, obtenha suas webviews webviews = document.querySelectorAll (". TeamView webview"); // Busque nosso CSS em paralelo antes de tempo const cssPath = 'https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css'; deixe cssPromise = fetch (cssPath) .then (response => response.text () ); deixe customCustomCSS = ': root / * Modifique estes para alterar as cores do seu tema: * / --primary: # 09F; --text: #CCC; --background: # 080808; --background-elevated: # 222 ; '// Insere uma tag de estilo na view do invólucro cssPromise.then (css => let s = document.createElement (' estilo '); s.type =' texto / css '; s.innerHTML = css + customCustomCSS ; document.head.appendChild (s);) // Aguarde até que cada webview carregue webviews.forEach (webview => webview.addEventListener ('ipc-message', message => if (message.channel ==) 'didFinishLoading') // Finalmente adicione o CSS no webview cssPromise.then (css => let script = 'let s = document.createElement (' style '); s.type = 'text / css'; s.id = 'slack-custom-css'; s.innerHTML = \ '$ css + customCustomCSS \'; document.head.appendChild (s); 'webview.executeJavaScript (script); )); ); ); Você provavelmente desejará duplicar esse arquivo e salvá-lo em um local diferente, para não precisar editar o código todas as vezes. Dessa forma, você pode simplesmente arrastá-lo para o diretório para sobrescrever a versão mais recente:
Depois de terminar, reabra o Slack e, após alguns segundos, o modo escuro deve ser ativado. A tela de carregamento ainda ficará branca, mas a janela principal do aplicativo se misturará muito melhor com o restante do sistema:
Adicionando seus próprios temas
Se você não gosta da aparência dele, pode editar o CSS com qualquer estilo que desejar. Tudo o que esse código faz é carregar estilos personalizados em https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css; você pode baixar esse arquivo, editá-lo com suas alterações e substituir o URL por seu próprio código. Salve, reinicie o Slack e suas alterações ficarão visíveis. Se você não conhece CSS, ou apenas quer fazer uma pequena alteração, existem quatro variáveis de cor definidas antes de carregar o CSS, para que você possa editá-las com suas próprias cores.
