Fix dark diff background colors (#3065)

Summary:
Bug fix. Currenty Flipper provides incorrect red and green diff colors in Dark theme, this PR fixes the issue. Light theme colors are the same.

Closes https://github.com/facebook/flipper/issues/3011

## Changelog

Color theme fix: make diff background colors be defined in theme LESS files

Pull Request resolved: https://github.com/facebook/flipper/pull/3065

Test Plan:
I used [redux-debugger](https://github.com/jk-gan/flipper-plugin-redux-debugger) plugin to test this as this is what I actually use for debugging Redux in React Native projects with Flipper. Here's a [React Native app](https://github.com/3rdp/flipper-redux-debugger-app) that I put together for testing purposes.

Light theme:
![lime2 light](https://user-images.githubusercontent.com/8898635/141799686-8b94655f-2501-46f9-9b28-d9ba8aeee222.png)

Dark theme:
![lime2](https://user-images.githubusercontent.com/8898635/141799710-fbd008a5-28cc-46f3-abf7-6b90fd85facb.png)

Reviewed By: mweststrate

Differential Revision: D32529276

Pulled By: passy

fbshipit-source-id: 3d11edaf1112444bb106521b6b30db4a4c2b8202

desktop/flipper-plugin/src/ui/theme.tsx

@@ -57,8 +57,8 @@ export const theme = {
     colorValue: antColors.cyan[5],
     booleanValue: antColors.magenta[5],
     numberValue: antColors.blue[5],
-    diffAddedBackground: antColors.lime[1],
+    diffAddedBackground: 'var(--flipper-diff-added-background)',
-    diffRemovedBackground: antColors.volcano[1],
+    diffRemovedBackground: 'var(--flipper-diff-removed-background)',
   },
 } as const;
 

desktop/themes/base.less

@@ -55,5 +55,7 @@
   --flipper-button-default-background: @button-default-background;
   --flipper-background-transparent-hover: @background-transparent-hover;
   --flipper-divider-color: @divider-color;
+  --flipper-diff-added-background: @diff-added-background;
+  --flipper-diff-removed-background: @diff-removed-background;
   --flipper-border-radius: @border-radius-base;
 }

desktop/themes/dark.less

@@ -47,6 +47,10 @@
 // Divider color
 @divider-color: #181818; // white 10%
 
+// Semantic colors: Diff
+@diff-added-background: @lime-2;
+@diff-removed-background: @volcano-2;
+
 ::-webkit-scrollbar { width: 8px; height: 8px; }
 ::-webkit-scrollbar-track-piece { background-color: transparent; }
 ::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, 0.5); border-radius: 3px;}

desktop/themes/light.less

@@ -46,3 +46,7 @@
 
 // Divider color
 @divider-color: #ececec; // black 10%
+
+// Semantic colors: Diff
+@diff-added-background: @lime-2;
+@diff-removed-background: @volcano-2;