Så här installerar du (inofficiellt) mörkt läge för Slack
Slack har fortfarande inget mörkt läge. De har mörka teman, men de låter dig bara anpassa sidofärgfärgerna och lämna huvudfönstret vit. Med utgåvan av systemövergripande mörka lägen på macOS Mojave och Windows 10, känner Slack mycket ur sin plats.
Denna metod är inofficiell och innebär att gräva i källfilerna för Slack. Det är ganska enkelt att göra, men eftersom det kommer att skrivas över varje gång du uppdaterar, måste du göra det flera gånger.
Hämtar ett tema
Eftersom Slack körs på Electron, en ram för att utveckla stationära Node.js-appar, kan du redigera stilar för den som att redigera CSS på en webbplats. Men CSS-filerna för Slack är begravda i källan, så du måste ladda dina egna teman.
Det mest populära sanna mörkt mode-temat är Slack-Black-tema av Widget. Och eftersom Electron-aktier kodar över plattformar, kommer detta tema också att fungera på Windows och Linux. Vi fann att det fanns några problem med temat på macOS Mojave, men om det inte fungerar kan du prova den här gaffeln, som säger att den bara fungerar på macOS men kan fungera för Windows-användare också.
Patching Slack
Den här delen måste du göra igen varje gång Slack uppdaterar. På macOS kan du komma till Slacks källkatalog genom att högerklicka på appen själv och välja "Visa paketinnehåll". På Windows hittar du den på ~ \ AppData \ Local \ slack \
.
Sedan navigera några mappar ner till resurser / app.asar.unpacked / src / fast /
. Du kommer att vilja hitta SSB-interop.js
fil, där du redigerar koden. Se till att Slack är stängd, öppna den filen i din favorit textredigerare och bläddra till botten:
Kopiera och klistra in följande kod i slutet av SSB-interop.js
fil:
// Först och främst försäkra dig om att wrapper-appen är laddad document.addEventListener ("DOMContentLoaded", funktion () // Sedan får du sina webbvyer låta webviews = document.querySelectorAll ("TeamView webview"); // Hämta vår CSS parallellt framåt av time const cssPath = 'https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css'; låt cssPromise = hämta (cssPath) .then (svar => response.text () ), låt customCustomCSS = ': root / * Ändra dessa för att ändra dina temafärger: * / --primary: # 09F; --text: #CCC; --background: # 080808; --background-elevated: # 222 ; '// Lägg in en stilmärke i wrappervyn cssPromise.then (css => låt s = document.createElement (' style '); s.type =' text / css '; s.innerHTML = css + customCustomCSS ; document.head.appendChild (s);); // Vänta för varje webbvisning att ladda webbviews.forEach (webview => webview.addEventListener ('ipc-message', message => if (message.channel == 'didFinishLoading') // Slutligen lägg till CSS i webvyn cssPromise.then (css => let script = 'låt s = document.createElement (' style '); s.type = 'text / css'; s.id = 'slack-custom-css'; s.innerHTML = \ '$ css + customCustomCSS \'; document.head.appendChild (s); 'webview.executeJavaScript (script); )); ); );
Du kommer noga att duplicera den här filen och spara den på en annan plats, så du behöver inte redigera koden varje gång. På så sätt kan du bara dra det i katalogen för att skriva över den senaste versionen:
När du är klar, återuppta Slack, och efter några sekunder ska det mörka läget sparka in. Laddningsskärmen kommer fortfarande att vara vit, men huvudapplikationsfönstret kommer att blandas mycket bättre med resten av ditt system:
Lägga till egna teman
Om du inte gillar utseendet på det, kan du redigera CSS med alla stilar du vill ha. Allt den här koden gör är att ladda egna stilar från https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css; Du kan ladda ner den filen, redigera den med dina ändringar och ersätta webbadressen med din egen kod. Spara, starta om Slack, och dina ändringar kommer att synas. Om du inte känner till CSS eller bara vill göra en mindre förändring, finns det fyra färgvariabler definierade innan du laddar CSS, så du kan bara redigera dem med egna färger.