Rachniotov/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Introduction


So I used Mongodb Compass for a little time a few months ago and then i switched to another mongo client gui for the sole reason, Darkmode.
That mongo client was good but recently it became paid. I then switched back to Compass but my eyes couldnt take it 😩
Then I spent some time researching what could I do to make compass darker and easier to read and I found this npm package for the Darkreader chrome plugin.
I knew that compass was made in Electron as it had .asar files in its source, that means I could easily implemt that npm package into the Electron app.
Here is the result!

How to


make sure you have latest NodeJS and NPM installed on your machine

The following steps would be for linux but replicating it on windows would be easy too


First locate the directory where MongoDb Compass is installed, in my case it is /usr/lib/mongodb-compass, cd into the resources directory


run npx asar extract app.asar dest_dir


Add a new JavaScript file in dest_dir/src/app (dest_dir/build for MacOS) called darkreader.js (you change the name too) and paste the contents of this file inside it.
append these lines of code at the very end of the file:
DarkReader.enable({
    brightness: 100,
    contrast: 90,
    sepia: 20
});
you can ofc play with these values to get the taste you want.


find an index.html in the same directory and add the following lines just before </body>:
<script src="darkreader.js" charset="UTF-8" async></script>


save all the changes then cd into dest_dir run npx asar pack . app.asar, this will pack the code back into an .asar file


Backup the app.asar inside /usr/lib/mongodb-compass/resources and then run mv app.asar /usr/lib/mongodb-compass/resources


Restart Compass and enjoy the theme :)