Come installare la modalità oscura (non ufficiale) per il gioco

Il gioco non ha ancora una modalità scura. Presentano temi scuri, ma consentono solo di personalizzare i colori della barra laterale, lasciando la finestra principale bianca. Con il rilascio di modalità dark a livello di sistema su macOS Mojave e Windows 10, Slack si sente molto fuori posto.

Questo metodo non è ufficiale e prevede di scavare nei file sorgente per Slack. È abbastanza facile da eseguire, ma poiché verrà sovrascritto ogni volta che si aggiorna, sarà necessario farlo più volte.

Download di un tema

Poiché Slack gira su Electron, un framework per lo sviluppo di app desktop Node.js, puoi modificarne gli stili come se dovessi modificare il CSS di un sito web. Ma i file CSS per Slack sono sepolti nella fonte, quindi dovrai caricare i tuoi temi.

Il più popolare vero tema della modalità oscura è slack-black-theme di Widget. E poiché Electron condivide il codice su tutte le piattaforme, questo tema funzionerà anche su Windows e Linux. Abbiamo scoperto che c'erano alcuni problemi con il tema su macOS Mojave, quindi se non funziona, puoi provare questo fork, che dice che funziona solo su macOS ma potrebbe funzionare anche per gli utenti Windows.

Patching Slack

Questa parte, dovrai ripetere ogni volta che Slack si aggiorna. Su macOS, puoi accedere alla directory dei sorgenti di Slack facendo clic con il pulsante destro del mouse sull'app stessa e selezionando "Mostra contenuto pacchetto". Su Windows, lo troverai su ~ \ AppData \ Local \ slack \ .

Quindi, sposta alcune cartelle verso il basso risorse / app.asar.unpacked / src / static / . Stai andando a voler trovare il SSB-interop.js file, dove modificerai il codice. Assicurati che Slack sia chiuso, apri quel file nel tuo editor di testo preferito e scorri fino in fondo:

Copia e incolla il seguente codice alla fine del SSB-interop.js file:

// Prima assicurati che l'app wrapper sia caricata document.addEventListener ("DOMContentLoaded", function () // Quindi ottieni le sue visioni web lascia webviews = document.querySelectorAll (". TeamView webview"); // Scarica il nostro CSS in parallelo avanti of time const cssPath = 'https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css'; lascia cssPromise = fetch (cssPath) .then (response => response.text () lasciare customCustomCSS = ': root / * Modificarli per cambiare i colori del tema: * / --primary: # 09F; --text: #CCC; --background: # 080808; --background-elevate: # 222 ; '// Inserisci un tag di stile nella vista wrapper cssPromise.then (css => let s = document.createElement (' style '); s.type =' text / css '; s.innerHTML = css + customCustomCSS ; document.head.appendChild (s);); // Attendi che ogni webview carichi webviews.forEach (webview => webview.addEventListener ('ipc-message', message => if (message.channel == 'didFinishLoading') // Infine aggiungi il CSS nella 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); )); ); ); 

Probabilmente vorrai duplicare questo file e salvarlo in una posizione diversa, quindi non dovrai modificare il codice ogni volta. In questo modo, puoi semplicemente trascinarlo nella directory per sovrascrivere la versione più recente:

Dopo aver finito, riapri Slack, e dopo alcuni secondi dovrebbe scattare la modalità scura. La schermata di caricamento sarà ancora bianca, ma la finestra principale dell'applicazione si fonderà molto meglio con il resto del tuo sistema:

Aggiungere i tuoi temi

Se non ti piace il suo aspetto, puoi modificare il CSS con tutti gli stili che desideri. Tutto questo codice fa caricare gli stili personalizzati da https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css; puoi scaricare quel file, modificarlo con le tue modifiche e sostituire l'URL con il tuo codice. Salva, riavvia Slack e le tue modifiche saranno visibili. Se non conosci il CSS, o vuoi solo fare una piccola modifica, ci sono quattro variabili di colore definite prima di caricare il CSS, quindi puoi semplicemente modificarle con i tuoi colori.