Improving the Solarized Dark theme (Issue #3887)

I have been working on fixing this issue. I made a few changes to the colours in solarizedDark.ts ( you can see what it looks like in the desktop app in the last screenshots I posted here ).

I realized that the changes I made would also affect the mobile app so I built and ran it on Android. This is what it looked like:

Essentially, the initial issue is also present in the mobile app in the sense that there are parts of the UI that do not follow the theme.

I was thinking that I could make further changes to improve the solarized dark theme for the mobile app as well, without negatively affecting the other themes. I'm not sure if that would be considered a loss of focus though.

I saw that headerBackgroundColor is set in theme.ts in the case that is it not defined (which results in the grey section header background colour seen in the picture). I propose adding it as an optional property to the Theme interface and I would set a colour for it in the Solarized Dark theme file.

As for the button colours, jurf mentioned in the issue that brightly coloured buttons do not fit well with the theme and I do agree. The colour of the buttons in the configuration screen seem to be react-native defaults while the colours of the floating action buttons are set but static. I would do something similar to the change I would make for the headers and create optional fields that would be used for the button colours if they are set.

I would appreciate some advice/feedback on this.

Looks good so far!

For the first PR, limit your changes to exactly what can done by editing solarizedDark.ts.

After you make that PR we can discuss extending the mobile theming.

Okay, thanks. I'll be back then.

So, about extending the mobile theming, what do you think?

I think it's a good idea, but we're now in the proposal period of GSoC and I feel like it may be too large of a task. It would be better to find a recommended issue and work on that.

Alright, thanks.