Added Light and Dark Grey Main and Secondary themes as per Request #2600

src/renderer/helpers/colors.js

@@ -15,6 +15,8 @@ export const colors = [
   { name: 'Amber', value: '#FFAB00' },
   { name: 'Orange', value: '#FF6D00' },
   { name: 'DeepOrange', value: '#DD2C00' },
+  { name: 'LightGray', value: '#B1B1B1' },
+  { name: 'DarkGray', value: '#696969' },
   { name: 'DraculaCyan', value: '#8BE9FD' },
   { name: 'DraculaGreen', value: '#50FA7B' },
   { name: 'DraculaOrange', value: '#FFB86C' },

src/renderer/themes.css

@@ -286,6 +286,22 @@ it can be safely elided. This looks quite pleasant on this theme. */
   --logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");
   --logo-text-bar-color: url("../../_icons/textBlackSmall.png");
 }
+.mainLightGray {
+  --text-with-main-color: #000000;
+  --logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");
+  --logo-text-bar-color: url("../../_icons/textBlackSmall.png");
+  --primary-color: #B1B1B1;
+  --primary-color-hover: #848482;
+  --primary-color-active: #7E7E7E;
+}
+.mainDarkGray {
+  --text-with-main-color: #FFFFFF;
+  --logo-icon-bar-color: url("../../_icons/iconWhiteSmall.png");
+  --logo-text-bar-color: url("../../_icons/textWhiteSmall.png");
+  --primary-color: #696969;
+  --primary-color-hover: #555555;
+  --primary-color-active: #4E4E4E;
+}
 
 .mainRed {
   --primary-color: #f44336;
@@ -566,6 +582,26 @@ it can be safely elided. This looks quite pleasant on this theme. */
 .secDeepOrange {
   --text-with-accent-color: #000000;
 }
+.secLightGray {
+  --text-with-accent-color: #000000;
+  --logo-icon-bar-color: url("../../_icons/iconBlackSmall.png");
+  --logo-text-bar-color: url("../../_icons/textBlackSmall.png");
+  --accent-color: #B1B1B1;
+  --accent-color-hover: #848482;
+  --accent-color-active: #7E7E7E;
+  --accent-color-light: #cfcfcf;
+  --accent-color-visited: #797979;
+}
+.secDarkGray {
+  --text-with-accent-color: #FFFFFF;
+  --logo-icon-bar-color: url("../../_icons/iconWhiteSmall.png");
+  --logo-text-bar-color: url("../../_icons/textWhiteSmall.png");
+  --accent-color: #696969;
+  --accent-color-hover: #555555;
+  --accent-color-active: #4E4E4E;
+  --accent-color-light: #A5A5A5;
+  --accent-color-visited: #444444;
+}
 
 .secRed {
   --accent-color: #f44336;

static/locales/en-US.yaml

@@ -315,6 +315,8 @@ Settings:
       Amber: Amber
       Orange: Orange
       Deep Orange: Deep Orange
+      Light Gray: Light Gray
+      Dark Gray: Dark Gray
       Dracula Cyan: Dracula Cyan
       Dracula Green: Dracula Green
       Dracula Orange: Dracula Orange