Changed order of properties and added About

Issue: DEB-159

src/definition/index.js

@@ -18,6 +18,9 @@ const definition = {
       },
       uses: 'data'
     },
+    sorting: {
+      uses: 'sorting'
+    },
     settings: {
       items: {
         ConceptSemaphores: conceptSemaphores,
@@ -28,8 +31,25 @@ const definition = {
       },
       uses: 'settings'
     },
-    sorting: {
-      uses: 'sorting'
+    about: {
+      component: 'items',
+      label: 'About',
+      items: {
+        header: {
+          label: 'P&L pivot',
+          style: 'header',
+          component: 'text'
+        },
+        paragraph1: {
+          label: `P&L pivot is a Qlik Sense extension which allows you to display Profit & Loss
+            reporting with color and font customizations.`,
+          component: 'text'
+        },
+        paragraph2: {
+          label: 'P&L pivot is based upon an extension created by Ivan Felipe Asensio.',
+          component: 'text'
+        }
+      }
     }
   },
   type: 'items'

src/definition/metric-semaphores.js

@@ -39,6 +39,7 @@ const metricSemaphores = {
       label: 'Critic Color Fill',
       type: 'object',
       component: 'color-picker',
+      dualOutput: true,
       defaultValue: {
         index: 8,
         color: '#f93f17'
@@ -49,6 +50,7 @@ const metricSemaphores = {
       label: 'Critic Color Text',
       type: 'object',
       component: 'color-picker',
+      dualOutput: true,
       defaultValue: {
         index: 11,
         color: '#ffffff'
@@ -65,6 +67,7 @@ const metricSemaphores = {
       label: 'Medium Color Fill',
       type: 'object',
       component: 'color-picker',
+      dualOutput: true,
       defaultValue: {
         index: 9,
         color: '#ffcf02'
@@ -75,6 +78,7 @@ const metricSemaphores = {
       label: 'Medium Color Text',
       type: 'object',
       component: 'color-picker',
+      dualOutput: true,
       defaultValue: {
         index: 12,
         color: '#000000'
@@ -85,6 +89,7 @@ const metricSemaphores = {
       label: 'Success Color Fill',
       type: 'object',
       component: 'color-picker',
+      dualOutput: true,
       defaultValue: {
         index: 10,
         color: '#276e27'
@@ -95,6 +100,7 @@ const metricSemaphores = {
       label: 'Success Color Text',
       type: 'object',
       component: 'color-picker',
+      dualOutput: true,
       defaultValue: {
         index: 11,
         color: '#ffffff'