\r\n\r\n
Slackにはまだダークモードがありません。ダークテーマもありますが、サイドバーの色をカスタマイズできるだけで、メインウインドウは白のままです。maco**ojaveのリリースやwindows 10のシステム全体のダークモードで、Slackは非常に場違いな感じがしています。
この方法は非公式なもので、slackのソースファイルを掘り下げる必要があります。かなり簡単ですが、アップデートのたびに上書きされるので、複数回行う必要があります。
Slackはデスクトップ開発用のフレームワークであるnode.jsアプリケーションのElectron上で動作するため、WebサイトのCSSを編集するのと同じようにスタイルを編集することが可能です。しかし、SlackのCSSファイルはソースコードに隠されているため、自分でテーマを読み込む必要があります。
最も人気のある真のダークモードのテーマは、Widgetによるslack blackのテーマです。Electronがプラットフォーム間でコードを共有しているおかげで、このテーマはWindowsとLinuxでも利用可能です。は、macOSでのみ動作すると言っていますが、Windowsユーザーでも動作する可能性があります。
この部分は、slackのアップデートを毎回やり直す必要があります。macOSでは、アプリケーション本体を右クリックして「パッケージの内容を表示」を選択することで、Slackのソースディレクトリにアクセスすることができます。Windowsの場合、~AppDataLocalSlackGenにあります。
次に、数個下のフォルダーにある resources/app.asar.unpacked/src/static/ に移動してください。コードを編集するs**-interoperable.jsファイルを探したいと思います。Slackが閉じていることを確認し、お気に入りのテキストエディターでファイルを開き、一番下までスクロールしてください。
以下のコードをコピーして、s** - interop.jsファイルの一番最後に貼り付けてください。
// 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 c***t cssPath = 'https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css'; let cssPromise = fetch(cssPath).then(resp***e => resp***e.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); }) }); }); });毎回コードを編集する必要がないように、このファイルをコピーして別の場所に保存しておくとよいでしょう。この方法では、ディレクトリにドラッグするだけで、最新版を上書きして
これが完了したら、Slackを再び開くと、数秒後にダークモードが起動します。ローディング画面はまだ白いままですが、メインアプリケーションウィンドウはシステムの他の部分とよりよく調和します:。
見た目が気に入らなければ、CSSを好きなスタイルに編集することができます。このコードはすべて https://cdn.rawgit.com/widget--/slack-black-theme/master/custom.css から引用しています。ファイルをダウンロードし、あなたの変更内容で編集し、URLをあなたのコードに置き換えることができます。 保存してSlackを再起動すると、あなたの変更が反映されます。が見える。CSSがわからない、あるいはちょっとだけ変更したいという場合は、CSSを読み込む前に4つのカラー変数があるので、それを使って自分の好きな色に編集することができます。