Tweak diff colours

[danfo]

I spent some time cleaning up how a diff displays in Nord. Let me know what you think.

Before:

After:

[arcticicestudio]

Hi @danfo 👋, thanks for your contribution 👍
Sorry for the long delay, I've been really busy with my job, real life and Nord's, finally launched, official website and documentation.

The diff colors have bothered me for a long time even if I don't use VS Code for diffs/patches.
Your changes are looking better, but would also change nord14 to a color that is not part of Nord's color palettes.

Removing the borders are definitely a change that'll be merged with this PR, but the background colors must be adjusted again and I think it's time to rethink the design for added/new diff content.
I've played around with nord14 and even with a opacity of 15% it still doesn't look quite readable to me and also makes it looks a bit dirty like mossy water.

Therefore I tested nord9 with a opacity of 20% and it looks way clearer while still provides the necessary emphasis to make it easy which code blocks have been added. I also keeps the visual distinction between selections / marked content like shown on the screenshot.

Therefore I think we should go this way instead of fiddling around with nord14's opacity and saturation (it's the second time the diff color gets adjusted).

I've added some review comments and would like to hear your opinion about this solution 😄

[danfo]

You're welcome @arcticicestudio. Thanks for Nord, it's a joy to use every day!

Nice site. It does help for understanding the big picture, very clear now how it doesn't make sense to accept colour palette tweaks within one theme 🙂

Added lines colour

I would like to help get this right. I think added lines on a diff are clearest to see when there is some hint of green. There's something primitive and natural going on here,

- removed 🔥
+ added 🌱 

And it can still be subtle and fresh... How about some opacity of nord7?

Comment colour

I really like the comment colour and subtlety, and didn't intend to change the visible colour. The problem is, diffs are sections of a lighter background colour. Let me illustrate,

We can solve this by not flattening the opacity into an RGB hex code; I think comments look best when that subtle opacity is preserved in RGBA.

Maybe we can match the existing flattened comment hex code with a low opacity Snow Storm?

[arcticicestudio]

@danfo Can you please test the theme using the develop branch again and check if this is still the case for inline changes? I've merged #118 that increases the comment color brightness by default so maybe this will also improve the readability when using nord9 as diff color.

Also @octref has reported this diff problem and created a improvement issue for VS Code based on my thinking aloud comment about how this could be solved 😄
If using nord9 still doesn't solve completely the problem I think it might be a good solution to merge the changes anyway and adapt to the suggested solution when the improvement might be implemented in VS Code.

[danfo]

Yep readability is OK with nord9. Hopefully soon the situation will be that a green such as nord7 will work as a diff background colour.

[arcticicestudio]

Thanks again for your contribution, I'll merge this now and we'll see if the VS Code team also sees the problem. At the moment it seems like they don't want to change since they see the responsibility by the theme creator to "pick good colors", but they don't know the large amount of time authors spend to adjust these colors and currently don't see the fact that it would the complete ambience of a theme to change all colors only to have a nice diff view.
Anyway, I think this solution is currently the best for Nord to keep the balance between the theme ambience and readability.