From e3fafc85e6446f00607d945064308a84c6f74ffb Mon Sep 17 00:00:00 2001
From: Jan Oberhauser <jan.oberhauser@gmail.com>
Date: Fri, 26 Jul 2019 11:41:08 +0200
Subject: [PATCH] :zap: Use color for icons in node creator and update colors

---
 packages/editor-ui/src/components/NodeCreateItem.vue | 11 +++++++----
 packages/nodes-base/nodes/EmailSend.node.ts          |  2 +-
 packages/nodes-base/nodes/FunctionItem.node.ts       |  2 +-
 packages/nodes-base/nodes/Mailgun.node.ts            |  2 +-
 packages/nodes-base/nodes/Merge.node.ts              |  2 +-
 packages/nodes-base/nodes/ReadBinaryFile.node.ts     |  2 +-
 packages/nodes-base/nodes/ReadBinaryFiles.node.ts    |  2 +-
 packages/nodes-base/nodes/ReadFileFromUrl.node.ts    |  2 +-
 packages/nodes-base/nodes/Start.node.ts              |  2 +-
 9 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/packages/editor-ui/src/components/NodeCreateItem.vue b/packages/editor-ui/src/components/NodeCreateItem.vue
index 311d5b52b0..24d08bab45 100644
--- a/packages/editor-ui/src/components/NodeCreateItem.vue
+++ b/packages/editor-ui/src/components/NodeCreateItem.vue
@@ -1,6 +1,6 @@
 <template>
 	<div class="node-item clickable" :class="{active: active}" @click="nodeTypeSelected(nodeType)">
-		<NodeIcon class="node-icon" :nodeType="nodeType"/>
+		<NodeIcon class="node-icon" :nodeType="nodeType" :style="nodeIconStyle" />
 		<div class="name">
 			{{nodeType.displayName}}
 		</div>
@@ -27,9 +27,12 @@ export default Vue.extend({
 		'filter',
 		'nodeType',
 	],
-	data () {
-		return {
-		};
+	computed: {
+		nodeIconStyle (): object {
+			return {
+				color: this.nodeType.defaults.color,
+			};
+		},
 	},
 	methods: {
 		nodeTypeSelected (nodeType: INodeTypeDescription) {
diff --git a/packages/nodes-base/nodes/EmailSend.node.ts b/packages/nodes-base/nodes/EmailSend.node.ts
index 1418fa2ba5..b5cebaae05 100644
--- a/packages/nodes-base/nodes/EmailSend.node.ts
+++ b/packages/nodes-base/nodes/EmailSend.node.ts
@@ -21,7 +21,7 @@ export class EmailSend implements INodeType {
 		description: 'Sends an Email',
 		defaults: {
 			name: 'Send Email',
-			color: '#44DD22',
+			color: '#00bb88',
 		},
 		inputs: ['main'],
 		outputs: ['main'],
diff --git a/packages/nodes-base/nodes/FunctionItem.node.ts b/packages/nodes-base/nodes/FunctionItem.node.ts
index 8bf0f046db..694bbc36f3 100644
--- a/packages/nodes-base/nodes/FunctionItem.node.ts
+++ b/packages/nodes-base/nodes/FunctionItem.node.ts
@@ -19,7 +19,7 @@ export class FunctionItem implements INodeType {
 		description: 'Run custom function code which gets executed once per item.',
 		defaults: {
 			name: 'FunctionItem',
-			color: '#FF9922',
+			color: '#ddbb33',
 		},
 		inputs: ['main'],
 		outputs: ['main'],
diff --git a/packages/nodes-base/nodes/Mailgun.node.ts b/packages/nodes-base/nodes/Mailgun.node.ts
index 30c19ac982..bf2f514398 100644
--- a/packages/nodes-base/nodes/Mailgun.node.ts
+++ b/packages/nodes-base/nodes/Mailgun.node.ts
@@ -20,7 +20,7 @@ export class Mailgun implements INodeType {
 		description: 'Sends an Email via Mailgun',
 		defaults: {
 			name: 'Mailgun',
-			color: '#44DD22',
+			color: '#c02428',
 		},
 		inputs: ['main'],
 		outputs: ['main'],
diff --git a/packages/nodes-base/nodes/Merge.node.ts b/packages/nodes-base/nodes/Merge.node.ts
index 5a63b5faca..bc729ebd7e 100644
--- a/packages/nodes-base/nodes/Merge.node.ts
+++ b/packages/nodes-base/nodes/Merge.node.ts
@@ -17,7 +17,7 @@ export class Merge implements INodeType {
 		description: 'Merges data of multiple streams once data of both is available',
 		defaults: {
 			name: 'Merge',
-			color: '#00cc22',
+			color: '#00bbcc',
 		},
 		inputs: ['main', 'main'],
 		outputs: ['main'],
diff --git a/packages/nodes-base/nodes/ReadBinaryFile.node.ts b/packages/nodes-base/nodes/ReadBinaryFile.node.ts
index 6074657621..ced2a60b1e 100644
--- a/packages/nodes-base/nodes/ReadBinaryFile.node.ts
+++ b/packages/nodes-base/nodes/ReadBinaryFile.node.ts
@@ -23,7 +23,7 @@ export class ReadBinaryFile implements INodeType {
 		description: 'Reads a binary file from disk',
 		defaults: {
 			name: 'Read Binary File',
-			color: '#22CC33',
+			color: '#449922',
 		},
 		inputs: ['main'],
 		outputs: ['main'],
diff --git a/packages/nodes-base/nodes/ReadBinaryFiles.node.ts b/packages/nodes-base/nodes/ReadBinaryFiles.node.ts
index b509c818d7..072619f2f4 100644
--- a/packages/nodes-base/nodes/ReadBinaryFiles.node.ts
+++ b/packages/nodes-base/nodes/ReadBinaryFiles.node.ts
@@ -25,7 +25,7 @@ export class ReadBinaryFiles implements INodeType {
 		description: 'Reads binary files from disk',
 		defaults: {
 			name: 'Read Binary Files',
-			color: '#22CC33',
+			color: '#44AA44',
 		},
 		inputs: ['main'],
 		outputs: ['main'],
diff --git a/packages/nodes-base/nodes/ReadFileFromUrl.node.ts b/packages/nodes-base/nodes/ReadFileFromUrl.node.ts
index 9ce771276d..3d31c56d34 100644
--- a/packages/nodes-base/nodes/ReadFileFromUrl.node.ts
+++ b/packages/nodes-base/nodes/ReadFileFromUrl.node.ts
@@ -17,7 +17,7 @@ export class ReadFileFromUrl implements INodeType {
 		description: 'Reads a file from an URL',
 		defaults: {
 			name: 'Read File URL',
-			color: '#995533',
+			color: '#119955',
 		},
 		inputs: ['main'],
 		outputs: ['main'],
diff --git a/packages/nodes-base/nodes/Start.node.ts b/packages/nodes-base/nodes/Start.node.ts
index 20b0133c8a..81e01892c5 100644
--- a/packages/nodes-base/nodes/Start.node.ts
+++ b/packages/nodes-base/nodes/Start.node.ts
@@ -17,7 +17,7 @@ export class Start implements INodeType {
 		maxNodes: 1,
 		defaults: {
 			name: 'Start',
-			color: '#553399',
+			color: '#00e000',
 		},
 		inputs: [],
 		outputs: ['main'],