uBlock Origin Dark Theme is broken (Here's the fix)

[DrWhoCares]

Yeah so this has been an issue for ages, like, well over a year.
Anyway, I decided to spend some time fixing it today. Posting the results here since there are no maintainers for this, and the project has been indefinitely shelved. Since I suspect most people will come to issues rather than pull requests, here it is.
Someone can feel free to take this and edit it to make it better and make a pull request.

In your userContent.css, at the top there's the listing of all of the colors.
At the bottom of the colors, right before --dummy-variable-for-updater-scripts add this:

  --link-ink: var(--accent-1)!important; /* The text color of the links on the About page */
  --ink-20: var(--grey-40)!important; /* The color of the checkboxes on Filters lists page */
  --ink-90: var(--blue-40)!important; /* The hover color of most icons on the Filter lists page */
  --default-surface: var(--grey-70)!important; /* The top bar background color behind the tabs in the options */
  --fieldset-header-ink: var(--grey-20)!important; /* The top bar background color of the bar that contains Apply Changes and such on the Filter lists page */
  --fg-0-50: var(--blue-50)!important; /* The color of most of the icons on the Filter lists page, also some text */
  --fg-icon-info-lvl-1-dimmed: var(--blue-50)!important; /* The color of the info icons on the Filter lists page */
  --fg-icon-info-lvl-1: var(--blue-40)!important; /* The hover color of the info icons on the Filter lists page */
  --light-gray-30: var(--tone-6)!important; /* The background color of the buttons and the panels of the addon's toolbar popup */

Then also do a Ctrl + F search for uBlock and you should find the uBlock styling section. At the top of it, add this:

span.counts, /* The text of how many filters are used for each list on the Filter lists page */
.geCount { /* The text for how many lists are used in a given list category on the Filter lists page */
  color:var(--grey-50)!important;
}

Finally, (this one is optional) do a Ctrl + F search for #panes, or just scroll down slightly and you should find this:

#panes,
body,
body[dir=ltr] #panes > div {
  background: var(--tone-7)!important;
  color: var(--tone-3)!important
}

You can change color: var(--tone-3)!important to be something different if you want the text a different color. Such as --tone-1 to make it brighter.
End result should be something like this:

Feel free to tweak the colors as you see fit. I may tweak them further later for personal preferences, but for now this'll have to do.

To explain how I did this, note that I have almost no idea what I'm doing, and just kinda brute forced it.
I opened up the settings page of uBlock Origin, then I went into the Inspector and took a look at elements, like the icons and such. If you scroll down in the inspector, eventually you'll start finding other random colors. I simply matched the colors to what I saw on screen, edited them and saw what changed. This isn't very ideal, as most of these changes are widespread, editing a lot of elements indiscriminately by changing the color variable's value, rather than changing the elements, or applying it to specific classes and such. I wasn't able to figure out how to see the HTML of the addon's toolbar popup window, so I didn't go that route.