lostconnection / makeitdark

Python tool to inject a dark theme into the Slack desktop application

Slack dark theme injector tool

This tool writes a dark theme to the Slack desktop application. Dark theme was taken from the generated Dark Reader theme that was applied when I visited the web version of slack, like so:

Array.from(document.querySelectorAll('.darkreader')).map((n) => n.textContent).join('\n');

Preview:

Prerequisites

Install nodejs

Install python

You really should take the css file from this site, and host it somewhere you control. It's not a great idea to have a script inject an arbitrary CSS file from a domain outside of your control, into an application like Slack that could have sensitive data.

Don't trust me - fork the repo.

Running

Unix

sudo python makeitdark.py

sudo python3 makeitdark.py

Windows

Make sure Slack is NOT running, then execute:

python makeitdark.py

Sidebar

Add this sidebar theme which kinda makes it look like Mojave dark mode:

#333336,#2e2e31,#666668,#ffffff,#277df6,#d7d5d4,#277df6,#277df6

Or add this sidebar theme for more consistency:

#17181c,#252525,#A36B31,#D2D6D6,#5C6380,#DEDEDE,#ADBA4E,#DB6668

Or this one, to make the colors match exactly:

#1b1c21,#2a323e,#0576b9,#FFFFFF,#2a323e,#FFFFFF,#62c462,#ff9000

You can fiddle around with custom sidebar themes at https://slackthemes.net

Slack Updates

When Slack updates it will overwrite the installed dark theme. When this happens just re-run the tool to make it dark again.

Authors

• James Szklarz - Initial work - LostConnection
• Andrew Hayworth - Darkreader updates - ahayworth

See also the list of contributors who participated in this project.

License

This project is licensed under the MIT License - see the LICENSE file for details

Acknowledgments

• Authors of js injection code used
• Original dark css used

makeitdark's Issues

Close files after use

Currently we are relying on the GC to close any files that we have opened. Need to change this so that the file handles are explicitly closed.

Text unreadable when creating Post or replying in a thread

When creating a post, the text color is set to black so it's nearly impossible to create one. Also, when starting or replying to a thread, the text is white on a white background so you have the same issue.

Temporarily highlighted messages are unreadable for a few moments.

When you click a link to a message, the message is highlighted to draw your attention to the right content, however in this darkmode it becomes very difficult to read the content for a few moments before the fade dies away.

Without darkmode the field just goes from white to yellow (still very readable).

All Threads broken

Seems that something was changed today by Slack that broke the "All Threads" view and everything is blinding white.

Slack update 4.0.1 (productio

might relate to #27 #31 and #32

In Slack 4.0.1, message box now has a white surrounding. There's a new section with formatting buttons added by Slack

Doesn't work on Windows 10 MS Store version

Traceback (most recent call last): File "makeitdark.py", line 69, in <module> most_recent = sorted([slack_version for slack_version in os.listdir(slack_root_path) if slack_version.startswith("app-") and os.path.isdir(os.path.join(slack_root_path, slack_version))], reverse=True)[0] FileNotFoundError: [WinError 3] The system cannot find the path specified: 'C:\\Users\\USER\\AppData\\Local\\slack'

Inject prefab styles via descriptor mapping at execution

Provide various theme values as mapping descriptors that can be used as arguments on execution.

This requires some sass styling that uses themes based on a theme declaration and will be mapped to a sidebar theme for consistency.

Screenshots to README so we can preview before installing

Do you think it'd be possible to add some screenshots to the README so that new users who find this repository can see what it looks like before deciding if they want to install it or not?

Doesn't work on the new Slack version 4.0.0

Incorrectly styled segments in Notifications Preferences.

In Preferences > Notifications, you see this:

I'm getting these white bars in the top and bottom

Thanks for all your help on this. Crazy that Slack still hasn't done this themselves.

Got this to (mostly) work with @defmonk0's fix. But I'm getting these white bars in the top and bottom now:

Originally posted by @yourfriendaaron in #27 (comment)

Screen sharing background completely dark after installing

Hey, thanks for making this script, its awesome!

I'm having an issue on Slack Native app on MacOS Mojave.

After installing the makeitdark theme, during screen sharing the entire screen goes completely dark. You can't see anything in screen sharing. If you click around with the mouse or Command-Tab to other windows you can see the window again. But then if someone draws on your screen it all goes dark again.

If I uninstall makeitdark screen sharing is fine.

I'm playing around trying to figure out if theres something in the CSS thats causing it. If I figure it out I'll post here. If anyone knows a solution please let me know!

Problems with MASTER under Windows

Current version of the script doesn't work unless I modify the script as follows (Windows 10) to encapsulate the path for unpacking the asar archive:

unpack_command = apply_sudo(sudo, "npx asar extract {0}/app.asar {0}/app.asar.unpacked".format('"' + packed_path + '"'))

and for packing the asar archive after modifications:

pack_command = apply_sudo(sudo, "npx asar pack {0}/app.asar.unpacked {0}/app.asar".format('"' + packed_path + '"'))

Also, in the current version of the script I have to create a symbolic link for
C:\Program Files\Slack
to the following
C:\Program Files\Slack\App-Slack

Basically, the detection requires a subdirectory underneath of the Slack directory with the prefix of "App-", but that's not the location it installs to in program files.

It should just be checking "C:\Program Files\Slack" directly for resources.

Bash version of script

I have used the python script and everything worked fine and smoothly. However, as a dependancy a user of this script will need to install python (I already had this so it's not an issue for me).

It would be good to provide both python and bash versions for those who don't have python and have no need for it after the makeitdark install.

No styles applied to Channel Search

When using the new channel search feature, the dark mode styles are not applied, see:

I'm getting white while on a thread and the reply box.

Its working! But im getting white while on a thread and the reply box.

Originally posted by @hioz12 in #27 (comment)

Injected styling tags to be constants

Tags surrounding the injected styles for position marking should be extracted to constants.

After slack update v4.0.2 FileNotFoundError

11:55 $ sudo python3 makeitdark.py
Detected OS X
Traceback (most recent call last):
  File "makeitdark.py", line 94, in <module>
    with open(slack_theme_path, "r+") as f:
FileNotFoundError: [Errno 2] No such file or directory: '/Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js'

looking in that static folder I am only seeing:
node_modules
dist

in that dist there is another static... and well no js files there.
I may dig deeper...

Slack theme path not found

This is my error message:

FileNotFoundError: [Errno 2] No such file or directory: '/usr/lib/slack/resources/app.asar.unpacked/src/static/ssb-interop.js'

and this is the whole programm output:

sudo python3 makeitdark.py 
[sudo] Passwort für lolo: 
Detected linux OS
Traceback (most recent call last):
  File "makeitdark.py", line 94, in <module>
    with open(slack_theme_path, "r+") as f:
FileNotFoundError: [Errno 2] No such file or directory: '/usr/lib/slack/resources/app.asar.unpacked/src/static/ssb-interop.js'

I think I have to change the folder for the file. Dos anybody knows, where it could be?

Thank you!