Denne metoden er uoffisiell og innebærer å grave rundt i kildefilene for Slack. Det er ganske enkelt å gjøre, men siden det blir overskrevet hver gang du oppdaterer, må du gjøre dette flere ganger.
Laster ned et tema
Siden Slack kjører på Electron, et rammeverk for å utvikle desktop Node.js apps, kan du redigere stilene for det som om du vil redigere CSS på et nettsted. Men CSS-filene for Slack er begravet i kilden, så du må laste inn dine egne temaer.
Det mest populære sanne mørke modus-temaet er slakk-svart-tema av Widget. Og siden Electron aksjer kodes på tvers av plattformer, vil dette temaet også fungere på Windows og Linux. Vi fant at det var noen problemer med temaet på macOS Mojave skjønt, så hvis det ikke fungerer, kan du prøve denne gaffelen, som sier at den bare fungerer på macOS, men kan også fungere for Windows-brukere.
Patching Slakk
~AppDataLocalslack
Deretter navigerer noen få mapper ned til
resources/app.asar.unpacked/src/static/
. Du kommer til å ønske å finne
ssb-interop.js
fil, hvor du vil redigere koden. Kontroller at Slack er lukket, åpne filen i favoritt tekstredigeringsprogrammet, og bla til bunnen:
ssb-interop.js
fil:
// First make sure the wrapper app is loaded document.addEventListener('DOMContentLoaded', function() { // Then get its webviews let webviews = document.querySelectorAll('.TeamView webview'); // Fetch our CSS in parallel ahead of time const cssPath = 'https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css'; let cssPromise = fetch(cssPath).then(response => response.text()); let customCustomCSS = `:root { /* Modify these to change your theme colors: */ --primary: #09F; --text: #CCC; --background: #080808; --background-elevated: #222; } ` // Insert a style tag into the wrapper view cssPromise.then(css => { let s = document.createElement('style'); s.type = 'text/css'; s.innerHTML = css + customCustomCSS; document.head.appendChild(s); }); // Wait for each webview to load webviews.forEach(webview => { webview.addEventListener('ipc-message', message => { if (message.channel == 'didFinishLoading') // Finally add the CSS into the 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); }) }); }); });
Du vil sannsynligvis duplisere denne filen og lagre den på et annet sted, slik at du ikke trenger å redigere koden hver gang. På denne måten kan du bare dra den inn i katalogen for å overskrive den nyeste versjonen:
Legge til dine egne temaer
Hvis du ikke liker utseendet på det, kan du redigere CSS med alle stilarter du vil ha. Alt denne koden gjør er å laste tilpassede stiler fra https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css; Du kan laste ned den filen, redigere den med endringene, og erstatte nettadressen med din egen kode. Lagre, gjenoppstart Slakk, og endringene dine vil bli synlige. Hvis du ikke kjenner CSS, eller bare ønsker å gjøre en mindre endring, er det definert fire fargevariabler før du laster inn CSS, slik at du bare kan redigere de med dine egne farger.
