diff --git a/Windows 10 Dark Theme/Slack/install.md b/Windows 10 Dark Theme/Slack/install.md index ae3d02a..e45cf35 100644 --- a/Windows 10 Dark Theme/Slack/install.md +++ b/Windows 10 Dark Theme/Slack/install.md @@ -14,15 +14,41 @@ So, in order to do this now before Slack officially supports it, do the followin - Add the following to the end of the **ssb-interop.js** file ``` -document.addEventListener('DOMContentLoaded', function() { - $.ajax({ - - url: 'https://raw.githubusercontent.com/angelsix/youtube/develop/Windows%2010%20Dark%20Theme/Slack/slack-dark.css', - success: function(css) { - $("").appendTo('head').html(css); - } - }); - }); +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://raw.githubusercontent.com/angelsix/youtube/develop/Windows%2010%20Dark%20Theme/Slack/slack-dark.css'; + let cssPromise = fetch(cssPath).then(response => response.text()); + + // Insert a style tag into the wrapper view + cssPromise.then(css => { + let s = document.createElement('style'); + s.type = 'text/css'; + s.innerHTML = css; + 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}\`; + document.head.appendChild(s); + ` + webview.executeJavaScript(script); + }) + }); + }); +}); ``` - Now close Slack (including in the Taskbar)