DEV Community

Discussion on: Easy Dark Mode for Slack

Collapse
 
fynn_it profile image
Fynn • Edited

code one-liner for repeated injection:

echo 'document.addEventListener("DOMContentLoaded", function() {$.ajax({url: "https://cdn.rawgit.com/laCour/slack-night-mode/master/css/raw/black.css",success: function(css) {let overrides = "code { background-color: #535353; color: #85c5ff; } .c-mrkdwn__pre, .c-mrkdwn__quote { background: #535353 !important; background-color: #535353 !important; }"; $("<style></style>").appendTo("head").html(css + overrides);}});});' | sudo tee -a /Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js

just paste in terminal and hit enter
sudo tee -a fix from sven

Collapse
 
tedyav profile image
Ted Yavuzkurt

For the security conscious among us (or those on corporate networks that would kill us for including external code in a JS File in our slack), here's a version that inlines the contents of that file, and asks you for permission before updating so you can check out the "css" downloaded.

(I put "css" in quotes because there's a risk that the code could be compromised and not be CSS at all. Articles like this hackernoon.com/im-harvesting-credi... make me nervous about these types of attack vectors).

In any case:

echo "TEXT TO BE ADDED:"; echo "document.addEventListener('DOMContentLoaded', function() { const css = \`$(curl --silent https://cdn.rawgit.com/laCour/slack-night-mode/master/css/raw/black.css)\`; const overrides = 'code { background-color: #535353; color: #85c5ff; } .c-mrkdwn__pre, .c-mrkdwn__quote { background: #535353  background-color: #535353 \!important; }'; \$('<style></style>').appendTo('head').html(css + overrides); });"; echo "LOOKS OKAY??? (y = yes)"; read ANSWER; if ! [[ "$ANSWER" =~ ^([yY][eE][sS]|[yY])+$ ]]; then echo "YOU DID NOT ENTER YES. NOT UPDATING"; else; echo "EVERYTHING LOOKS GOOD. UPDATING SLACK."; echo "document.addEventListener('DOMContentLoaded', function() { const css = \`$(curl --silent https://cdn.rawgit.com/laCour/slack-night-mode/master/css/raw/black.css)\`; const overrides = 'code { background-color: #535353; color: #85c5ff; } .c-mrkdwn__pre, .c-mrkdwn__quote { background: #535353  background-color: #535353 \!important; }'; \$('<style></style>').appendTo('head').html(css + overrides); });" | sudo tee -a /Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js; fi;
Collapse
 
tedsvo profile image
Teddy Svoronos

Hey fynn, I tried this command and got the following error:

-bash: /Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js: Permission denied

Any idea why?

Collapse
 
fynn_it profile image
Fynn • Edited

well, sounds like you don't have the right permissions to edit that file.
just add sudo at the beginning of the one-liner (on a  ctrl + a gets you there).

Thread Thread
 
tedsvo profile image
Teddy Svoronos

Should have said this in my original post, but sudo doesn't seem to help. I have admin permissions on this computer, though it's running Mojave and I'm not sure if that added any complications. I also dragged Terminal into "Full Disk Access" in Security & Privacy preferences just to be sure. Weird.

Thread Thread
 
fynn_it profile image
Fynn

well, admin permissions and sudo aren't really the same. some files have an extra layer of "protection".

what does ls -la /Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js say?

Thread Thread
 
tedsvo profile image
Teddy Svoronos

Here's what I get:

-rw-r--r-- 1 root wheel 3806 Oct 22 09:03 /Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js

(I edited the file manually this morning to get it working)

Thread Thread
 
fynn_it profile image
Fynn

yeah so the file belongs to the root user.. not you, meaning you have to use sudo or chown

Thread Thread
 
ubuntudroid profile image
Sven Bendel

Just use

echo 'document.addEventListener("DOMContentLoaded", function() {$.ajax({url: "https://cdn.rawgit.com/laCour/slack-night-mode/master/css/raw/black.css",success: function(css) {let overrides = "code { background-color: #535353; color: #85c5ff; } .c-mrkdwn__pre, .c-mrkdwn__quote { background: #535353 !important; background-color: #535353 !important; }"; $("<style></style>").appendTo("head").html(css + overrides);}});});' | sudo tee -a /Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js

to fix your permission issues.

Collapse
 
erwinkloosterboer profile image
Erwin Kloosterboer • Edited

i have modified Fynn’s one liner to allow the script to be executed multiple times without adding the code more than once. If you place this script in an automator application on your mac, you can add it as a startup program so that it runs on boot.

sed -i.bak '/darkmode BEGIN/,/darkmode END/d' /Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js && echo -e '//darkmode BEGIN\ndocument.addEventListener("DOMContentLoaded", function() {\n $.ajax({\n   url: "https://cdn.jsdelivr.net/gh/laCour/slack-night-mode/css/raw/black.css",\n   success: function(css) {\n     let overrides = `\n     code, pre { background-color: #535353; color: #ffffff; }\n     .c-mrkdwn__pre, .c-mrkdwn__quote, pre { background: #535353 !important; background-color: #535353 !important; }\n     #client_body:not(.onboarding):not(.feature_global_nav_layout):before {display: none;}\n     `\n     $("<style></style>").appendTo("head").html(css + overrides);\n   }\n })});\n//darkmode END' >> /Applications/Slack.app/Contents/Resources/app.asar.unpacked/src/static/ssb-interop.js

edit: Implemented Wayne's jsdelivr modification, used absolute path to ssb-interop.js in sed command

Collapse
 
fynn_it profile image
Fynn

I love this community