Better Crowdin Darkmode - Building an GUI
Better Crowdin Darkmode
Publisher - Jestemkioskiem
You can install the addon directly from the Chrome App Store!
If the addon didn't work, try reloading the page after enabling Darkmode on Crowdin.
The initial, basic 0.1.0 version of the extension is now available for Firefox browsers through github and the firefox addon store (which I sadly can't link right now because the website is down...).
The port skipped the 0.2.1 version, since it isn't fundamental to the app's mission. Furthermore, the 0.3.0 version will introduce just as many problems, and it'll be easier to tackle them all at once.
A pop up has joined the battle!
This time, there's an UI!
This basic UI opens up when you click on the logo, and in the next version will refresh the CSS changes in case your page loaded too fast for the CSS to take effect.
When it opens up, you're presented with a color picker that allows you to choose any color you want for the text. In 0.3.0, this color picker will have the option to change all of the editor-related colors.
There's a small sneak peak of what it looks like!
Unfortunately the tips I've received from @amosbastian were not applied to this version of the app yet, as 0.3.0 was already in development by the time I've received them. Because of that, you'll see the same artifacts in 0.2.1, but won't see them in future releases.
What's in the (new) code:
This dictionary contains 3 crucial files:
popup.css that make the GUI work! While popup.js focuses mostly on altering the HTML and CSS of the popup itself, it does also communicate with
script.js - the content file - to alter the CSS of the crowdin page itself.
script.js file went through a bunch of changes to allow for communication between itself and
popup.js. For now, only the text color is editable (which will change in 0.3.0).
This dictionary contains third party open source scripts that make my life a whole lot easier.
- Jquery (3.3.1)
I wish to maintain Firefox support for every future version. This is unfortunately not an easy port because Mozilla, for whatever reason, fires iframe onload events immediately after the Document Object Model is loaded. There's currently no workaround (other than delaying the app's functionality by a few seconds) to this issue in the newest version of the browser.
It is also, unfortunately, different in the content - popup communication, so that will need to change a lot as well.
GUI & Customizability
I wish to further improve on the GUI & customizability of the app.
Extend out of the Editor
Even though Crowdin has a darkmode for the editor (although a terrible one), they don't offer such thing for the main website. Because of that, I'll be looking to introduce the darkmode to as many parts of Crowdin as possible.
How to contribute?
Submit all the Issues & Pull Requests directly to the project repository.