Skip to content
This repository has been archived by the owner on Jul 8, 2022. It is now read-only.

No longer works in 3.3.3 #74

Open
riw777 opened this issue Nov 28, 2018 · 17 comments
Open

No longer works in 3.3.3 #74

riw777 opened this issue Nov 28, 2018 · 17 comments

Comments

@riw777
Copy link

riw777 commented Nov 28, 2018

Looks like the background is back to white on 3.3.3 version of the desktop client. Any thoughts on how to make it dark again?

@Nick-vr
Copy link

Nick-vr commented Nov 28, 2018

same here

@NilsJPWerner
Copy link

Use the css url linked to in this comment: https://github.com/widget-/slack-black-theme/issues/62#issuecomment-410256441

@wllmcnn
Copy link

wllmcnn commented Dec 3, 2018

@NilsJPWerner I used the file from that comment and I'm also still seeing white.
Slack 3.3.3 64-bit on Windows 10 r1803.

@zerodivisionerr
Copy link

Use the css url linked to in this comment: #62 (comment)

Thanks! I worked at hacking this on my own for way too long before finding this!

@jtorjo
Copy link

jtorjo commented Dec 12, 2018

@NilsJPWerner I'm still seeing white, same as @wllmcnn
On slack 3.3.3 64bit on Win10 r1803

@ghost
Copy link

ghost commented Dec 19, 2018

@jtorjo for me it's okay on Slack 3.3.3 on MacOS Mojave

@andersonjohnf
Copy link

andersonjohnf commented Jan 8, 2019

@NilsJPWerner I'm still seeing white, same as @wllmcnn
On slack 3.3.3 64bit on Win10 r1803

@jtorjo Make sure you have also updated ssb-interop.js

@juliano-felipe
Copy link

juliano-felipe commented Jan 9, 2019

For me it doesn`t work either.

I updated the ss-interop.js and index.js files, and created the custom.css file under /usr/lib/slack/resources/app.asar.unpacked/src/static.

I`m using LMDE3 (Linux Mint based on Debian 9).

@generalguy41
Copy link

For everyone having issue with the white background on 3.3.3 for Windows 10, I found a way to edit it.

Add this inside the customCustomCSS underneath the :root brackets (both files still):


  /* Message background */

  .p-message_pane .c-message_list.c-virtual_list--scrollbar>.c-scrollbar__hider:before, .p-message_pane .c-message_list:not(.c-virtual_list--scrollbar):before {
    background: var(--background-elevated)
  }
  .c-scrollbar__bar {
    background: rgba(255,255,255,.15);
  }
  .c-scrollbar__hider {
    background: transparent !important;
  }

  /* Message text color */

  .p-message_pane__foreword__description, .p-message_pane__limited_history_alert {
    color: var(--text-bright);
  }
  .c-message--focus:not(.c-message--highlight):not(.c-message--standalone):not(.c-message--pinned):not(.c-message--ephemeral):not(.c-message--custom_response):not(.c-message--starred):not(.c-message--sli_highlight), .c-message--hover:not(.c-message--highlight):not(.c-message--standalone):not(.c-message--pinned):not(.c-message--ephemeral):not(.c-message--custom_response):not(.c-message--starred):not(.c-message--sli_highlight), .c-message:hover:not(.c-message--highlight):not(.c-message--standalone):not(.c-message--pinned):not(.c-message--ephemeral):not(.c-message--custom_response):not(.c-message--starred):not(.c-message--sli_highlight) {
    background-color: var(--background-hover) !important;
  }
  .c-message__body {
    color: var(--text);
  }
  .c-message__sender_link {
    color: var(--text-bright) !important;
  }
  .ql-placeholder {
    color: unset !important;
  }

To enable developer mode follow the instructions here, and you can edit the colours the way you see fit. I only tested it with a couple of dark themes, but it seemed to work. There may still be a bit more work that needs to be added.

@amywtlin
Copy link

@generalguy41 it works! thanks for the fix, will be tweaking the style to my liking based on your patch.

@VladNistor86
Copy link

VladNistor86 commented Mar 18, 2019

After the update to 3.3.8 the current solution doesn't work anymore.

@webbydevvy
Copy link

Worked for a time, but white background since the update to 3.4.2.

@knwpsk
Copy link

knwpsk commented Jun 25, 2019

Mine was just updated to 3.4.3 on June 24 2019, and it appears this is broken again. It has reverted to factory color scheme. I tried to reinstall this hack, and it doesn't have any effect.
I hope I'm missing something??
I noted the instruction that the custom js needs to be copied into two files (ssb-interop and index.js), and I restarted.

The sidebar and title bar change to dark; but the main message window is still default colors w/ white background.

@VladNistor86
Copy link

After you make the adjustment in the ssb-interop file, you have to restart the application + refresh it (shortcut CTRL+R). You have to do it after every update.

@knwpsk
Copy link

knwpsk commented Jun 26, 2019

Vlad thanks, I did that several times, it didn't work. I can tell that the hack does have some effect -- the sidebar changes color. But the main text window is still white background.

Anything else to try?

@VladNistor86
Copy link

I just added the following snippet at the end of the ssb-interop.js file (under slack last version folder):

document.addEventListener('DOMContentLoaded', function() { $.ajax({ url: 'https://raw.githubusercontent.com/laCour/slack-night-mode/master/css/raw/black.css', success: function(css) { $("<style></style>").appendTo('head').html(css); } }); });

After I hit CTRL+R the chat background gets dark.

@knwpsk
Copy link

knwpsk commented Jun 26, 2019

Vlad, BAM! You are the master.
What does this do, and why does it fix it? (You're under no obligation to answer that -- I'm capable of reading/learning the code myself, I just don't have the time for it.)

Thanks!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests