Slack non ha ancora un dark mode. Sono i temi scuri, ma solo quelli che consentono di personalizzare la barra laterale colori, lasciando la finestra principale di nero. Con il rilascio di a livello di sistema buio modalità su macOS Mojave e Windows 10, il margine di flessibilità si sente molto fuori luogo.
Questo metodo non è ufficiale e coinvolge scavare il file di origine per il margine di flessibilità. E ‘ abbastanza facile da fare, ma dal momento che verrà sovrascritto ogni volta che si aggiorna, si dovrà fare questo più volte.
Download di un Tema
Dal momento che la Slack, corre di Elettroni, un framework per lo sviluppo di desktop Node.js apps, è possibile modificare gli stili come devi modificare il CSS di un sito web. Ma il file CSS per Slack sono sepolti in origine, quindi dovrete caricare i propri temi.
Il più popolare vera dark mode tema è slack-nero-tema Widget. E poiché Elettrone azioni di codice su piattaforme, questo tema funziona su Windows e Linux. Abbiamo trovato ci sono stati alcuni problemi con il tema su macOS Mojave, però, così se non funziona, allora si può provare questo bivio, che dice che funziona su macOS solo, ma può funzionare per gli utenti Windows.
Patch Slack
Questa parte, devi fare di nuovo ogni volta che Slack aggiornamenti. Su macOS, si può ottenere per allentare la directory di origine, facendo clic destro sulla stessa app e selezionare “Mostra Contenuto Pacchetto”. Su Windows, lo trovi a ~AppDataLocalslack .
Quindi, passare un paio di cartelle giù per le risorse/app.asar.scompattato/src/static/ . Si sta andando a voler trovare il ssb-interop.js file, dove potrete modificare il codice. Assicurarsi Slack è chiusa, aprire il file in un editor di testo, scorrere fino in fondo:
Copia e incolla il seguente codice alla fine del ssb-interop.js file:
// Per prima cosa assicurarsi che il wrapper applicazione viene caricata
documento.addEventListener(“DOMContentLoaded”, function() {
// Quindi ottenere la sua visualizzazioni web delle
lasciate visualizzazioni web delle = document.querySelectorAll(“.TeamView webview”);
// Recupero il nostro CSS in parallelo in anticipo
const cssPath = ‘https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css’;
lasciate che cssPromise = fetch(cssPath).quindi(risposta => risposta.testo());
lasciate che customCustomCSS = `
:root {
/* Modificare questi per cambiare i colori del tema: */
–primario: #09F;
–testo: #CCC;
–background: #080808;
–background-elevata: #222;
}
`
// Inserire un tag di stile nel wrapper vista
cssPromise.quindi(css => {
sia s = document.createElement(‘style’);
s.type = ‘text/css’;
s.innerHTML = + css customCustomCSS;
documento.testa.appendChild(s);
});
// Attesa per ogni webview a carico
visualizzazioni web delle.forEach(webview => {
webview.addEventListener(‘ipc-messaggio, il messaggio => {
if (messaggio.channel == ‘didFinishLoading’)
// Infine aggiungere il CSS nella webview
cssPromise.quindi(css => {
lasciate script = `
sia s = document.createElement(‘style’);
s.type = ‘text/css’;
s.id = ‘slack-personalizzato-css’;
s.innerHTML = `${css + customCustomCSS}`;
documento.testa.appendChild(s);
`
webview.executeJavaScript(script);
})
});
});
});
Probabilmente si vorrà per duplicare il file e salvarlo in una posizione diversa, quindi non è necessario modificare il codice ogni volta. In questo modo, si può semplicemente trascinare nella directory di sovrascrivere la versione più recente:
Dopo aver finito, riaprire Slack, e dopo pochi secondi la dark mode deve calci in. La schermata di caricamento sarà ancora bianco, ma la finestra dell’applicazione si fondono molto meglio con il resto del sistema:
Aggiungere I Vostri Propri Temi
Se non ti piace l’aspetto di essa, è possibile modificare il CSS di qualsiasi stile che si desidera. Tutto questo codice non è carico di stili personalizzati da https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css; potete scaricare il file, modificarlo con le modifiche, e sostituire l’URL con il proprio codice. Salvare, rilanciare la Debole, e le modifiche saranno visibili. Se non conosci i CSS, o vuole solo fare una piccola modifica, ci sono quattro colori variabili definite prima del caricamento del CSS, in modo che si può semplicemente modificare i propri colori.