Як встановити (Неофіційний) темний режим для Slack
У Slack ще немає темного режиму. Вони мають темні теми, але вони дозволяють налаштовувати кольори бічної панелі, залишаючи головне вікно білим. З виходом загальносистемних темних режимів на MacOS Mojave і Windows 10, Slack відчуває себе дуже недоречно.
Цей метод є неофіційним і передбачає копання у вихідних файлах для Slack. Це досить легко зробити, але, оскільки воно буде перезаписано кожного разу при оновленні, вам доведеться робити це кілька разів.
Завантаження теми
Оскільки Slack працює на Electron, основу для розробки настільних Node.js додатків, ви можете редагувати стилі для нього, як ви могли б редагувати CSS веб-сайту. Але файли CSS для Slack поховані в джерелі, тому вам доведеться завантажувати власні теми.
Найпопулярнішою справжньою темною темою є слабка-чорна тема від віджетів. А оскільки Електрон ділиться кодом на платформи, ця тема буде працювати і на Windows, і на Linux. Ми виявили, що існують деякі проблеми з темою на macOS Mojave, тому, якщо він не працює, ви можете спробувати цю вилку, яка говорить, що вона працює тільки на macOS, але може працювати і для користувачів Windows,.
Виправлення слайків
Ця частина, вам доведеться робити знову кожен раз, коли Slack оновлюється. На MacOS ви можете отримати вихідний каталог Slack, клацнувши правою кнопкою миші на самій програмі та вибравши “Show Package Contents”. У Windows ви знайдете його на Локальний \ t
.
Потім перейдіть до декількох папок до resources / app.asar.unpacked / src / static /
. Ви захочете знайти ssb-interop.js
файл, де ви будете редагувати код. Переконайтеся, що Slack закрито, відкрийте цей файл у своєму улюбленому текстовому редакторі та прокрутіть донизу:
Скопіюйте та вставте наступний код у самому кінці ssb-interop.js
файл:
// Спочатку переконайтеся, що додаток оболонки завантажено document.addEventListener ("DOMContentLoaded", function () // Потім отримайте його webviews let webviews = document.querySelectorAll (". TeamView webview"); time const cssPath = 'https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css', нехай cssPromise = fetch (cssPath). then (response => response.text () нехай customCustomCSS = ': root / * Змінити їх, щоб змінити кольори теми: * / --primary: # 09F; --text: #CCC; --background: # 080808; --background-elevated: # 222 ; '// Вставляємо тег стилю до перегляду обгортки cssPromise.then (css => let s = document.createElement (' стиль '); s.type =' text / css '; // Дочекайтеся завантаження webviews.forEach (webview => webview.addEventListener ('ipc-message', повідомлення => if (message.channel == ==) 'didFinishLoading') // Нарешті додайте CSS до webview cssPromise.then (css => let script = 'let s = document.createElement (' стиль '); s.type = 'text / css'; s.id = 'slack-custom-css'; s.innerHTML = '$ css + customCustomCSS'; document.head.appendChild (s); 'webview.executeJavaScript (скрипт); )); ); );
Можливо, вам доведеться дублювати цей файл і зберігати його в іншому місці, тому вам не доведеться кожен раз редагувати код. Таким чином, ви можете просто перетягнути його до каталогу, щоб перезаписати нову версію:
Після того, як ви закінчите, знову відкрийте Slack, і через кілька секунд темний режим повинен запуститися. Екран завантаження все одно буде білим, але головне вікно програми буде набагато краще зрівнятися з рештою системи:
Додавання власних тем
Якщо вам не подобається його вигляд, ви можете редагувати CSS з будь-якими потрібними стилями. Весь цей код завантажує власні стилі з https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css; Ви можете завантажити цей файл, відредагувати його зі своїми змінами і замінити URL своїм власним кодом. Збережіть, перезапустіть Slack і ваші зміни стануть видимими. Якщо ви не знаєте CSS або просто хочете внести незначні зміни, перед завантаженням CSS визначено чотири змінні кольори, так що ви можете просто редагувати їх своїми кольорами.