From 14aa58870150e10cf5021e6f6956053e11ed4429 Mon Sep 17 00:00:00 2001 From: Elias Meire Date: Wed, 15 May 2024 11:25:36 +0200 Subject: [PATCH 01/20] Add dark support for dark mode icons and colors --- .../shared/createVectorStoreNode.ts | 3 +- packages/core/src/DirectoryLoader.ts | 31 ++- .../design-system/src/css/_tokens.dark.scss | 7 +- packages/design-system/src/css/_tokens.scss | 7 +- .../src/components/NDVFloatingNodes.vue | 2 +- .../editor-ui/src/components/NodeIcon.vue | 202 +++++++++--------- .../editor-ui/src/utils/nodeTypesUtils.ts | 74 +++++-- .../credentials/AlienVaultApi.credentials.ts | 3 +- .../Auth0ManagementApi.credentials.ts | 3 +- .../nodes-base/credentials/Aws.credentials.ts | 3 +- .../credentials/CarbonBlackApi.credentials.ts | 4 +- .../credentials/CiscoMerakiApi.credentials.ts | 4 +- .../CiscoSecureEndpointApi.credentials.ts | 3 +- .../CiscoUmbrellaApi.credentials.ts | 3 +- .../CiscoWebexOAuth2Api.credentials.ts | 4 +- .../CrowdStrikeOAuth2Api.credentials.ts | 3 +- .../credentials/F5BigIpApi.credentials.ts | 4 +- .../credentials/FortiGateApi.credentials.ts | 4 +- .../credentials/GoogleApi.credentials.ts | 3 +- .../GoogleOAuth2Api.credentials.ts | 4 +- .../credentials/HttpBasicAuth.credentials.ts | 4 +- .../credentials/HttpCustomAuth.credentials.ts | 4 +- .../credentials/HttpDigestAuth.credentials.ts | 4 +- .../credentials/HttpHeaderAuth.credentials.ts | 4 +- .../credentials/HttpQueryAuth.credentials.ts | 4 +- .../credentials/HttpSslAuth.credentials.ts | 4 +- .../HybridAnalysisApi.credentials.ts | 4 +- .../credentials/ImpervaWafApi.credentials.ts | 4 +- .../credentials/JwtAuth.credentials.ts | 4 +- .../credentials/KibanaApi.credentials.ts | 3 +- .../MicrosoftEntraOAuth2Api.credentials.ts | 4 +- .../MicrosoftOAuth2Api.credentials.ts | 4 +- .../credentials/MistApi.credentials.ts | 3 +- .../credentials/OktaApi.credentials.ts | 3 +- .../credentials/OpenCTIApi.credentials.ts | 4 +- .../credentials/QRadarApi.credentials.ts | 4 +- .../credentials/QualysApi.credentials.ts | 2 +- .../RecordedFutureApi.credentials.ts | 4 +- .../credentials/SekoiaApi.credentials.ts | 4 +- .../credentials/ShufflerApi.credentials.ts | 3 +- .../credentials/TrellixEpoApi.credentials.ts | 4 +- .../credentials/TwakeServerApi.credentials.ts | 4 +- .../credentials/VirusTotalApi.credentials.ts | 3 +- .../YouTubeOAuth2Api.credentials.ts | 4 +- .../credentials/ZscalerZiaApi.credentials.ts | 3 +- .../Sheet/v2/actions/versionDescription.ts | 2 +- .../nodes-base/nodes/Set/v2/SetV2.node.ts | 2 +- packages/workflow/src/Interfaces.ts | 14 +- 48 files changed, 280 insertions(+), 201 deletions(-) diff --git a/packages/@n8n/nodes-langchain/nodes/vector_store/shared/createVectorStoreNode.ts b/packages/@n8n/nodes-langchain/nodes/vector_store/shared/createVectorStoreNode.ts index e9045bd107309..cc2b2a2ac6937 100644 --- a/packages/@n8n/nodes-langchain/nodes/vector_store/shared/createVectorStoreNode.ts +++ b/packages/@n8n/nodes-langchain/nodes/vector_store/shared/createVectorStoreNode.ts @@ -12,6 +12,7 @@ import type { INodeType, ILoadOptionsFunctions, INodeListSearchResult, + Icon, } from 'n8n-workflow'; import type { Embeddings } from '@langchain/core/embeddings'; import type { Document } from '@langchain/core/documents'; @@ -27,7 +28,7 @@ interface NodeMeta { name: string; description: string; docsUrl: string; - icon: string; + icon: Icon; credentials?: INodeCredentialDescription[]; } interface VectorStoreNodeConstructorArgs { diff --git a/packages/core/src/DirectoryLoader.ts b/packages/core/src/DirectoryLoader.ts index cd4de72cba54a..2e341c8bbe3fc 100644 --- a/packages/core/src/DirectoryLoader.ts +++ b/packages/core/src/DirectoryLoader.ts @@ -101,11 +101,11 @@ export abstract class DirectoryLoader { tempNode.description.name = fullNodeName; - this.fixIconPath(tempNode.description, filePath); + this.fixIconPaths(tempNode.description, filePath); if ('nodeVersions' in tempNode) { for (const versionNode of Object.values(tempNode.nodeVersions)) { - this.fixIconPath(versionNode.description, filePath); + this.fixIconPaths(versionNode.description, filePath); } for (const version of Object.values(tempNode.nodeVersions)) { @@ -169,7 +169,7 @@ export abstract class DirectoryLoader { // include the credential type in the predefined credentials (HTTP node) Object.assign(tempCredential, { toJSON }); - this.fixIconPath(tempCredential, filePath); + this.fixIconPaths(tempCredential, filePath); } catch (e) { if (e instanceof TypeError) { throw new ApplicationError( @@ -281,14 +281,29 @@ export abstract class DirectoryLoader { } } - private fixIconPath( + private getIconPath(icon: string, filePath: string) { + const iconPath = path.join(path.dirname(filePath), icon.replace('file:', '')); + const relativePath = path.relative(this.directory, iconPath); + return `icons/${this.packageName}/${relativePath}`; + } + + private fixIconPaths( obj: INodeTypeDescription | INodeTypeBaseDescription | ICredentialType, filePath: string, ) { - if (obj.icon?.startsWith('file:')) { - const iconPath = path.join(path.dirname(filePath), obj.icon.substring(5)); - const relativePath = path.relative(this.directory, iconPath); - obj.iconUrl = `icons/${this.packageName}/${relativePath}`; + const { icon } = obj; + if (!icon) return; + + if (typeof icon === 'string') { + if (icon.startsWith('file:')) { + obj.iconUrl = this.getIconPath(icon, filePath); + delete obj.icon; + } + } else if (icon.light.startsWith('file:') && icon.dark.startsWith('file:')) { + obj.iconUrl = { + light: this.getIconPath(icon.light, filePath), + dark: this.getIconPath(icon.dark, filePath), + }; delete obj.icon; } } diff --git a/packages/design-system/src/css/_tokens.dark.scss b/packages/design-system/src/css/_tokens.dark.scss index 3380015000585..f00ba8419cdfe 100644 --- a/packages/design-system/src/css/_tokens.dark.scss +++ b/packages/design-system/src/css/_tokens.dark.scss @@ -45,7 +45,7 @@ --color-canvas-background-l: 18%; --color-canvas-dot: var(--prim-gray-670); --color-canvas-read-only-line: var(--prim-gray-800); - --color-canvas-node-background: var(--prim-gray-40); + --color-canvas-node-background: var(--color-background-xlight); --color-canvas-node-pinned-border: var(--prim-color-secondary-tint-100); --color-canvas-selected: var(--prim-gray-0-alpha-025); --node-type-main-color: var(--prim-gray-420); @@ -72,6 +72,11 @@ --color-sticky-background-7: var(--prim-gray-740); --color-sticky-border-7: var(--prim-gray-670); + // NodeIcon + --color-node-icon-1: blue; + --color-node-icon-2: var(--prim-color-alt-b-shade-250); + --color-node-icon-3: var(--prim-color-alt-c-shade-150); + // Expressions, autocomplete, infobox --color-valid-resolvable-foreground: var(--prim-color-alt-a-tint-300); --color-valid-resolvable-background: var(--prim-color-alt-a-alpha-025); diff --git a/packages/design-system/src/css/_tokens.scss b/packages/design-system/src/css/_tokens.scss index ab3797781d3c7..6117a4c98d658 100644 --- a/packages/design-system/src/css/_tokens.scss +++ b/packages/design-system/src/css/_tokens.scss @@ -79,7 +79,7 @@ --color-canvas-background-l: 99%; --color-canvas-dot: var(--prim-gray-120); --color-canvas-read-only-line: var(--prim-gray-30); - --color-canvas-node-background: var(--prim-gray-0); + --color-canvas-node-background: var(--color-background-xlight); --color-canvas-node-pinned-border: var(--color-secondary); --color-canvas-selected: var(--prim-gray-70); --node-type-main-color: var(--prim-gray-490); @@ -106,6 +106,11 @@ --color-sticky-background-7: var(--prim-gray-10); --color-sticky-border-7: var(--prim-gray-120); + // NodeIcon + --color-node-icon-1: red; + --color-node-icon-2: var(--prim-color-alt-b-tint-150); + --color-node-icon-3: var(--prim-color-alt-c-tint-300); + // Expressions, autocomplete, infobox --color-valid-resolvable-foreground: var(--prim-color-alt-a); --color-valid-resolvable-background: var(--prim-color-alt-a-tint-500); diff --git a/packages/editor-ui/src/components/NDVFloatingNodes.vue b/packages/editor-ui/src/components/NDVFloatingNodes.vue index f7abf5f1e13ce..fd1aa2d054e58 100644 --- a/packages/editor-ui/src/components/NDVFloatingNodes.vue +++ b/packages/editor-ui/src/components/NDVFloatingNodes.vue @@ -121,7 +121,7 @@ const tooltipPositionMapper = { [FloatingNodePosition.top]: 'bottom', [FloatingNodePosition.right]: 'left', [FloatingNodePosition.left]: 'right', -}; +} as const; onMounted(() => { document.addEventListener('keydown', onKeyDown, true); diff --git a/packages/editor-ui/src/components/NodeIcon.vue b/packages/editor-ui/src/components/NodeIcon.vue index edab9b46888b4..0e7648f3984bb 100644 --- a/packages/editor-ui/src/components/NodeIcon.vue +++ b/packages/editor-ui/src/components/NodeIcon.vue @@ -1,6 +1,6 @@ - - + diff --git a/packages/editor-ui/src/utils/nodeTypesUtils.ts b/packages/editor-ui/src/utils/nodeTypesUtils.ts index bad9b9c371699..d8f2e2fdce6d3 100644 --- a/packages/editor-ui/src/utils/nodeTypesUtils.ts +++ b/packages/editor-ui/src/utils/nodeTypesUtils.ts @@ -1,33 +1,36 @@ import type { - INodeCredentialDescription, - IDataObject, - INodeExecutionData, - INodeProperties, - INodeTypeDescription, - NodeParameterValueType, - INodePropertyOptions, - INodePropertyCollection, - ResourceMapperField, -} from 'n8n-workflow'; + AppliedThemeOption, + INodeUi, + INodeUpdatePropertiesInformation, + ITemplatesNode, + IVersionNode, + NodeAuthenticationOption, +} from '@/Interface'; import { - MAIN_AUTH_FIELD_NAME, CORE_NODES_CATEGORY, + MAIN_AUTH_FIELD_NAME, + MAPPING_PARAMS, NON_ACTIVATABLE_TRIGGER_NODE_TYPES, TEMPLATES_NODES_FILTER, - MAPPING_PARAMS, } from '@/constants'; -import { useWorkflowsStore } from '@/stores/workflows.store'; +import { i18n as locale } from '@/plugins/i18n'; +import { useCredentialsStore } from '@/stores/credentials.store'; import { useNodeTypesStore } from '@/stores/nodeTypes.store'; -import type { - INodeUi, - ITemplatesNode, - NodeAuthenticationOption, - INodeUpdatePropertiesInformation, -} from '@/Interface'; +import { useWorkflowsStore } from '@/stores/workflows.store'; import { isResourceLocatorValue } from '@/utils/typeGuards'; import { isJsonKeyObject } from '@/utils/typesUtils'; -import { useCredentialsStore } from '@/stores/credentials.store'; -import { i18n as locale } from '@/plugins/i18n'; +import type { + IDataObject, + INodeCredentialDescription, + INodeExecutionData, + INodeProperties, + INodePropertyCollection, + INodePropertyOptions, + INodeTypeDescription, + NodeParameterValueType, + ResourceMapperField, + Themed, +} from 'n8n-workflow'; /* Constants and utility functions mainly used to get information about @@ -426,3 +429,32 @@ export const isMatchingField = ( } return false; }; + +export const getThemedValue = ( + value: Themed | undefined, + theme: AppliedThemeOption = 'light', +): T | null => { + if (!value) { + return null; + } + + if (typeof value === 'string') { + return value; + } + + return value[theme]; +}; + +export const getNodeIcon = ( + nodeType: INodeTypeDescription | IVersionNode, + theme: AppliedThemeOption = 'light', +): string | null => { + return getThemedValue(nodeType.icon, theme); +}; + +export const getNodeIconUrl = ( + nodeType: INodeTypeDescription | IVersionNode, + theme: AppliedThemeOption = 'light', +): string | null => { + return getThemedValue(nodeType.iconUrl, theme); +}; diff --git a/packages/nodes-base/credentials/AlienVaultApi.credentials.ts b/packages/nodes-base/credentials/AlienVaultApi.credentials.ts index aa5aeb238f669..9dad5720459ed 100644 --- a/packages/nodes-base/credentials/AlienVaultApi.credentials.ts +++ b/packages/nodes-base/credentials/AlienVaultApi.credentials.ts @@ -3,6 +3,7 @@ import type { ICredentialTestRequest, ICredentialType, INodeProperties, + Icon, } from 'n8n-workflow'; export class AlienVaultApi implements ICredentialType { @@ -12,7 +13,7 @@ export class AlienVaultApi implements ICredentialType { documentationUrl = 'alienvault'; - icon = 'file:icons/AlienVault.png'; + icon: Icon = 'file:icons/AlienVault.png'; httpRequestNode = { name: 'AlienVault', diff --git a/packages/nodes-base/credentials/Auth0ManagementApi.credentials.ts b/packages/nodes-base/credentials/Auth0ManagementApi.credentials.ts index c824b7188e0cb..8638a14774787 100644 --- a/packages/nodes-base/credentials/Auth0ManagementApi.credentials.ts +++ b/packages/nodes-base/credentials/Auth0ManagementApi.credentials.ts @@ -5,6 +5,7 @@ import type { ICredentialType, IHttpRequestHelper, INodeProperties, + Icon, } from 'n8n-workflow'; export class Auth0ManagementApi implements ICredentialType { @@ -14,7 +15,7 @@ export class Auth0ManagementApi implements ICredentialType { documentationUrl = 'auth0management'; - icon = 'file:icons/Auth0.svg'; + icon: Icon = 'file:icons/Auth0.svg'; httpRequestNode = { name: 'Auth0', diff --git a/packages/nodes-base/credentials/Aws.credentials.ts b/packages/nodes-base/credentials/Aws.credentials.ts index 3b52e47d23b3a..29711942edc2d 100644 --- a/packages/nodes-base/credentials/Aws.credentials.ts +++ b/packages/nodes-base/credentials/Aws.credentials.ts @@ -9,6 +9,7 @@ import type { IHttpRequestOptions, INodeProperties, IRequestOptions, + Icon, } from 'n8n-workflow'; import { isObjectEmpty } from 'n8n-workflow'; @@ -134,7 +135,7 @@ export class Aws implements ICredentialType { documentationUrl = 'aws'; - icon = 'file:icons/AWS.svg'; + icon: Icon = 'file:icons/AWS.svg'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/CarbonBlackApi.credentials.ts b/packages/nodes-base/credentials/CarbonBlackApi.credentials.ts index 48c5f5650ab3e..3f434b8b7de2a 100644 --- a/packages/nodes-base/credentials/CarbonBlackApi.credentials.ts +++ b/packages/nodes-base/credentials/CarbonBlackApi.credentials.ts @@ -1,11 +1,11 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class CarbonBlackApi implements ICredentialType { name = 'carbonBlackApi'; displayName = 'Carbon Black API'; - icon = 'file:icons/vmware.svg'; + icon: Icon = 'file:icons/vmware.svg'; documentationUrl = 'carbonblack'; diff --git a/packages/nodes-base/credentials/CiscoMerakiApi.credentials.ts b/packages/nodes-base/credentials/CiscoMerakiApi.credentials.ts index e02519b64df84..38bcd4a5ac60c 100644 --- a/packages/nodes-base/credentials/CiscoMerakiApi.credentials.ts +++ b/packages/nodes-base/credentials/CiscoMerakiApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class CiscoMerakiApi implements ICredentialType { name = 'ciscoMerakiApi'; @@ -7,7 +7,7 @@ export class CiscoMerakiApi implements ICredentialType { documentationUrl = 'ciscomeraki'; - icon = 'file:icons/Cisco.svg'; + icon: Icon = 'file:icons/Cisco.svg'; httpRequestNode = { name: 'Cisco Meraki', diff --git a/packages/nodes-base/credentials/CiscoSecureEndpointApi.credentials.ts b/packages/nodes-base/credentials/CiscoSecureEndpointApi.credentials.ts index 81a3a6fb70279..a1f447132907c 100644 --- a/packages/nodes-base/credentials/CiscoSecureEndpointApi.credentials.ts +++ b/packages/nodes-base/credentials/CiscoSecureEndpointApi.credentials.ts @@ -4,6 +4,7 @@ import type { ICredentialType, IHttpRequestOptions, INodeProperties, + Icon, } from 'n8n-workflow'; import axios from 'axios'; @@ -15,7 +16,7 @@ export class CiscoSecureEndpointApi implements ICredentialType { documentationUrl = 'ciscosecureendpoint'; - icon = 'file:icons/Cisco.svg'; + icon: Icon = 'file:icons/Cisco.svg'; httpRequestNode = { name: 'Cisco Secure Endpoint', diff --git a/packages/nodes-base/credentials/CiscoUmbrellaApi.credentials.ts b/packages/nodes-base/credentials/CiscoUmbrellaApi.credentials.ts index 2a3120ab4033e..2536da3282ccd 100644 --- a/packages/nodes-base/credentials/CiscoUmbrellaApi.credentials.ts +++ b/packages/nodes-base/credentials/CiscoUmbrellaApi.credentials.ts @@ -5,6 +5,7 @@ import type { ICredentialType, IHttpRequestHelper, INodeProperties, + Icon, } from 'n8n-workflow'; export class CiscoUmbrellaApi implements ICredentialType { @@ -14,7 +15,7 @@ export class CiscoUmbrellaApi implements ICredentialType { documentationUrl = 'ciscoumbrella'; - icon = 'file:icons/Cisco.svg'; + icon: Icon = 'file:icons/Cisco.svg'; httpRequestNode = { name: 'Cisco Umbrella', diff --git a/packages/nodes-base/credentials/CiscoWebexOAuth2Api.credentials.ts b/packages/nodes-base/credentials/CiscoWebexOAuth2Api.credentials.ts index 3784f7f6aa063..c2edc05e2f170 100644 --- a/packages/nodes-base/credentials/CiscoWebexOAuth2Api.credentials.ts +++ b/packages/nodes-base/credentials/CiscoWebexOAuth2Api.credentials.ts @@ -1,4 +1,4 @@ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class CiscoWebexOAuth2Api implements ICredentialType { name = 'ciscoWebexOAuth2Api'; @@ -9,7 +9,7 @@ export class CiscoWebexOAuth2Api implements ICredentialType { documentationUrl = 'ciscowebex'; - icon = 'file:icons/Cisco.svg'; + icon: Icon = 'file:icons/Cisco.svg'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/CrowdStrikeOAuth2Api.credentials.ts b/packages/nodes-base/credentials/CrowdStrikeOAuth2Api.credentials.ts index ccf20224477a2..c3b407f11df13 100644 --- a/packages/nodes-base/credentials/CrowdStrikeOAuth2Api.credentials.ts +++ b/packages/nodes-base/credentials/CrowdStrikeOAuth2Api.credentials.ts @@ -5,6 +5,7 @@ import type { ICredentialType, IHttpRequestHelper, INodeProperties, + Icon, } from 'n8n-workflow'; export class CrowdStrikeOAuth2Api implements ICredentialType { @@ -14,7 +15,7 @@ export class CrowdStrikeOAuth2Api implements ICredentialType { documentationUrl = 'crowdstrike'; - icon = 'file:icons/CrowdStrike.svg'; + icon: Icon = 'file:icons/CrowdStrike.svg'; httpRequestNode = { name: 'CrowdStrike', diff --git a/packages/nodes-base/credentials/F5BigIpApi.credentials.ts b/packages/nodes-base/credentials/F5BigIpApi.credentials.ts index a3204ae8b2235..85245b7179c13 100644 --- a/packages/nodes-base/credentials/F5BigIpApi.credentials.ts +++ b/packages/nodes-base/credentials/F5BigIpApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class F5BigIpApi implements ICredentialType { name = 'f5BigIpApi'; @@ -7,7 +7,7 @@ export class F5BigIpApi implements ICredentialType { documentationUrl = 'f5bigip'; - icon = 'file:icons/F5.svg'; + icon: Icon = 'file:icons/F5.svg'; httpRequestNode = { name: 'F5 Big-IP', diff --git a/packages/nodes-base/credentials/FortiGateApi.credentials.ts b/packages/nodes-base/credentials/FortiGateApi.credentials.ts index 30655d651ff88..9f7febf53cfaf 100644 --- a/packages/nodes-base/credentials/FortiGateApi.credentials.ts +++ b/packages/nodes-base/credentials/FortiGateApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class FortiGateApi implements ICredentialType { name = 'fortiGateApi'; @@ -7,7 +7,7 @@ export class FortiGateApi implements ICredentialType { documentationUrl = 'fortigate'; - icon = 'file:icons/Fortinet.svg'; + icon: Icon = 'file:icons/Fortinet.svg'; httpRequestNode = { name: 'Fortinet FortiGate', diff --git a/packages/nodes-base/credentials/GoogleApi.credentials.ts b/packages/nodes-base/credentials/GoogleApi.credentials.ts index 90db20c9df9bb..96fa9e5f40711 100644 --- a/packages/nodes-base/credentials/GoogleApi.credentials.ts +++ b/packages/nodes-base/credentials/GoogleApi.credentials.ts @@ -3,6 +3,7 @@ import type { ICredentialType, IHttpRequestOptions, INodeProperties, + Icon, } from 'n8n-workflow'; import moment from 'moment-timezone'; @@ -20,7 +21,7 @@ export class GoogleApi implements ICredentialType { documentationUrl = 'google/service-account'; - icon = 'file:icons/Google.svg'; + icon: Icon = 'file:icons/Google.svg'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/GoogleOAuth2Api.credentials.ts b/packages/nodes-base/credentials/GoogleOAuth2Api.credentials.ts index 821bf6e770ab3..4af21afdd70d2 100644 --- a/packages/nodes-base/credentials/GoogleOAuth2Api.credentials.ts +++ b/packages/nodes-base/credentials/GoogleOAuth2Api.credentials.ts @@ -1,4 +1,4 @@ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class GoogleOAuth2Api implements ICredentialType { name = 'googleOAuth2Api'; @@ -9,7 +9,7 @@ export class GoogleOAuth2Api implements ICredentialType { documentationUrl = 'google/oauth-generic'; - icon = 'file:icons/Google.svg'; + icon: Icon = 'file:icons/Google.svg'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/HttpBasicAuth.credentials.ts b/packages/nodes-base/credentials/HttpBasicAuth.credentials.ts index ad8f16b1663ac..3d92244ba54c9 100644 --- a/packages/nodes-base/credentials/HttpBasicAuth.credentials.ts +++ b/packages/nodes-base/credentials/HttpBasicAuth.credentials.ts @@ -1,4 +1,4 @@ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class HttpBasicAuth implements ICredentialType { name = 'httpBasicAuth'; @@ -9,7 +9,7 @@ export class HttpBasicAuth implements ICredentialType { genericAuth = true; - icon = 'node:n8n-nodes-base.httpRequest'; + icon: Icon = 'node:n8n-nodes-base.httpRequest'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/HttpCustomAuth.credentials.ts b/packages/nodes-base/credentials/HttpCustomAuth.credentials.ts index 405d7b7cdf3ee..2b23865e18abd 100644 --- a/packages/nodes-base/credentials/HttpCustomAuth.credentials.ts +++ b/packages/nodes-base/credentials/HttpCustomAuth.credentials.ts @@ -1,6 +1,6 @@ /* eslint-disable n8n-nodes-base/cred-class-field-name-unsuffixed */ /* eslint-disable n8n-nodes-base/cred-class-name-unsuffixed */ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class HttpCustomAuth implements ICredentialType { name = 'httpCustomAuth'; @@ -11,7 +11,7 @@ export class HttpCustomAuth implements ICredentialType { genericAuth = true; - icon = 'node:n8n-nodes-base.httpRequest'; + icon: Icon = 'node:n8n-nodes-base.httpRequest'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/HttpDigestAuth.credentials.ts b/packages/nodes-base/credentials/HttpDigestAuth.credentials.ts index 234e299bce3e8..e3dd31704d749 100644 --- a/packages/nodes-base/credentials/HttpDigestAuth.credentials.ts +++ b/packages/nodes-base/credentials/HttpDigestAuth.credentials.ts @@ -1,4 +1,4 @@ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class HttpDigestAuth implements ICredentialType { name = 'httpDigestAuth'; @@ -9,7 +9,7 @@ export class HttpDigestAuth implements ICredentialType { genericAuth = true; - icon = 'node:n8n-nodes-base.httpRequest'; + icon: Icon = 'node:n8n-nodes-base.httpRequest'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/HttpHeaderAuth.credentials.ts b/packages/nodes-base/credentials/HttpHeaderAuth.credentials.ts index 304b44d7fcc2b..a689e1bcfd331 100644 --- a/packages/nodes-base/credentials/HttpHeaderAuth.credentials.ts +++ b/packages/nodes-base/credentials/HttpHeaderAuth.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class HttpHeaderAuth implements ICredentialType { name = 'httpHeaderAuth'; @@ -9,7 +9,7 @@ export class HttpHeaderAuth implements ICredentialType { genericAuth = true; - icon = 'node:n8n-nodes-base.httpRequest'; + icon: Icon = 'node:n8n-nodes-base.httpRequest'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/HttpQueryAuth.credentials.ts b/packages/nodes-base/credentials/HttpQueryAuth.credentials.ts index c2ae9c474138b..71055a713bb72 100644 --- a/packages/nodes-base/credentials/HttpQueryAuth.credentials.ts +++ b/packages/nodes-base/credentials/HttpQueryAuth.credentials.ts @@ -1,4 +1,4 @@ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class HttpQueryAuth implements ICredentialType { name = 'httpQueryAuth'; @@ -9,7 +9,7 @@ export class HttpQueryAuth implements ICredentialType { genericAuth = true; - icon = 'node:n8n-nodes-base.httpRequest'; + icon: Icon = 'node:n8n-nodes-base.httpRequest'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/HttpSslAuth.credentials.ts b/packages/nodes-base/credentials/HttpSslAuth.credentials.ts index 06be6d4dd74e5..541306de4c9d2 100644 --- a/packages/nodes-base/credentials/HttpSslAuth.credentials.ts +++ b/packages/nodes-base/credentials/HttpSslAuth.credentials.ts @@ -1,6 +1,6 @@ /* eslint-disable n8n-nodes-base/cred-class-name-unsuffixed */ /* eslint-disable n8n-nodes-base/cred-class-field-name-unsuffixed */ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class HttpSslAuth implements ICredentialType { name = 'httpSslAuth'; @@ -9,7 +9,7 @@ export class HttpSslAuth implements ICredentialType { documentationUrl = 'httpRequest'; - icon = 'node:n8n-nodes-base.httpRequest'; + icon: Icon = 'node:n8n-nodes-base.httpRequest'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/HybridAnalysisApi.credentials.ts b/packages/nodes-base/credentials/HybridAnalysisApi.credentials.ts index a7c06463dad98..a0c6dd6eee2a0 100644 --- a/packages/nodes-base/credentials/HybridAnalysisApi.credentials.ts +++ b/packages/nodes-base/credentials/HybridAnalysisApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class HybridAnalysisApi implements ICredentialType { name = 'hybridAnalysisApi'; @@ -7,7 +7,7 @@ export class HybridAnalysisApi implements ICredentialType { documentationUrl = 'hybridanalysis'; - icon = 'file:icons/Hybrid.png'; + icon: Icon = 'file:icons/Hybrid.png'; httpRequestNode = { name: 'Hybrid Analysis', diff --git a/packages/nodes-base/credentials/ImpervaWafApi.credentials.ts b/packages/nodes-base/credentials/ImpervaWafApi.credentials.ts index 2046f428a400f..3e72a14773649 100644 --- a/packages/nodes-base/credentials/ImpervaWafApi.credentials.ts +++ b/packages/nodes-base/credentials/ImpervaWafApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class ImpervaWafApi implements ICredentialType { name = 'impervaWafApi'; @@ -7,7 +7,7 @@ export class ImpervaWafApi implements ICredentialType { documentationUrl = 'impervawaf'; - icon = 'file:icons/Imperva.svg'; + icon: Icon = 'file:icons/Imperva.svg'; httpRequestNode = { name: 'Imperva WAF', diff --git a/packages/nodes-base/credentials/JwtAuth.credentials.ts b/packages/nodes-base/credentials/JwtAuth.credentials.ts index 5dbf5ec7a1d2e..9f74c83bfc599 100644 --- a/packages/nodes-base/credentials/JwtAuth.credentials.ts +++ b/packages/nodes-base/credentials/JwtAuth.credentials.ts @@ -1,4 +1,4 @@ -import type { ICredentialType, INodeProperties, INodePropertyOptions } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, INodePropertyOptions, Icon } from 'n8n-workflow'; const algorithms: INodePropertyOptions[] = [ { @@ -64,7 +64,7 @@ export class JwtAuth implements ICredentialType { documentationUrl = 'jwt'; - icon = 'file:icons/jwt.svg'; + icon: Icon = 'file:icons/jwt.svg'; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/KibanaApi.credentials.ts b/packages/nodes-base/credentials/KibanaApi.credentials.ts index 432b53cb4e66a..88ec55a96f009 100644 --- a/packages/nodes-base/credentials/KibanaApi.credentials.ts +++ b/packages/nodes-base/credentials/KibanaApi.credentials.ts @@ -3,6 +3,7 @@ import type { ICredentialTestRequest, ICredentialType, INodeProperties, + Icon, } from 'n8n-workflow'; export class KibanaApi implements ICredentialType { @@ -12,7 +13,7 @@ export class KibanaApi implements ICredentialType { documentationUrl = 'kibana'; - icon = 'file:icons/Kibana.svg'; + icon: Icon = 'file:icons/Kibana.svg'; httpRequestNode = { name: 'Kibana', diff --git a/packages/nodes-base/credentials/MicrosoftEntraOAuth2Api.credentials.ts b/packages/nodes-base/credentials/MicrosoftEntraOAuth2Api.credentials.ts index 14a46dd7621f4..c1c77edb41717 100644 --- a/packages/nodes-base/credentials/MicrosoftEntraOAuth2Api.credentials.ts +++ b/packages/nodes-base/credentials/MicrosoftEntraOAuth2Api.credentials.ts @@ -1,4 +1,4 @@ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class MicrosoftEntraOAuth2Api implements ICredentialType { name = 'microsoftEntraOAuth2Api'; @@ -7,7 +7,7 @@ export class MicrosoftEntraOAuth2Api implements ICredentialType { extends = ['microsoftOAuth2Api']; - icon = 'file:icons/Azure.svg'; + icon: Icon = 'file:icons/Azure.svg'; documentationUrl = 'microsoftentra'; diff --git a/packages/nodes-base/credentials/MicrosoftOAuth2Api.credentials.ts b/packages/nodes-base/credentials/MicrosoftOAuth2Api.credentials.ts index 58425dbe3946d..9a6b77efb9013 100644 --- a/packages/nodes-base/credentials/MicrosoftOAuth2Api.credentials.ts +++ b/packages/nodes-base/credentials/MicrosoftOAuth2Api.credentials.ts @@ -1,11 +1,11 @@ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class MicrosoftOAuth2Api implements ICredentialType { name = 'microsoftOAuth2Api'; extends = ['oAuth2Api']; - icon = 'file:icons/Microsoft.svg'; + icon: Icon = 'file:icons/Microsoft.svg'; displayName = 'Microsoft OAuth2 API'; diff --git a/packages/nodes-base/credentials/MistApi.credentials.ts b/packages/nodes-base/credentials/MistApi.credentials.ts index d74fe8a64bcba..d619b0461b1d3 100644 --- a/packages/nodes-base/credentials/MistApi.credentials.ts +++ b/packages/nodes-base/credentials/MistApi.credentials.ts @@ -3,6 +3,7 @@ import type { ICredentialTestRequest, ICredentialType, INodeProperties, + Icon, } from 'n8n-workflow'; export class MistApi implements ICredentialType { @@ -10,7 +11,7 @@ export class MistApi implements ICredentialType { displayName = 'Mist API'; - icon = 'file:icons/Mist.svg'; + icon: Icon = 'file:icons/Mist.svg'; documentationUrl = 'mist'; diff --git a/packages/nodes-base/credentials/OktaApi.credentials.ts b/packages/nodes-base/credentials/OktaApi.credentials.ts index fdbeb2defc8e6..3be4e4c0b519b 100644 --- a/packages/nodes-base/credentials/OktaApi.credentials.ts +++ b/packages/nodes-base/credentials/OktaApi.credentials.ts @@ -3,6 +3,7 @@ import type { ICredentialTestRequest, ICredentialType, INodeProperties, + Icon, } from 'n8n-workflow'; export class OktaApi implements ICredentialType { @@ -12,7 +13,7 @@ export class OktaApi implements ICredentialType { documentationUrl = 'okta'; - icon = 'file:icons/Okta.svg'; + icon: Icon = 'file:icons/Okta.svg'; httpRequestNode = { name: 'Okta', diff --git a/packages/nodes-base/credentials/OpenCTIApi.credentials.ts b/packages/nodes-base/credentials/OpenCTIApi.credentials.ts index dde51838ed0a3..f92dab00aae6f 100644 --- a/packages/nodes-base/credentials/OpenCTIApi.credentials.ts +++ b/packages/nodes-base/credentials/OpenCTIApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class OpenCTIApi implements ICredentialType { name = 'openCtiApi'; @@ -7,7 +7,7 @@ export class OpenCTIApi implements ICredentialType { documentationUrl = 'opencti'; - icon = 'file:icons/OpenCTI.png'; + icon: Icon = 'file:icons/OpenCTI.png'; httpRequestNode = { name: 'OpenCTI', diff --git a/packages/nodes-base/credentials/QRadarApi.credentials.ts b/packages/nodes-base/credentials/QRadarApi.credentials.ts index 5da8eaab3765e..62e179b9f0c54 100644 --- a/packages/nodes-base/credentials/QRadarApi.credentials.ts +++ b/packages/nodes-base/credentials/QRadarApi.credentials.ts @@ -1,11 +1,11 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class QRadarApi implements ICredentialType { name = 'qRadarApi'; displayName = 'QRadar API'; - icon = 'file:icons/IBM.svg'; + icon: Icon = 'file:icons/IBM.svg'; documentationUrl = 'qradar'; diff --git a/packages/nodes-base/credentials/QualysApi.credentials.ts b/packages/nodes-base/credentials/QualysApi.credentials.ts index 5f54b9dc5382b..1e56f3aacba41 100644 --- a/packages/nodes-base/credentials/QualysApi.credentials.ts +++ b/packages/nodes-base/credentials/QualysApi.credentials.ts @@ -5,7 +5,7 @@ export class QualysApi implements ICredentialType { displayName = 'Qualys API'; - icon = 'file:icons/Qualys.svg'; + icon = 'file:icons/Qualys.svg' as const; documentationUrl = 'qualys'; diff --git a/packages/nodes-base/credentials/RecordedFutureApi.credentials.ts b/packages/nodes-base/credentials/RecordedFutureApi.credentials.ts index 2a19b4a8ebab6..5b10efb03e040 100644 --- a/packages/nodes-base/credentials/RecordedFutureApi.credentials.ts +++ b/packages/nodes-base/credentials/RecordedFutureApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class RecordedFutureApi implements ICredentialType { name = 'recordedFutureApi'; @@ -7,7 +7,7 @@ export class RecordedFutureApi implements ICredentialType { documentationUrl = 'recordedfuture'; - icon = 'file:icons/RecordedFuture.svg'; + icon: Icon = 'file:icons/RecordedFuture.svg'; httpRequestNode = { name: 'Recorded Future', diff --git a/packages/nodes-base/credentials/SekoiaApi.credentials.ts b/packages/nodes-base/credentials/SekoiaApi.credentials.ts index e9bee6dbcda64..394f8b1d81906 100644 --- a/packages/nodes-base/credentials/SekoiaApi.credentials.ts +++ b/packages/nodes-base/credentials/SekoiaApi.credentials.ts @@ -1,11 +1,11 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class SekoiaApi implements ICredentialType { name = 'sekoiaApi'; displayName = 'Sekoia API'; - icon = 'file:icons/Sekoia.svg'; + icon: Icon = 'file:icons/Sekoia.svg'; documentationUrl = 'sekoia'; diff --git a/packages/nodes-base/credentials/ShufflerApi.credentials.ts b/packages/nodes-base/credentials/ShufflerApi.credentials.ts index ce5995df6bb6b..e86dda6631b4a 100644 --- a/packages/nodes-base/credentials/ShufflerApi.credentials.ts +++ b/packages/nodes-base/credentials/ShufflerApi.credentials.ts @@ -3,6 +3,7 @@ import type { ICredentialTestRequest, ICredentialType, INodeProperties, + Icon, } from 'n8n-workflow'; export class ShufflerApi implements ICredentialType { @@ -10,7 +11,7 @@ export class ShufflerApi implements ICredentialType { displayName = 'Shuffler API'; - icon = 'file:icons/Shuffler.svg'; + icon: Icon = 'file:icons/Shuffler.svg'; documentationUrl = 'shuffler'; diff --git a/packages/nodes-base/credentials/TrellixEpoApi.credentials.ts b/packages/nodes-base/credentials/TrellixEpoApi.credentials.ts index c4fbab9bdfe78..b5d9cc2c2f503 100644 --- a/packages/nodes-base/credentials/TrellixEpoApi.credentials.ts +++ b/packages/nodes-base/credentials/TrellixEpoApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class TrellixEpoApi implements ICredentialType { name = 'trellixEpoApi'; @@ -7,7 +7,7 @@ export class TrellixEpoApi implements ICredentialType { documentationUrl = 'trellixepo'; - icon = 'file:icons/Trellix.svg'; + icon: Icon = 'file:icons/Trellix.svg'; httpRequestNode = { name: 'Trellix (McAfee) ePolicy Orchestrator', diff --git a/packages/nodes-base/credentials/TwakeServerApi.credentials.ts b/packages/nodes-base/credentials/TwakeServerApi.credentials.ts index 2738465069d7b..0125cb14a2fc2 100644 --- a/packages/nodes-base/credentials/TwakeServerApi.credentials.ts +++ b/packages/nodes-base/credentials/TwakeServerApi.credentials.ts @@ -1,11 +1,11 @@ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; export class TwakeServerApi implements ICredentialType { name = 'twakeServerApi'; displayName = 'Twake Server API'; - icon = 'file:icons/Twake.png'; + icon: Icon = 'file:icons/Twake.png'; documentationUrl = 'twake'; diff --git a/packages/nodes-base/credentials/VirusTotalApi.credentials.ts b/packages/nodes-base/credentials/VirusTotalApi.credentials.ts index 3a69d520f9ade..5aeb949ccdd89 100644 --- a/packages/nodes-base/credentials/VirusTotalApi.credentials.ts +++ b/packages/nodes-base/credentials/VirusTotalApi.credentials.ts @@ -3,6 +3,7 @@ import type { ICredentialTestRequest, ICredentialType, INodeProperties, + Icon, } from 'n8n-workflow'; export class VirusTotalApi implements ICredentialType { @@ -12,7 +13,7 @@ export class VirusTotalApi implements ICredentialType { documentationUrl = 'virustotal'; - icon = 'file:icons/VirusTotal.svg'; + icon: Icon = 'file:icons/VirusTotal.svg'; httpRequestNode = { name: 'VirusTotal', diff --git a/packages/nodes-base/credentials/YouTubeOAuth2Api.credentials.ts b/packages/nodes-base/credentials/YouTubeOAuth2Api.credentials.ts index 0fd023362fdb3..0611d9d65d57b 100644 --- a/packages/nodes-base/credentials/YouTubeOAuth2Api.credentials.ts +++ b/packages/nodes-base/credentials/YouTubeOAuth2Api.credentials.ts @@ -1,4 +1,4 @@ -import type { ICredentialType, INodeProperties } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; //https://developers.google.com/youtube/v3/guides/auth/client-side-web-apps#identify-access-scopes const scopes = [ @@ -12,7 +12,7 @@ const scopes = [ export class YouTubeOAuth2Api implements ICredentialType { name = 'youTubeOAuth2Api'; - icon = 'node:n8n-nodes-base.youTube'; + icon: Icon = 'node:n8n-nodes-base.youTube'; extends = ['googleOAuth2Api']; diff --git a/packages/nodes-base/credentials/ZscalerZiaApi.credentials.ts b/packages/nodes-base/credentials/ZscalerZiaApi.credentials.ts index bd3260442b643..80d41ac657a5d 100644 --- a/packages/nodes-base/credentials/ZscalerZiaApi.credentials.ts +++ b/packages/nodes-base/credentials/ZscalerZiaApi.credentials.ts @@ -6,6 +6,7 @@ import type { ICredentialType, IHttpRequestHelper, INodeProperties, + Icon, } from 'n8n-workflow'; export class ZscalerZiaApi implements ICredentialType { @@ -15,7 +16,7 @@ export class ZscalerZiaApi implements ICredentialType { documentationUrl = 'zscalerzia'; - icon = 'file:icons/Zscaler.svg'; + icon: Icon = 'file:icons/Zscaler.svg'; httpRequestNode = { name: 'Zscaler ZIA', diff --git a/packages/nodes-base/nodes/Google/Sheet/v2/actions/versionDescription.ts b/packages/nodes-base/nodes/Google/Sheet/v2/actions/versionDescription.ts index 8bb6064f49a67..d52d8764bd5c2 100644 --- a/packages/nodes-base/nodes/Google/Sheet/v2/actions/versionDescription.ts +++ b/packages/nodes-base/nodes/Google/Sheet/v2/actions/versionDescription.ts @@ -7,7 +7,7 @@ import * as spreadsheet from './spreadsheet/SpreadSheet.resource'; export const versionDescription: INodeTypeDescription = { displayName: 'Google Sheets', name: 'googleSheets', - icon: 'file:googleSheets.svg', + icon: { light: 'file:googleSheets.svg', dark: 'file:googleSheetsDark.svg' }, group: ['input', 'output'], version: [3, 4, 4.1, 4.2, 4.3], subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Set/v2/SetV2.node.ts b/packages/nodes-base/nodes/Set/v2/SetV2.node.ts index 41cc4a2f337d2..3ea702cef2917 100644 --- a/packages/nodes-base/nodes/Set/v2/SetV2.node.ts +++ b/packages/nodes-base/nodes/Set/v2/SetV2.node.ts @@ -20,13 +20,13 @@ const versionDescription: INodeTypeDescription = { displayName: 'Edit Fields (Set)', name: 'set', icon: 'fa:pen', + iconColor: '1', group: ['input'], version: [3, 3.1, 3.2, 3.3], description: 'Modify, add, or remove item fields', subtitle: '={{$parameter["mode"]}}', defaults: { name: 'Edit Fields', - color: '#0000FF', }, inputs: ['main'], outputs: ['main'], diff --git a/packages/workflow/src/Interfaces.ts b/packages/workflow/src/Interfaces.ts index b0e2098328058..33d42fa66f0ba 100644 --- a/packages/workflow/src/Interfaces.ts +++ b/packages/workflow/src/Interfaces.ts @@ -299,7 +299,7 @@ type ICredentialHttpRequestNode = { export interface ICredentialType { name: string; displayName: string; - icon?: string; + icon?: Icon; iconUrl?: string; extends?: string[]; properties: INodeProperties[]; @@ -1532,12 +1532,18 @@ export interface IWorkflowIssues { [key: string]: INodeIssues; } +export type NodeIconColor = '1' | '2' | '3'; +export type Icon = `fa:${string}` | `file:${string}` | `node:${string}`; +export type Themed = T | { light: T; dark: T }; +export type ThemedIcon = Themed; + export interface INodeTypeBaseDescription { displayName: string; name: string; - icon?: string; - iconUrl?: string; - badgeIconUrl?: string; + icon?: ThemedIcon; + iconColor?: NodeIconColor; + iconUrl?: Themed; + badgeIconUrl?: Themed; group: string[]; description: string; documentationUrl?: string; From 1695eca230d68132565542229dd9a5b53fd5e2dc Mon Sep 17 00:00:00 2001 From: Elias Meire Date: Wed, 15 May 2024 15:54:23 +0200 Subject: [PATCH 02/20] Change preset naming --- packages/design-system/src/css/_tokens.dark.scss | 5 ++--- packages/design-system/src/css/_tokens.scss | 5 ++--- .../nodes/Google/Sheet/v2/actions/versionDescription.ts | 2 +- packages/nodes-base/nodes/Set/v2/SetV2.node.ts | 2 +- packages/workflow/src/Interfaces.ts | 2 +- 5 files changed, 7 insertions(+), 9 deletions(-) diff --git a/packages/design-system/src/css/_tokens.dark.scss b/packages/design-system/src/css/_tokens.dark.scss index f00ba8419cdfe..71ae3e67da320 100644 --- a/packages/design-system/src/css/_tokens.dark.scss +++ b/packages/design-system/src/css/_tokens.dark.scss @@ -73,9 +73,8 @@ --color-sticky-border-7: var(--prim-gray-670); // NodeIcon - --color-node-icon-1: blue; - --color-node-icon-2: var(--prim-color-alt-b-shade-250); - --color-node-icon-3: var(--prim-color-alt-c-shade-150); + --color-node-icon-blue: cyan; + --color-node-icon-red: coral; // Expressions, autocomplete, infobox --color-valid-resolvable-foreground: var(--prim-color-alt-a-tint-300); diff --git a/packages/design-system/src/css/_tokens.scss b/packages/design-system/src/css/_tokens.scss index 6117a4c98d658..2e9ce947523e7 100644 --- a/packages/design-system/src/css/_tokens.scss +++ b/packages/design-system/src/css/_tokens.scss @@ -107,9 +107,8 @@ --color-sticky-border-7: var(--prim-gray-120); // NodeIcon - --color-node-icon-1: red; - --color-node-icon-2: var(--prim-color-alt-b-tint-150); - --color-node-icon-3: var(--prim-color-alt-c-tint-300); + --color-node-icon-blue: blue; + --color-node-icon-red: red; // Expressions, autocomplete, infobox --color-valid-resolvable-foreground: var(--prim-color-alt-a); diff --git a/packages/nodes-base/nodes/Google/Sheet/v2/actions/versionDescription.ts b/packages/nodes-base/nodes/Google/Sheet/v2/actions/versionDescription.ts index d52d8764bd5c2..8bb6064f49a67 100644 --- a/packages/nodes-base/nodes/Google/Sheet/v2/actions/versionDescription.ts +++ b/packages/nodes-base/nodes/Google/Sheet/v2/actions/versionDescription.ts @@ -7,7 +7,7 @@ import * as spreadsheet from './spreadsheet/SpreadSheet.resource'; export const versionDescription: INodeTypeDescription = { displayName: 'Google Sheets', name: 'googleSheets', - icon: { light: 'file:googleSheets.svg', dark: 'file:googleSheetsDark.svg' }, + icon: 'file:googleSheets.svg', group: ['input', 'output'], version: [3, 4, 4.1, 4.2, 4.3], subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Set/v2/SetV2.node.ts b/packages/nodes-base/nodes/Set/v2/SetV2.node.ts index 3ea702cef2917..41cc4a2f337d2 100644 --- a/packages/nodes-base/nodes/Set/v2/SetV2.node.ts +++ b/packages/nodes-base/nodes/Set/v2/SetV2.node.ts @@ -20,13 +20,13 @@ const versionDescription: INodeTypeDescription = { displayName: 'Edit Fields (Set)', name: 'set', icon: 'fa:pen', - iconColor: '1', group: ['input'], version: [3, 3.1, 3.2, 3.3], description: 'Modify, add, or remove item fields', subtitle: '={{$parameter["mode"]}}', defaults: { name: 'Edit Fields', + color: '#0000FF', }, inputs: ['main'], outputs: ['main'], diff --git a/packages/workflow/src/Interfaces.ts b/packages/workflow/src/Interfaces.ts index 33d42fa66f0ba..bc5d9e0592c1f 100644 --- a/packages/workflow/src/Interfaces.ts +++ b/packages/workflow/src/Interfaces.ts @@ -1532,7 +1532,7 @@ export interface IWorkflowIssues { [key: string]: INodeIssues; } -export type NodeIconColor = '1' | '2' | '3'; +export type NodeIconColor = 'blue' | 'red'; export type Icon = `fa:${string}` | `file:${string}` | `node:${string}`; export type Themed = T | { light: T; dark: T }; export type ThemedIcon = Themed; From 5e2eafa8a69d096c53f6573fc0dd251eeb2a5008 Mon Sep 17 00:00:00 2001 From: Elias Meire Date: Wed, 15 May 2024 15:57:00 +0200 Subject: [PATCH 03/20] Simplify types --- packages/workflow/src/Interfaces.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/workflow/src/Interfaces.ts b/packages/workflow/src/Interfaces.ts index bc5d9e0592c1f..0eb60a9e352a3 100644 --- a/packages/workflow/src/Interfaces.ts +++ b/packages/workflow/src/Interfaces.ts @@ -1535,15 +1535,14 @@ export interface IWorkflowIssues { export type NodeIconColor = 'blue' | 'red'; export type Icon = `fa:${string}` | `file:${string}` | `node:${string}`; export type Themed = T | { light: T; dark: T }; -export type ThemedIcon = Themed; export interface INodeTypeBaseDescription { displayName: string; name: string; - icon?: ThemedIcon; + icon?: Themed; iconColor?: NodeIconColor; iconUrl?: Themed; - badgeIconUrl?: Themed; + badgeIconUrl?: string; group: string[]; description: string; documentationUrl?: string; From 588227560064703b8a85624c394b45e6bb9da229 Mon Sep 17 00:00:00 2001 From: Elias Meire Date: Wed, 15 May 2024 16:29:16 +0200 Subject: [PATCH 04/20] Revert node background change --- packages/design-system/src/css/_tokens.dark.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/design-system/src/css/_tokens.dark.scss b/packages/design-system/src/css/_tokens.dark.scss index 71ae3e67da320..bdd9aaa21794c 100644 --- a/packages/design-system/src/css/_tokens.dark.scss +++ b/packages/design-system/src/css/_tokens.dark.scss @@ -45,7 +45,7 @@ --color-canvas-background-l: 18%; --color-canvas-dot: var(--prim-gray-670); --color-canvas-read-only-line: var(--prim-gray-800); - --color-canvas-node-background: var(--color-background-xlight); + --color-canvas-node-background: var(--prim-gray-40); --color-canvas-node-pinned-border: var(--prim-color-secondary-tint-100); --color-canvas-selected: var(--prim-gray-0-alpha-025); --node-type-main-color: var(--prim-gray-420); From 2b6c9c23be02e3e778c2f35172856f9d70c5f799 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Thu, 30 May 2024 16:21:19 +0200 Subject: [PATCH 05/20] Dark mode logos. --- .../trigger/ChatTrigger/ChatTrigger.node.ts | 1 + .../design-system/src/css/_tokens.dark.scss | 16 +++++++++++++--- packages/design-system/src/css/_tokens.scss | 14 ++++++++++++-- .../nodes/ActiveCampaign/ActiveCampaign.node.ts | 2 +- .../ActiveCampaign/activeCampaign.dark.svg | 4 ++++ .../nodes/ActiveCampaign/activeCampaign.png | Bin 881 -> 0 bytes .../nodes/ActiveCampaign/activeCampaign.svg | 4 ++++ .../nodes-base/nodes/Affinity/Affinity.node.ts | 2 +- .../nodes-base/nodes/Affinity/affinity.dark.svg | 8 ++++++++ packages/nodes-base/nodes/Affinity/affinity.png | Bin 2762 -> 0 bytes packages/nodes-base/nodes/Affinity/affinity.svg | 14 ++++++++++++++ packages/nodes-base/nodes/Bubble/Bubble.node.ts | 2 +- .../nodes-base/nodes/Bubble/bubble.dark.svg | 4 ++++ packages/nodes-base/nodes/Bubble/bubble.svg | 5 ++++- .../nodes-base/nodes/Cal/CalTrigger.node.ts | 2 +- packages/nodes-base/nodes/Cal/cal.dark.svg | 9 +++++++++ packages/nodes-base/nodes/Cal/cal.svg | 10 +++++++++- packages/nodes-base/nodes/DeepL/DeepL.node.ts | 2 +- packages/nodes-base/nodes/DeepL/deepL.dark.svg | 4 ++++ packages/nodes-base/nodes/DeepL/deepl.svg | 5 ++++- packages/nodes-base/nodes/NoOp/NoOp.node.ts | 1 + packages/nodes-base/nodes/OpenAi/OpenAi.node.ts | 2 +- .../nodes-base/nodes/OpenAi/openAi.dark.svg | 3 +++ .../RespondToWebhook/RespondToWebhook.node.ts | 2 +- .../nodes/RespondToWebhook/webhook.dark.svg | 5 +++++ .../nodes-base/nodes/Webhook/Webhook.node.ts | 2 +- .../nodes-base/nodes/Webhook/webhook.dark.svg | 5 +++++ packages/workflow/src/Interfaces.ts | 2 +- 28 files changed, 113 insertions(+), 17 deletions(-) create mode 100644 packages/nodes-base/nodes/ActiveCampaign/activeCampaign.dark.svg delete mode 100644 packages/nodes-base/nodes/ActiveCampaign/activeCampaign.png create mode 100644 packages/nodes-base/nodes/ActiveCampaign/activeCampaign.svg create mode 100644 packages/nodes-base/nodes/Affinity/affinity.dark.svg delete mode 100644 packages/nodes-base/nodes/Affinity/affinity.png create mode 100644 packages/nodes-base/nodes/Affinity/affinity.svg create mode 100644 packages/nodes-base/nodes/Bubble/bubble.dark.svg create mode 100644 packages/nodes-base/nodes/Cal/cal.dark.svg create mode 100644 packages/nodes-base/nodes/DeepL/deepL.dark.svg create mode 100644 packages/nodes-base/nodes/OpenAi/openAi.dark.svg create mode 100644 packages/nodes-base/nodes/RespondToWebhook/webhook.dark.svg create mode 100644 packages/nodes-base/nodes/Webhook/webhook.dark.svg diff --git a/packages/@n8n/nodes-langchain/nodes/trigger/ChatTrigger/ChatTrigger.node.ts b/packages/@n8n/nodes-langchain/nodes/trigger/ChatTrigger/ChatTrigger.node.ts index 386479e569966..39efb4950f5b1 100644 --- a/packages/@n8n/nodes-langchain/nodes/trigger/ChatTrigger/ChatTrigger.node.ts +++ b/packages/@n8n/nodes-langchain/nodes/trigger/ChatTrigger/ChatTrigger.node.ts @@ -19,6 +19,7 @@ export class ChatTrigger implements INodeType { displayName: 'Chat Trigger', name: 'chatTrigger', icon: 'fa:comments', + iconColor: 'black', group: ['trigger'], version: 1, description: 'Runs the workflow when an n8n generated webchat is submitted', diff --git a/packages/design-system/src/css/_tokens.dark.scss b/packages/design-system/src/css/_tokens.dark.scss index bdd9aaa21794c..fcf5dec80b53e 100644 --- a/packages/design-system/src/css/_tokens.dark.scss +++ b/packages/design-system/src/css/_tokens.dark.scss @@ -45,7 +45,7 @@ --color-canvas-background-l: 18%; --color-canvas-dot: var(--prim-gray-670); --color-canvas-read-only-line: var(--prim-gray-800); - --color-canvas-node-background: var(--prim-gray-40); + --color-canvas-node-background: var(--prim-gray-740); --color-canvas-node-pinned-border: var(--prim-color-secondary-tint-100); --color-canvas-selected: var(--prim-gray-0-alpha-025); --node-type-main-color: var(--prim-gray-420); @@ -73,8 +73,18 @@ --color-sticky-border-7: var(--prim-gray-670); // NodeIcon - --color-node-icon-blue: cyan; - --color-node-icon-red: coral; + --color-node-icon-gray: var(--prim-gray-200); + --color-node-icon-black: var(--prim-gray-70); + --color-node-icon-blue: #766dfb; + --color-node-icon-light-blue: #5fabf7; + --color-node-icon-orange: #ff965a; + --color-node-icon-orange-red: #ff6d5a; + --color-node-icon-light-green: #26b28f; + --color-node-icon-green: #49d7b4; + --color-node-icon-dark-green: #86dec8; + --color-node-icon-azure: #54b8c9; + --color-node-icon-purple: #9b6dd5; + --color-node-icon-crimson: #d05876; // Expressions, autocomplete, infobox --color-valid-resolvable-foreground: var(--prim-color-alt-a-tint-300); diff --git a/packages/design-system/src/css/_tokens.scss b/packages/design-system/src/css/_tokens.scss index 2e9ce947523e7..c5c6b2e5e54cf 100644 --- a/packages/design-system/src/css/_tokens.scss +++ b/packages/design-system/src/css/_tokens.scss @@ -107,8 +107,18 @@ --color-sticky-border-7: var(--prim-gray-120); // NodeIcon - --color-node-icon-blue: blue; - --color-node-icon-red: red; + --color-node-icon-gray: var(--prim-gray-420); + --color-node-icon-black: var(--prim-gray-780); + --color-node-icon-blue: #4a3eea; + --color-node-icon-light-blue: #5fabf7; + --color-node-icon-orange: #ff965a; + --color-node-icon-orange-red: #ff6d5a; + --color-node-icon-light-green: #31c49f; + --color-node-icon-green: #1ea986; + --color-node-icon-dark-green: #15755d; + --color-node-icon-azure: #54b8c9; + --color-node-icon-purple: #9b6dd5; + --color-node-icon-crimson: #bb3a5a; // Expressions, autocomplete, infobox --color-valid-resolvable-foreground: var(--prim-color-alt-a); diff --git a/packages/nodes-base/nodes/ActiveCampaign/ActiveCampaign.node.ts b/packages/nodes-base/nodes/ActiveCampaign/ActiveCampaign.node.ts index cc931d2feceed..e961b4df7ce79 100644 --- a/packages/nodes-base/nodes/ActiveCampaign/ActiveCampaign.node.ts +++ b/packages/nodes-base/nodes/ActiveCampaign/ActiveCampaign.node.ts @@ -82,7 +82,7 @@ export class ActiveCampaign implements INodeType { displayName: 'ActiveCampaign', name: 'activeCampaign', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:activeCampaign.png', + icon: { light: 'file:activeCampaign.svg', dark: 'file:activeCampaign.dark.svg' }, group: ['transform'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/ActiveCampaign/activeCampaign.dark.svg b/packages/nodes-base/nodes/ActiveCampaign/activeCampaign.dark.svg new file mode 100644 index 0000000000000..7b2338f91c2db --- /dev/null +++ b/packages/nodes-base/nodes/ActiveCampaign/activeCampaign.dark.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/ActiveCampaign/activeCampaign.png b/packages/nodes-base/nodes/ActiveCampaign/activeCampaign.png deleted file mode 100644 index 0e638d8a10871d9b84fff7dff6ebf9f5992838eb..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 881 zcmV-%1CIQOP)3r~{@PLdU5vk6O$3r&v;PLT^ukP1qP3QCF!M}-PUgb6-%2|{}a zIco?yYzaSh2Q^~}KXoNdbp|k61}#(yS*HtCpA1u(3{;&9RiF%0n+r;c7Fd`TRFM!; zlnO|N3PynnLwzP@rW{a(3P*$qKXnR6g$hQ26hw7CYnll?atT3s1uRkxT&oRUuMJr>@FeSyqH1Um^h2ro)>wFLd6c4SF=+&k`@vU4;hkCE{ zeR9xCI<#f)uIPjWAQF|M;{$2?_%^N{&nXkZe8ROogq@4ifqJ%avyrlEd)BfXao$qw zyp#r1BPID6Z3?+qZls2pIon!Nnk4P@@yiew;5d z<(cic7`zyY;+GE1c;MAN9bFV>+p4DfT7F@1xJMXm-*xDKdRj{LWVZM_j%H0AW$F8D z7rh{$1$D|9soF9r%RYV9D`oBUfxT)ei@uR#ffhcX77EIUqf4Yk3p@+f-$do{g3(qYRF;b;km}-00000NkvXX Hu0mjfKhkKM diff --git a/packages/nodes-base/nodes/ActiveCampaign/activeCampaign.svg b/packages/nodes-base/nodes/ActiveCampaign/activeCampaign.svg new file mode 100644 index 0000000000000..345175516a3a1 --- /dev/null +++ b/packages/nodes-base/nodes/ActiveCampaign/activeCampaign.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/Affinity/Affinity.node.ts b/packages/nodes-base/nodes/Affinity/Affinity.node.ts index 21c8eb123aded..f80a7312a8d2e 100644 --- a/packages/nodes-base/nodes/Affinity/Affinity.node.ts +++ b/packages/nodes-base/nodes/Affinity/Affinity.node.ts @@ -27,7 +27,7 @@ export class Affinity implements INodeType { displayName: 'Affinity', name: 'affinity', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:affinity.png', + icon: { light: 'file:affinity.svg', dark: 'file:affinity.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Affinity/affinity.dark.svg b/packages/nodes-base/nodes/Affinity/affinity.dark.svg new file mode 100644 index 0000000000000..54b415375709e --- /dev/null +++ b/packages/nodes-base/nodes/Affinity/affinity.dark.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/packages/nodes-base/nodes/Affinity/affinity.png b/packages/nodes-base/nodes/Affinity/affinity.png deleted file mode 100644 index 7045900c567036ee9e7f6ba003f09d54ac8f59bf..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2762 zcmXAq2{=@3AI2w{PlD+IyzBl!1vGpbr-cXG-2~DB} zNl8@HNJz?TX9i;n(-_xx`o42r=XtL4ocsCz?*DzR=Q>w>yau^l4ERA3$Jdmm5%alA#Qx9QSS+g{Q7_cygF^;7WO*bU4bo`hY6Sh(WgP_AP zbzoW904@lQOgs(g&a|~zvakivE-cNX46GqrBAtftWJ8l_7;`}GB%PqmfhN(w`X~ZR zCZ2BM1YppMdhQ?&G{XYXw&nnc!0EF=C5YDZU}^iYR3ccQRnQDhpM%$BgDg;KWew=N zF+rAzBTFlQaqu(^^sEugu(9~l9Y{pEGBtvj##jJj3^*DAD#sZ(B*$5wjUq6e&}^yL zpWupgBF)f~g}*Je>wc2bz&OO;bHa)AL|pQ7mW*9Sjo|M$`6ZVo?Cr z5Rf`W1JhOwqZ=Gyh-WRJ39SG3g)?A-P^r^&%|NE9BcOSdZjJ%KFRLERfD!3xp-gqs zmWA^c{Md%24Hz2J7W2!-0`NfYSmAh}-W{>6=LvwhX%jcy5bNgHWzEnf#b}m+?=PwB zHLcJ!3+x&!f@^KNM9^JAxv`C0*p6sGGl*$&WE&p7c_?$k*lpdwYsJ`Q31hw_m$WF6 zMsqdfqrG_Mc%H2T4`<5L4c^iV*pyG%u)(b92CnG(FM@_);cR#i`|t^dQv8M`c0=Oa zx=iZ2v*Eg<$%^(Rewt(V$;rQO+B1zgk#w` z>=*?6hDHCfvEibREMw728lf!dBt}obJzwwuG^hJ{`9p++MfUNa0{*T*z~}M7YnRWP z|N258*x?HVyyrW7zKfh-2b|zMaZt09>uIR4z0_2caVqAxuQyBqT-sRpIrIMAU{_<= z<$|2-lt>?Mcf7Nuxr!ujWf`DNeV!QVZ6$**5@G^yb|!{0Tbmrl^z`_*Z|iz z^olGW8LaHkPx((%xZn7j2L<}Yce2mgm)_a6>R<5v4=$(Rvd03>tdT#cq# zHQ7=}D;81i*L>QQrh3}@`MzD%vs(P5XKiiHe%ubPrzfE;H>B-T!)s(>e$3CSi%bX4 z^P9U4rTZC;b3!`G{E5W6Hf?Fn{%<$F$BE@|i<1>&4pmgtWb!ky2@8|?wt)$7F?&z0 zjRF4;f%I8dg;x(A@3FZ;$=oYkP;%b4WNj7( zg^K(|)^MD8gG&D~tMDOnb+VTZRh*Z{maMJB8B_`dqa^oC+b7d}Ud0X=F2V1^E1aB9 zWD)l1z?y3tb`*su40s-d`Z9KKRk1;DK1A(epkFV}aVqLk=?Ika+va1Ck>?uea7rt2 zXe3j=ORcjhKJlAMq0yxxUh$Xo*HovI+v_8bDb(cXcKWtxy#Y)5j%4B^#Hglmhr9}w z0#)Xy8Ya(dEJ-I)7SkNvyefai`M?1R)H5w^nDpVPS5o23r^}ingYvWk zf2*}9X;g_WV*LL>$aYC?soomB56a?Y`tAt*v#p9YG6Y{eSPKMc;iRt z1!Lj+(bxS~HDPd%N4k+V(QfS&88toG78A_7dfVjCZUB>Q0Ps)vEc7?oeC%wxu@c;a zUu}};ib^Byd1STxzS?qNs#YLbsAKw<{BQB-lGI}ST}14a$DxY}DWnS+eDFcckAf?G zwcp38*QQ>`8LU<+dgNm!Yl}`lc9fC%k4Kq_E{vE}Zrn7+FVPB80gevVR&I-K^WMHh zpNg=GzaJwJzfOUdN|sgC>`33k66HS&J$lj_dN)Smh~4YBetSx8q!7wcks`dAcyLA+ zrz9OYJ3aTMAiL<@MMk+jM{hIsWq01_XSw+E?PGEkaE*AMC?>m#3K=)5{#aDn z5Lv2yHsQ)ivC?8Rv{0>xx!BlRxVX5SvPWLI8eb_=O71o*%6Y%l(OtTJVtjD(X0JfS zSRwbx#`J?S7*h7)5M^?`CHQP3@@H9kc`p^kEVc-@4UrTKlDk${0FWhj5ID?`k|cMY4SOW`lyqo*%#b1v&OoqfMvr$+%lx zO8JIGdg8$Dvl#Q_S?prR)Lz^O|6f}&@nXn5Y9v|o<+t|Z7cxi3fv3#(|9(o8Som-g zRX5SvH%Pti5LegzPgdKn2H?)a0_#}F{B}-|#zzL)?;E~oJLE<*Q!H_>voSwM&S9(i zN5{JI*qLnf=YY>fjWR>4rjv84&+d7trmb6$$;p`?JHrm&;GcA=^I+7^iJy?PbAoxOrAi%DuzLj_DmOYi%Z(TaqRrrjCDo=##)Sk4 y7i&-@S~q{*3CpmTQtq4hikyA(tbCWdqyXHFvOAx@YzzLAA#N^S&JUbU + + + + + + + + + + + + + diff --git a/packages/nodes-base/nodes/Bubble/Bubble.node.ts b/packages/nodes-base/nodes/Bubble/Bubble.node.ts index 4bc11de82156f..ea8b74b8f2c8a 100644 --- a/packages/nodes-base/nodes/Bubble/Bubble.node.ts +++ b/packages/nodes-base/nodes/Bubble/Bubble.node.ts @@ -15,7 +15,7 @@ export class Bubble implements INodeType { description: INodeTypeDescription = { displayName: 'Bubble', name: 'bubble', - icon: 'file:bubble.svg', + icon: { light: 'file:bubble.svg', dark: 'file:bubble.dark.svg' }, group: ['transform'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Bubble/bubble.dark.svg b/packages/nodes-base/nodes/Bubble/bubble.dark.svg new file mode 100644 index 0000000000000..002f4278bce32 --- /dev/null +++ b/packages/nodes-base/nodes/Bubble/bubble.dark.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/Bubble/bubble.svg b/packages/nodes-base/nodes/Bubble/bubble.svg index 1c41d3fe7efcd..c28005678a217 100644 --- a/packages/nodes-base/nodes/Bubble/bubble.svg +++ b/packages/nodes-base/nodes/Bubble/bubble.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + diff --git a/packages/nodes-base/nodes/Cal/CalTrigger.node.ts b/packages/nodes-base/nodes/Cal/CalTrigger.node.ts index 340797cec3bfb..8d2b6c3d176f8 100644 --- a/packages/nodes-base/nodes/Cal/CalTrigger.node.ts +++ b/packages/nodes-base/nodes/Cal/CalTrigger.node.ts @@ -15,7 +15,7 @@ export class CalTrigger implements INodeType { description: INodeTypeDescription = { displayName: 'Cal Trigger', name: 'calTrigger', - icon: 'file:cal.svg', + icon: { light: 'file:cal.svg', dark: 'file:cal.dark.svg' }, group: ['trigger'], version: [1, 2], subtitle: '=Events: {{$parameter["events"].join(", ")}}', diff --git a/packages/nodes-base/nodes/Cal/cal.dark.svg b/packages/nodes-base/nodes/Cal/cal.dark.svg new file mode 100644 index 0000000000000..032277d65a944 --- /dev/null +++ b/packages/nodes-base/nodes/Cal/cal.dark.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/packages/nodes-base/nodes/Cal/cal.svg b/packages/nodes-base/nodes/Cal/cal.svg index 618835733710a..f74af491081af 100644 --- a/packages/nodes-base/nodes/Cal/cal.svg +++ b/packages/nodes-base/nodes/Cal/cal.svg @@ -1 +1,9 @@ - + + + + + + + + + diff --git a/packages/nodes-base/nodes/DeepL/DeepL.node.ts b/packages/nodes-base/nodes/DeepL/DeepL.node.ts index 1dee0443a833b..926f1be909a1e 100644 --- a/packages/nodes-base/nodes/DeepL/DeepL.node.ts +++ b/packages/nodes-base/nodes/DeepL/DeepL.node.ts @@ -16,7 +16,7 @@ export class DeepL implements INodeType { description: INodeTypeDescription = { displayName: 'DeepL', name: 'deepL', - icon: 'file:deepl.svg', + icon: { light: 'file:deepl.svg', dark: 'file:deepl.dark.svg' }, group: ['input', 'output'], version: 1, description: 'Translate data using DeepL', diff --git a/packages/nodes-base/nodes/DeepL/deepL.dark.svg b/packages/nodes-base/nodes/DeepL/deepL.dark.svg new file mode 100644 index 0000000000000..6edfd447fa74a --- /dev/null +++ b/packages/nodes-base/nodes/DeepL/deepL.dark.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/DeepL/deepl.svg b/packages/nodes-base/nodes/DeepL/deepl.svg index 889cf28b77717..121c2a270b5b4 100644 --- a/packages/nodes-base/nodes/DeepL/deepl.svg +++ b/packages/nodes-base/nodes/DeepL/deepl.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + diff --git a/packages/nodes-base/nodes/NoOp/NoOp.node.ts b/packages/nodes-base/nodes/NoOp/NoOp.node.ts index f6de989c1ffb5..4116a3a52f454 100644 --- a/packages/nodes-base/nodes/NoOp/NoOp.node.ts +++ b/packages/nodes-base/nodes/NoOp/NoOp.node.ts @@ -10,6 +10,7 @@ export class NoOp implements INodeType { displayName: 'No Operation, do nothing', name: 'noOp', icon: 'fa:arrow-right', + iconColor: 'gray', group: ['organization'], version: 1, description: 'No Operation', diff --git a/packages/nodes-base/nodes/OpenAi/OpenAi.node.ts b/packages/nodes-base/nodes/OpenAi/OpenAi.node.ts index d4ed1e429d092..c7db40837a6c9 100644 --- a/packages/nodes-base/nodes/OpenAi/OpenAi.node.ts +++ b/packages/nodes-base/nodes/OpenAi/OpenAi.node.ts @@ -9,7 +9,7 @@ export class OpenAi implements INodeType { displayName: 'OpenAI', name: 'openAi', hidden: true, - icon: 'file:openAi.svg', + icon: { light: 'file:openAi.svg', dark: 'file:openAi.dark.svg' }, group: ['transform'], version: [1, 1.1], subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/OpenAi/openAi.dark.svg b/packages/nodes-base/nodes/OpenAi/openAi.dark.svg new file mode 100644 index 0000000000000..437cc59672e16 --- /dev/null +++ b/packages/nodes-base/nodes/OpenAi/openAi.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/RespondToWebhook/RespondToWebhook.node.ts b/packages/nodes-base/nodes/RespondToWebhook/RespondToWebhook.node.ts index c3a8c8ce0052e..1b6e3b48224d5 100644 --- a/packages/nodes-base/nodes/RespondToWebhook/RespondToWebhook.node.ts +++ b/packages/nodes-base/nodes/RespondToWebhook/RespondToWebhook.node.ts @@ -16,7 +16,7 @@ import { formatPrivateKey, generatePairedItemData } from '../../utils/utilities' export class RespondToWebhook implements INodeType { description: INodeTypeDescription = { displayName: 'Respond to Webhook', - icon: 'file:webhook.svg', + icon: { light: 'file:webhook.svg', dark: 'file:webhook.dark.svg' }, name: 'respondToWebhook', group: ['transform'], version: [1, 1.1], diff --git a/packages/nodes-base/nodes/RespondToWebhook/webhook.dark.svg b/packages/nodes-base/nodes/RespondToWebhook/webhook.dark.svg new file mode 100644 index 0000000000000..dc3754621e664 --- /dev/null +++ b/packages/nodes-base/nodes/RespondToWebhook/webhook.dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/nodes/Webhook/Webhook.node.ts b/packages/nodes-base/nodes/Webhook/Webhook.node.ts index 98b699962ac04..3fe4460cd8d09 100644 --- a/packages/nodes-base/nodes/Webhook/Webhook.node.ts +++ b/packages/nodes-base/nodes/Webhook/Webhook.node.ts @@ -46,7 +46,7 @@ export class Webhook extends Node { description: INodeTypeDescription = { displayName: 'Webhook', - icon: 'file:webhook.svg', + icon: { light: 'file:webhook.svg', dark: 'file:webhook.dark.svg' }, name: 'webhook', group: ['trigger'], version: [1, 1.1, 2], diff --git a/packages/nodes-base/nodes/Webhook/webhook.dark.svg b/packages/nodes-base/nodes/Webhook/webhook.dark.svg new file mode 100644 index 0000000000000..dc3754621e664 --- /dev/null +++ b/packages/nodes-base/nodes/Webhook/webhook.dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/workflow/src/Interfaces.ts b/packages/workflow/src/Interfaces.ts index 0eb60a9e352a3..5927cb4288d9a 100644 --- a/packages/workflow/src/Interfaces.ts +++ b/packages/workflow/src/Interfaces.ts @@ -1532,7 +1532,7 @@ export interface IWorkflowIssues { [key: string]: INodeIssues; } -export type NodeIconColor = 'blue' | 'red'; +export type NodeIconColor = 'gray' | 'black' | 'blue' | 'light-blue' | 'orange' | 'orange-red' | 'light-green' | 'green' | 'dark-green' | 'azure' | 'purple' | 'crimson'; export type Icon = `fa:${string}` | `file:${string}` | `node:${string}`; export type Themed = T | { light: T; dark: T }; From bfe1b275538fbee1c19b630cd20d9cc7129c5944 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Thu, 30 May 2024 18:33:14 +0200 Subject: [PATCH 06/20] Fix for stretched PNGs in node icons. --- packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue b/packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue index 86fa08b8b5796..3ad907287f53a 100644 --- a/packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue +++ b/packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue @@ -142,9 +142,10 @@ const badgeStyleData = computed((): Record => { text-align: center; } .nodeIconImage { - width: 100%; max-width: 100%; max-height: 100%; + width: auto; + height: auto; } .badge { From 1de71c757e311e2e41c81e48049593ad8eed40f1 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Thu, 30 May 2024 18:36:56 +0200 Subject: [PATCH 07/20] Some dark mode icons. --- packages/nodes-base/nodes/Amqp/Amqp.node.ts | 2 +- packages/nodes-base/nodes/Amqp/amqp.png | Bin 550 -> 0 bytes packages/nodes-base/nodes/Amqp/amqp.svg | 9 +++ .../nodes/CircleCi/CircleCi.node.ts | 2 +- .../nodes/CircleCi/circleCi.dark.svg | 3 + .../nodes-base/nodes/CircleCi/circleCi.png | Bin 1111 -> 0 bytes .../nodes-base/nodes/CircleCi/circleCi.svg | 3 + .../nodes/Citrix/ADC/CitrixAdc.node.ts | 2 +- .../nodes/Citrix/ADC/citrix.dark.svg | 3 + .../nodes-base/nodes/Citrix/ADC/citrix.svg | 4 +- .../nodes/Clockify/Clockify.node.ts | 2 +- .../nodes/Clockify/clockify.dark.svg | 4 ++ .../nodes-base/nodes/Clockify/clockify.svg | 5 +- .../nodes-base/nodes/Cockpit/Cockpit.node.ts | 2 +- .../nodes-base/nodes/Cockpit/cockpit.dark.svg | 3 + packages/nodes-base/nodes/Cockpit/cockpit.png | Bin 834 -> 0 bytes packages/nodes-base/nodes/Cockpit/cockpit.svg | 3 + .../nodes/CrowdDev/CrowdDev.node.ts | 2 +- .../nodes/CrowdDev/crowdDev.dark.svg | 4 ++ .../nodes-base/nodes/CrowdDev/crowdDev.svg | 5 +- .../nodes/CustomerIo/CustomerIo.node.ts | 2 +- .../nodes/CustomerIo/customerio.dark.svg | 3 + .../nodes/CustomerIo/customerio.svg | 4 +- packages/nodes-base/nodes/Drift/Drift.node.ts | 2 +- .../nodes-base/nodes/Drift/drift.dark.svg | 7 ++ packages/nodes-base/nodes/Drift/drift.png | Bin 882 -> 0 bytes packages/nodes-base/nodes/Drift/drift.svg | 7 ++ packages/nodes-base/nodes/Egoi/Egoi.node.ts | 2 +- packages/nodes-base/nodes/Egoi/egoi.png | Bin 1011 -> 0 bytes packages/nodes-base/nodes/Egoi/egoi.svg | 5 ++ packages/nodes-base/nodes/Flow/Flow.node.ts | 2 +- packages/nodes-base/nodes/Flow/flow.png | Bin 981 -> 0 bytes packages/nodes-base/nodes/Flow/flow.svg | 4 ++ .../nodes/Freshdesk/Freshdesk.node.ts | 2 +- .../nodes-base/nodes/Freshdesk/freshdesk.png | Bin 1309 -> 0 bytes .../nodes-base/nodes/Freshdesk/freshdesk.svg | 4 ++ .../nodes-base/nodes/Github/Github.node.ts | 2 +- .../nodes-base/nodes/Github/github.dark.svg | 3 + packages/nodes-base/nodes/Github/github.svg | 4 +- .../Perspective/GooglePerspective.node.ts | 2 +- .../Perspective/googlePerspective.dark.svg | 3 + .../Google/Perspective/googlePerspective.svg | 3 + .../nodes/Google/Perspective/perspective.svg | 1 - .../nodes/Google/Task/GoogleTasks.node.ts | 2 +- .../nodes/Google/Task/googleTasks.png | Bin 2396 -> 0 bytes .../nodes/Google/Task/googleTasks.svg | 4 ++ .../nodes-base/nodes/HighLevel/highLevel.svg | 12 +++- .../nodes/HumanticAI/HumanticAi.node.ts | 2 +- .../nodes/HumanticAI/humanticai.png | Bin 1639 -> 0 bytes .../nodes/HumanticAI/humanticai.svg | 6 ++ .../nodes/InvoiceNinja/invoiceNinja.svg | 5 +- packages/nodes-base/nodes/Jenkins/jenkins.svg | 61 +++++++++++++++++- packages/nodes-base/nodes/Kafka/Kafka.node.ts | 2 +- .../nodes-base/nodes/Kafka/kafka.dark.svg | 3 + packages/nodes-base/nodes/Kafka/kafka.svg | 4 +- packages/nodes-base/nodes/Ldap/Ldap.node.ts | 2 +- packages/nodes-base/nodes/Ldap/ldap.dark.svg | 4 ++ packages/nodes-base/nodes/Ldap/ldap.svg | 5 +- packages/nodes-base/nodes/Lemlist/lemlist.svg | 7 +- .../nodes/LoneScale/LoneScale.node.ts | 2 +- .../nodes/LoneScale/loneScale.dark.svg | 8 +++ .../nodes-base/nodes/LoneScale/loneScale.svg | 8 +++ .../nodes/LoneScale/lonescale-logo.svg | 1 - .../nodes/Mailchimp/Mailchimp.node.ts | 2 +- .../nodes/Mailchimp/mailchimp.dark.svg | 14 ++++ .../nodes-base/nodes/Mailchimp/mailchimp.svg | 17 ++++- .../nodes/Marketstack/Marketstack.node.ts | 2 +- .../nodes/Marketstack/marketstack.dark.svg | 3 + .../nodes/Marketstack/marketstack.svg | 4 +- .../Dynamics/MicrosoftDynamicsCrm.node.ts | 2 +- .../nodes/Microsoft/Dynamics/dynamicsCrm.svg | 1 - .../Dynamics/microsoftDynamicsCrm.dark.svg | 3 + .../Dynamics/microsoftDynamicsCrm.svg | 3 + .../nodes-base/nodes/Mocean/Mocean.node.ts | 2 +- .../nodes-base/nodes/Mocean/mocean.dark.svg | 3 + packages/nodes-base/nodes/Mocean/mocean.svg | 4 +- packages/nodes-base/nodes/Msg91/Msg91.node.ts | 2 +- .../nodes-base/nodes/Msg91/msg91.dark.svg | 3 + packages/nodes-base/nodes/Msg91/msg91.png | Bin 1166 -> 0 bytes packages/nodes-base/nodes/Msg91/msg91.svg | 3 + .../OpenWeatherMap/OpenWeatherMap.node.ts | 3 +- .../nodes/OpenWeatherMap/openWeatherMap.svg | 5 ++ packages/nodes-base/nodes/Orbit/Orbit.node.ts | 2 +- .../nodes-base/nodes/Orbit/orbit.dark.svg | 7 ++ packages/nodes-base/nodes/Orbit/orbit.svg | 8 ++- packages/nodes-base/nodes/Oura/Oura.node.ts | 2 +- packages/nodes-base/nodes/Oura/oura.dark.svg | 3 + packages/nodes-base/nodes/Oura/oura.svg | 4 +- .../nodes/ProfitWell/ProfitWell.node.ts | 2 +- .../nodes/ProfitWell/profitwell.dark.svg | 5 ++ .../nodes/ProfitWell/profitwell.png | Bin 1870 -> 0 bytes .../nodes/ProfitWell/profitwell.svg | 5 ++ .../nodes/RabbitMQ/RabbitMQ.node.ts | 2 +- .../nodes-base/nodes/RabbitMQ/rabbitmq.png | Bin 527 -> 0 bytes .../nodes-base/nodes/RabbitMQ/rabbitmq.svg | 3 + .../nodes/SentryIo/SentryIo.node.ts | 2 +- .../nodes/SentryIo/sentryio.dark.svg | 3 + .../nodes-base/nodes/SentryIo/sentryio.svg | 4 +- .../nodes/TimescaleDb/TimescaleDb.node.ts | 2 +- .../nodes/TimescaleDb/timescale.svg | 1 - .../nodes/TimescaleDb/timescaleDb.dark.svg | 15 +++++ .../nodes/TimescaleDb/timescaleDb.svg | 8 +++ .../nodes-base/nodes/Twitter/Twitter.node.ts | 2 +- packages/nodes-base/nodes/Twitter/x.dark.svg | 3 + packages/nodes-base/nodes/Twitter/x.svg | 4 +- .../nodes/Typeform/TypeformTrigger.node.ts | 2 +- .../nodes/Typeform/typeform.dark.svg | 3 + .../nodes-base/nodes/Typeform/typeform.svg | 4 +- .../nodes-base/nodes/Vonage/Vonage.node.ts | 2 +- .../nodes-base/nodes/Vonage/vonage.dark.svg | 3 + packages/nodes-base/nodes/Vonage/vonage.png | Bin 855 -> 0 bytes packages/nodes-base/nodes/Vonage/vonage.svg | 3 + packages/nodes-base/nodes/Wekan/Wekan.node.ts | 2 +- packages/nodes-base/nodes/Wekan/wekan.png | Bin 941 -> 0 bytes packages/nodes-base/nodes/Wekan/wekan.svg | 4 ++ 115 files changed, 386 insertions(+), 58 deletions(-) delete mode 100644 packages/nodes-base/nodes/Amqp/amqp.png create mode 100644 packages/nodes-base/nodes/Amqp/amqp.svg create mode 100644 packages/nodes-base/nodes/CircleCi/circleCi.dark.svg delete mode 100644 packages/nodes-base/nodes/CircleCi/circleCi.png create mode 100644 packages/nodes-base/nodes/CircleCi/circleCi.svg create mode 100644 packages/nodes-base/nodes/Citrix/ADC/citrix.dark.svg create mode 100644 packages/nodes-base/nodes/Clockify/clockify.dark.svg create mode 100644 packages/nodes-base/nodes/Cockpit/cockpit.dark.svg delete mode 100644 packages/nodes-base/nodes/Cockpit/cockpit.png create mode 100644 packages/nodes-base/nodes/Cockpit/cockpit.svg create mode 100644 packages/nodes-base/nodes/CrowdDev/crowdDev.dark.svg create mode 100644 packages/nodes-base/nodes/CustomerIo/customerio.dark.svg create mode 100644 packages/nodes-base/nodes/Drift/drift.dark.svg delete mode 100644 packages/nodes-base/nodes/Drift/drift.png create mode 100644 packages/nodes-base/nodes/Drift/drift.svg delete mode 100644 packages/nodes-base/nodes/Egoi/egoi.png create mode 100644 packages/nodes-base/nodes/Egoi/egoi.svg delete mode 100644 packages/nodes-base/nodes/Flow/flow.png create mode 100644 packages/nodes-base/nodes/Flow/flow.svg delete mode 100644 packages/nodes-base/nodes/Freshdesk/freshdesk.png create mode 100644 packages/nodes-base/nodes/Freshdesk/freshdesk.svg create mode 100644 packages/nodes-base/nodes/Github/github.dark.svg create mode 100644 packages/nodes-base/nodes/Google/Perspective/googlePerspective.dark.svg create mode 100644 packages/nodes-base/nodes/Google/Perspective/googlePerspective.svg delete mode 100644 packages/nodes-base/nodes/Google/Perspective/perspective.svg delete mode 100644 packages/nodes-base/nodes/Google/Task/googleTasks.png create mode 100644 packages/nodes-base/nodes/Google/Task/googleTasks.svg delete mode 100644 packages/nodes-base/nodes/HumanticAI/humanticai.png create mode 100644 packages/nodes-base/nodes/HumanticAI/humanticai.svg create mode 100644 packages/nodes-base/nodes/Kafka/kafka.dark.svg create mode 100644 packages/nodes-base/nodes/Ldap/ldap.dark.svg create mode 100644 packages/nodes-base/nodes/LoneScale/loneScale.dark.svg create mode 100644 packages/nodes-base/nodes/LoneScale/loneScale.svg delete mode 100644 packages/nodes-base/nodes/LoneScale/lonescale-logo.svg create mode 100644 packages/nodes-base/nodes/Mailchimp/mailchimp.dark.svg create mode 100644 packages/nodes-base/nodes/Marketstack/marketstack.dark.svg delete mode 100644 packages/nodes-base/nodes/Microsoft/Dynamics/dynamicsCrm.svg create mode 100644 packages/nodes-base/nodes/Microsoft/Dynamics/microsoftDynamicsCrm.dark.svg create mode 100644 packages/nodes-base/nodes/Microsoft/Dynamics/microsoftDynamicsCrm.svg create mode 100644 packages/nodes-base/nodes/Mocean/mocean.dark.svg create mode 100644 packages/nodes-base/nodes/Msg91/msg91.dark.svg delete mode 100644 packages/nodes-base/nodes/Msg91/msg91.png create mode 100644 packages/nodes-base/nodes/Msg91/msg91.svg create mode 100644 packages/nodes-base/nodes/OpenWeatherMap/openWeatherMap.svg create mode 100644 packages/nodes-base/nodes/Orbit/orbit.dark.svg create mode 100644 packages/nodes-base/nodes/Oura/oura.dark.svg create mode 100644 packages/nodes-base/nodes/ProfitWell/profitwell.dark.svg delete mode 100644 packages/nodes-base/nodes/ProfitWell/profitwell.png create mode 100644 packages/nodes-base/nodes/ProfitWell/profitwell.svg delete mode 100644 packages/nodes-base/nodes/RabbitMQ/rabbitmq.png create mode 100644 packages/nodes-base/nodes/RabbitMQ/rabbitmq.svg create mode 100644 packages/nodes-base/nodes/SentryIo/sentryio.dark.svg delete mode 100644 packages/nodes-base/nodes/TimescaleDb/timescale.svg create mode 100644 packages/nodes-base/nodes/TimescaleDb/timescaleDb.dark.svg create mode 100644 packages/nodes-base/nodes/TimescaleDb/timescaleDb.svg create mode 100644 packages/nodes-base/nodes/Twitter/x.dark.svg create mode 100644 packages/nodes-base/nodes/Typeform/typeform.dark.svg create mode 100644 packages/nodes-base/nodes/Vonage/vonage.dark.svg delete mode 100644 packages/nodes-base/nodes/Vonage/vonage.png create mode 100644 packages/nodes-base/nodes/Vonage/vonage.svg delete mode 100644 packages/nodes-base/nodes/Wekan/wekan.png create mode 100644 packages/nodes-base/nodes/Wekan/wekan.svg diff --git a/packages/nodes-base/nodes/Amqp/Amqp.node.ts b/packages/nodes-base/nodes/Amqp/Amqp.node.ts index 5a7bb808b9f4a..f917547d6b1c9 100644 --- a/packages/nodes-base/nodes/Amqp/Amqp.node.ts +++ b/packages/nodes-base/nodes/Amqp/Amqp.node.ts @@ -19,7 +19,7 @@ export class Amqp implements INodeType { displayName: 'AMQP Sender', name: 'amqp', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:amqp.png', + icon: 'file:amqp.svg', group: ['transform'], version: 1, description: 'Sends a raw-message via AMQP 1.0, executed once per item', diff --git a/packages/nodes-base/nodes/Amqp/amqp.png b/packages/nodes-base/nodes/Amqp/amqp.png deleted file mode 100644 index 0f0345078c91652ec2d8cbdc5a600b3f8d2f06ce..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 550 zcmeAS@N?(olHy`uVBq!ia0vp^HXzKw1|+Ti+$>^XV0`Q8;uws1f$ymQRBRD& z;(!tSPRVKaFI;Pk&fc_pEAP#czOyznUOSbs8%JAidn3Pn@=V=jEk*9aF=`xk2fkN6 z5a3!TyYSAf&Zc5*p;*@4k9fbalz*r-RNA2>F#Gm9zJux|-!ujGc=Z`1U;M=+So$mW zvU$Glowti;+Rnat=FGhencGV8nP<9Z#xC6Nw%EgfYj@CoagGwR$+D-p=QSJh{*7-s zal7U=<9(ZTPu%(a3w#4Bm%qQqI?1wm^Pa;K6JlP!Nnx_K7b);=Jf`sN*=Lqymi?ES z=3g*Zk&w-qG~-QziUey#=K0!*4|rqN)wujiI4H__%evX3$w%ziOrfQcTuz3?%lqGY zzmVk=JCk1W_D-K!QD0x*-07<%_a&?nx!_&ZRk1ec;Py2&vM1KW-#WB{61hEZ1 z?{D$kGf#Q5&FxUS5@&=MSEP@wc>4>DR9n9(Zlx10l?J@zxq2xyz<>J4(tJi2JOS)PB_ + + + + + + + + diff --git a/packages/nodes-base/nodes/CircleCi/CircleCi.node.ts b/packages/nodes-base/nodes/CircleCi/CircleCi.node.ts index 8d0316fe7e9fc..9cca3546b82ed 100644 --- a/packages/nodes-base/nodes/CircleCi/CircleCi.node.ts +++ b/packages/nodes-base/nodes/CircleCi/CircleCi.node.ts @@ -15,7 +15,7 @@ export class CircleCi implements INodeType { displayName: 'CircleCI', name: 'circleCi', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:circleCi.png', + icon: { light: 'file:circleCi.svg', dark: 'file:circleCi.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/CircleCi/circleCi.dark.svg b/packages/nodes-base/nodes/CircleCi/circleCi.dark.svg new file mode 100644 index 0000000000000..b4a20b84bc801 --- /dev/null +++ b/packages/nodes-base/nodes/CircleCi/circleCi.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/CircleCi/circleCi.png b/packages/nodes-base/nodes/CircleCi/circleCi.png deleted file mode 100644 index 7b8a5a4766891fb8fb8df40efc6fefab159bb0f2..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1111 zcmeAS@N?(olHy`uVBq!ia0vp^ZXnFT3?e@WZ39v>1AIbUfwZWIC<`--sIVxI4dIFj ziva~iL_}m{WFQQntf-)(@6^8j9TXq`Xay&qoDWK7M6%K97Nc+1k^^F(l&f zl&PI%j|_NRRZo{W-#8t0D(c#_vRjq^{}(oUD|EhP_*~@o;Ks?R^K!IBrUt%S_v~&| z?F9)_wy#m!m)5uQ*y_B!XVJ5~lXXVnKF>>%{IVYQd^4}_e{iHo@bJp`d|Qqn7kk;) zhq#T447*G3oSW!j%V4>NK|~<+%1b-hd(4_%=6Wj1>vHlY+Hr6*@( zIUA?5e}BT1yShg+$T#hna?-PvilR$()EoozroPDb)N*_2_+bZ&r}cx3C^fmKcIlHQ zsrmnHD4PFSO679m!T(+rA)A)ISlM+bJ+v^3wQrf?0mGJvIjO2{NhfUd`xjo1NYr^; zvUalPrncYd$xkyU?TlLGs$;2q@>%tbuqC$+zxRFArZmSsJoOc41li3q+<>zu9T3^n{|qZGG=f$JD!@IrRM8Y2HiX zKHK-aXgXK9c>0w2Hwy1Pvdq_QyYy+>_7}k`DtIN%XHHwbOfBbU#WM4KhfO`UsA@=U zm|~#cEj?pmduEKGHNW!Otl+p;*K*%w%;TB&fA!H@g#vAf8NM?98x$LNIH(?(@>{+y zKzyl^{PNm^-d9yuPX6`x-(H@3A%*@M`*!?4wES1=c#$-TkQs+&<*Id|XlGLJXf zHjl3*ZxK9{E14(ccv|b^rbBGAvK5bKJwN%%{jH6h-VtVpMSL3<^XdNQjXS|9nA`3Y zBe&;VEs^HC?%1YJDcTeqSK4*W;98@NFy85}Sb4q9e E00FMb6#xJL diff --git a/packages/nodes-base/nodes/CircleCi/circleCi.svg b/packages/nodes-base/nodes/CircleCi/circleCi.svg new file mode 100644 index 0000000000000..73ef3bae05a5d --- /dev/null +++ b/packages/nodes-base/nodes/CircleCi/circleCi.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Citrix/ADC/CitrixAdc.node.ts b/packages/nodes-base/nodes/Citrix/ADC/CitrixAdc.node.ts index 121409ece0070..be4ab4c01a10c 100644 --- a/packages/nodes-base/nodes/Citrix/ADC/CitrixAdc.node.ts +++ b/packages/nodes-base/nodes/Citrix/ADC/CitrixAdc.node.ts @@ -17,7 +17,7 @@ export class CitrixAdc implements INodeType { description: INodeTypeDescription = { displayName: 'Citrix ADC', name: 'citrixAdc', - icon: 'file:citrix.svg', + icon: { light: 'file:citrix.svg', dark: 'file:citrix.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Citrix/ADC/citrix.dark.svg b/packages/nodes-base/nodes/Citrix/ADC/citrix.dark.svg new file mode 100644 index 0000000000000..690c357531682 --- /dev/null +++ b/packages/nodes-base/nodes/Citrix/ADC/citrix.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Citrix/ADC/citrix.svg b/packages/nodes-base/nodes/Citrix/ADC/citrix.svg index 19e9d9673fcbd..c4c9cdbdf3470 100644 --- a/packages/nodes-base/nodes/Citrix/ADC/citrix.svg +++ b/packages/nodes-base/nodes/Citrix/ADC/citrix.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/Clockify/Clockify.node.ts b/packages/nodes-base/nodes/Clockify/Clockify.node.ts index 17793feda67be..a78999bbdbf5b 100644 --- a/packages/nodes-base/nodes/Clockify/Clockify.node.ts +++ b/packages/nodes-base/nodes/Clockify/Clockify.node.ts @@ -35,7 +35,7 @@ export class Clockify implements INodeType { description: INodeTypeDescription = { displayName: 'Clockify', name: 'clockify', - icon: 'file:clockify.svg', + icon: { light: 'file:clockify.svg', dark: 'file:clockify.dark.svg' }, group: ['transform'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Clockify/clockify.dark.svg b/packages/nodes-base/nodes/Clockify/clockify.dark.svg new file mode 100644 index 0000000000000..33527e4611954 --- /dev/null +++ b/packages/nodes-base/nodes/Clockify/clockify.dark.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/Clockify/clockify.svg b/packages/nodes-base/nodes/Clockify/clockify.svg index 1750886588623..27fc2670ff84b 100644 --- a/packages/nodes-base/nodes/Clockify/clockify.svg +++ b/packages/nodes-base/nodes/Clockify/clockify.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + diff --git a/packages/nodes-base/nodes/Cockpit/Cockpit.node.ts b/packages/nodes-base/nodes/Cockpit/Cockpit.node.ts index ba88d62fbbade..058569b6e7843 100644 --- a/packages/nodes-base/nodes/Cockpit/Cockpit.node.ts +++ b/packages/nodes-base/nodes/Cockpit/Cockpit.node.ts @@ -24,7 +24,7 @@ export class Cockpit implements INodeType { displayName: 'Cockpit', name: 'cockpit', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:cockpit.png', + icon: { light: 'file:cockpit.svg', dark: 'file:cockpit.dark.svg' }, group: ['output'], version: 1, subtitle: '={{ $parameter["operation"] + ": " + $parameter["resource"] }}', diff --git a/packages/nodes-base/nodes/Cockpit/cockpit.dark.svg b/packages/nodes-base/nodes/Cockpit/cockpit.dark.svg new file mode 100644 index 0000000000000..357b546b26aa9 --- /dev/null +++ b/packages/nodes-base/nodes/Cockpit/cockpit.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Cockpit/cockpit.png b/packages/nodes-base/nodes/Cockpit/cockpit.png deleted file mode 100644 index ddbe6ead67664a8d4cf86d0fc108d589541a93a3..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 834 zcmeAS@N?(olHy`uVBq!ia0vp^HXzKw3=&b&bO2Ik0(?STfi&6R|NsAg|NdoTW4m(Y z%E5yNRa8_SJ$fW2CMF~##L3C|>C>kZCr&(g@W8~xL{n3c@{CFJ8R3 zef##tjT@Vqn!LQcbaZt1`1o$zxUqZp?k!ukELpOoy}dm%GczJ0!otErQBm>y`Sa(_ zom;zhZC_tsVPT=4pPzw&!P~cQw{PFRa^=d|vuDT0$D5j(a+m&&0(wTcB*-tAfqn11 z?_WN=y}NE=w7;8$k@Uq2FAqz|S%+Qq9+fkj-(UG^>8jVKXZrgd-&V4iD}?v%ChPZxTgzDg z2V`b1U*)^G?f;6IzHe2w7cnx5PZfSMjgPbH^^DsqoW1rI9@*Q{W+cExHx^5ZO= zH&L)gdCE!IqO9D7F>5MBCd)p)!a8Y&flOX_OKHfFx58fLE=8_fRW%P6No}4eyvb#~ zGmmZ20q&xl#+=4aX36XJcfY>SB0sO{X1OiXQK1u7Mq$@o&qdFxYw-Q{m2JTbrkf7O z^4q!M8d`St+c|9RtPS94j9J>a+vdiEw^wzT@?OMCH3o^EIPt@HY2kE_JvDph^}lG< zt330*Q+u+w$-QH#g>%oI+benbzU2-b@89#>-YtK#!$y9`+raP7xq4RR9KK^}negoM zSF4rWeTufLtkd7yxpm}yzArDxRq|3ba_!EyC7@+$Du)ZU=w j{DtdIx9u=aw` + + diff --git a/packages/nodes-base/nodes/CrowdDev/CrowdDev.node.ts b/packages/nodes-base/nodes/CrowdDev/CrowdDev.node.ts index 76cd06d60a569..b245e79a57282 100644 --- a/packages/nodes-base/nodes/CrowdDev/CrowdDev.node.ts +++ b/packages/nodes-base/nodes/CrowdDev/CrowdDev.node.ts @@ -5,7 +5,7 @@ export class CrowdDev implements INodeType { description: INodeTypeDescription = { displayName: 'crowd.dev', name: 'crowdDev', - icon: 'file:crowdDev.svg', + icon: { light: 'file:crowdDev.svg', dark: 'file:crowdDev.dark.svg' }, group: ['transform'], version: 1, subtitle: '={{ $parameter["operation"] + ": " + $parameter["resource"] }}', diff --git a/packages/nodes-base/nodes/CrowdDev/crowdDev.dark.svg b/packages/nodes-base/nodes/CrowdDev/crowdDev.dark.svg new file mode 100644 index 0000000000000..d991be4a1579c --- /dev/null +++ b/packages/nodes-base/nodes/CrowdDev/crowdDev.dark.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/CrowdDev/crowdDev.svg b/packages/nodes-base/nodes/CrowdDev/crowdDev.svg index c131b92df97ac..80971d75732d1 100644 --- a/packages/nodes-base/nodes/CrowdDev/crowdDev.svg +++ b/packages/nodes-base/nodes/CrowdDev/crowdDev.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + diff --git a/packages/nodes-base/nodes/CustomerIo/CustomerIo.node.ts b/packages/nodes-base/nodes/CustomerIo/CustomerIo.node.ts index d9526152e628a..6b82c4aab0628 100644 --- a/packages/nodes-base/nodes/CustomerIo/CustomerIo.node.ts +++ b/packages/nodes-base/nodes/CustomerIo/CustomerIo.node.ts @@ -16,7 +16,7 @@ export class CustomerIo implements INodeType { description: INodeTypeDescription = { displayName: 'Customer.io', name: 'customerIo', - icon: 'file:customerio.svg', + icon: { light: 'file:customerio.svg', dark: 'file:customerio.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/CustomerIo/customerio.dark.svg b/packages/nodes-base/nodes/CustomerIo/customerio.dark.svg new file mode 100644 index 0000000000000..524e5f06e6833 --- /dev/null +++ b/packages/nodes-base/nodes/CustomerIo/customerio.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/CustomerIo/customerio.svg b/packages/nodes-base/nodes/CustomerIo/customerio.svg index 6230b5741ac9d..a26581f23f8db 100644 --- a/packages/nodes-base/nodes/CustomerIo/customerio.svg +++ b/packages/nodes-base/nodes/CustomerIo/customerio.svg @@ -1 +1,3 @@ - + + + diff --git a/packages/nodes-base/nodes/Drift/Drift.node.ts b/packages/nodes-base/nodes/Drift/Drift.node.ts index 2cf3770747fd7..ef385d573de20 100644 --- a/packages/nodes-base/nodes/Drift/Drift.node.ts +++ b/packages/nodes-base/nodes/Drift/Drift.node.ts @@ -14,7 +14,7 @@ export class Drift implements INodeType { displayName: 'Drift', name: 'drift', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:drift.png', + icon: { light: 'file:drift.svg', dark: 'file:drift.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Drift/drift.dark.svg b/packages/nodes-base/nodes/Drift/drift.dark.svg new file mode 100644 index 0000000000000..5de7e7e2cda18 --- /dev/null +++ b/packages/nodes-base/nodes/Drift/drift.dark.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/packages/nodes-base/nodes/Drift/drift.png b/packages/nodes-base/nodes/Drift/drift.png deleted file mode 100644 index 98d008983c0e31b5872efac85f26ac79f34c5e7a..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 882 zcmeAS@N?(olHy`uVBq!ia0vp^HXzKw3=&b&bO2IY0(?STfwa85yc!rNDJcPIb#-+h zsj8|9WIzB!7RZJOLbz~21qB756p*W|tPEkmrGN~e79apJR8&;pYzPA=0x=WF1zHW! z3lxNC2bu*T+wNW8}3tC*%LM@BOcv*B?H& zow?w-eY#<3kgxam*OtG%KNoQ6ij>^-lzwIGZ546scj)&z-YEjtR=vBev2=3Xd%q2n zmM~_`TA>hf+dklA@q&W$5lWW~Up?l1mc8|M-63hV>>Il`T=3c!{M1N%z0P@_2NzEV z_kZZxx?;k2bI~n4dKPj|wzPTlJjpBg>v=_NX8WJb6UzcWluS6)uOYEbV@Il5n6y>d ztdKgrydKfN)s9!>yYn|%yswSCQCxTN(pS+ZGNzNyAF8$+>lDm{r5e&Q|HqhrZc>oXU0Zf*u5qBLm-GF^6*-)`iT(+%Gwczixcqp^&eezPD z$BTc9yxml+ckMD`(pDRnBv;NaU02ySy{isz%zxszvC3i5`nrxSpWd;koR9GQruDoj zC0UxeNB@)imZwugCl?xc7YSeNU=OSDToXPmTxjOke-k=4<)kV+TstqPp=WWdcV6=p z*|)D&`&g%XP?-j2kNV* z-Q?D~nYKWoBjjBHpBK~OTW<@)kDgmo5YPN$-c0r2ucB9)e!dg`dZl64hOZv(hy0>q s*7|;UxZL-!gzuc2g75D946kE8zyA625TUL&z(mO4>FVdQ&MBb@013or!2kdN diff --git a/packages/nodes-base/nodes/Drift/drift.svg b/packages/nodes-base/nodes/Drift/drift.svg new file mode 100644 index 0000000000000..6894deeeb5113 --- /dev/null +++ b/packages/nodes-base/nodes/Drift/drift.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/packages/nodes-base/nodes/Egoi/Egoi.node.ts b/packages/nodes-base/nodes/Egoi/Egoi.node.ts index acffe03e97db7..f50136afee82a 100644 --- a/packages/nodes-base/nodes/Egoi/Egoi.node.ts +++ b/packages/nodes-base/nodes/Egoi/Egoi.node.ts @@ -18,7 +18,7 @@ export class Egoi implements INodeType { displayName: 'E-goi', name: 'egoi', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:egoi.png', + icon: 'file:egoi.svg', group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Egoi/egoi.png b/packages/nodes-base/nodes/Egoi/egoi.png deleted file mode 100644 index c1c02a89f6429f8f6e22d50f55426d1e4681629c..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1011 zcmVp*Z`*2{r~^`{{I24+99yp0Ib<0u-hE3+7YkX0IJy@u-gf)+7++b8L!*<{r&)? z*7p4V+V1z_^7-BH_$aa5a>C>7_xs7_^Sj^hd&T5TxZc9z@w43Snb7Ef$K_wW;8VKa z@%sF#*X*R!>vqKBYrx{>^!nE8_0Q<^j?CwW$>!+w`mWmTp3>@)&F5OY;6b+CWWV7s zvfMef-A~U)?f?J-2}wjjR7l6|)!TNeFc1ddFbNPKg!92Fo~_zid$8^MKiZx^B_iE+ z*L~~1R&Ubzm}HDXZn@>Uu&)sIJ7%))*MFw9WF*?}2ZQA@iBwFrgMXug;Y&m^9{R<{ z=b@^q#oPRSQ;y2X<=*P~>CTToBa(}Ns|XC#iAR^)5|Yn=O1?-CyOxyFs}lraSitDA zO{M^@9q_}Fq~IEzgivCM`4`JbdZ4av7?OWB*y`d9YX{o5V-SUbLULz79>71xZ!8*T zNSWEU!#HS~;olaq-Nk{ZqR4>FWUtzvo%fE~UQ=#)Mn)d#8TP~>F&6@;@su{3*EZwQ zYn$*~JxjwHbAQPyVLOt-Eblfi;aF@Lu1Nb>a$~?2;2F~PLA)fbHgT5@sw0M!jC)ub zdxBV%`EFe0N6p9#hue1c;h~Q$k8c%jCR%{FLtWcJ$SsX+cqGFf4n$7gAUHOVw9)3- z2V>)U539p8xX~f!nbKxks_~?UefmJ=i1q%;dR|!SbnviU(Q)vR?}%IN&_|^G&XaHP zm~0?CE!z=>xO<-*`b?gCxH!iF%uRxPYe=*jugI#8;~^=*J-x71QlAw;E{sTxa|kU<<0)c2LcNL?v9lGFDkEIhWv}F=hkYFG6Fs@b zp0OpYZk_5ohGkD3tXFsKs)YlbD%+eo{y1uv&d9Wf)e&E*eY6gIEWa=#Y=pYuF08T4 zKf@ueDqPP-7QovtCF*1yJN_3g$?g=_s{y>@ejH0m&v$rSWvx{kXDE&|B~rNt`Iw(d>>%FP+ zRe3NBn6sI}G6bL);C}T!n?9S#Hczub^xbcN^RQ%}WrO-Ic@pO9*VW_>LBf7~gX@>k z8p6P%!?XV}W?p<(HwC1Gg2TA(qJrQT*$6Hk)yb|1E8{T58C;jSkzHvSiDp~0SH?`x hULW>f_Lf_8{s3A1Hh$*3!rcG>002ovPDHLkV1hie7Uci{ diff --git a/packages/nodes-base/nodes/Egoi/egoi.svg b/packages/nodes-base/nodes/Egoi/egoi.svg new file mode 100644 index 0000000000000..50661a57794a9 --- /dev/null +++ b/packages/nodes-base/nodes/Egoi/egoi.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/nodes/Flow/Flow.node.ts b/packages/nodes-base/nodes/Flow/Flow.node.ts index c39a37d7987d4..0220fc9ed1648 100644 --- a/packages/nodes-base/nodes/Flow/Flow.node.ts +++ b/packages/nodes-base/nodes/Flow/Flow.node.ts @@ -16,7 +16,7 @@ export class Flow implements INodeType { displayName: 'Flow', name: 'flow', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:flow.png', + icon: 'file:flow.svg', group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Flow/flow.png b/packages/nodes-base/nodes/Flow/flow.png deleted file mode 100644 index 2918f8573e97be17357999b40945210174a0a9f4..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 981 zcmV;`11kK9P)F{k(dpZ7hf_@deWtlj^p-2bNA|23!hq}u{iMzN?)Lw<;s1re`qb?IyyO4l@BY!{{CvFm zSg`marTEV3|3$0#DW>?^@Bhc<|Gwk@wc!89-~3^-`7WmT8l?E;^Z&`{|G?z`vETo} z-2AK2`~EhNd?<}1WpLE7YfS`D|OS&pLVVr9+eF5KnxT_rnYK@rxIF>@)8 z-5h~KRC1wPG0;*r-0ZA;d!vc1+RAzCAX>u|L!;DVSRVLy6i9+)lWx1+wU{M>TlO3H z8o5Z}i}H%U*;dAS>^WJovc1c;-I#tIp_um1m#9OU@B|OEXMYFe^ z0yg?pwnci5N(zSw3oM)xoUt!2p`u_&pWQrXlmqt>j_R2uMXS(GS+&+?-MbZdcyA8$sa`FBixavLk}_%HSX7*7 zUBX#>_hHFPXhmEk74!)&PYLgxF3_}uZuQ_hJ+fV3i6gyi5#=jsYR01G)=$RKM3!gl znL + + + diff --git a/packages/nodes-base/nodes/Freshdesk/Freshdesk.node.ts b/packages/nodes-base/nodes/Freshdesk/Freshdesk.node.ts index d368fd060e5f2..9b12a4723ef3d 100644 --- a/packages/nodes-base/nodes/Freshdesk/Freshdesk.node.ts +++ b/packages/nodes-base/nodes/Freshdesk/Freshdesk.node.ts @@ -75,7 +75,7 @@ export class Freshdesk implements INodeType { displayName: 'Freshdesk', name: 'freshdesk', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:freshdesk.png', + icon: 'file:freshdesk.svg', group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Freshdesk/freshdesk.png b/packages/nodes-base/nodes/Freshdesk/freshdesk.png deleted file mode 100644 index 3b1244f5e5ace89dcdf29e023e3dcd4559aa470b..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1309 zcmV+&1>*XNP)>L{r>#`x>72^a3{fU0K8c~!*@Kxb^yFwEy8g#!gGkzq5;2XLd1B)=Fc9$ zZTkKD0KR1~!g2tD=(+?Dz1S*|0^$d-nYJ zkkzR1`t)bZjqdpJ(Cpd1kEMYAr;o^-)VWj zxoOv?)az!T4V^A-x1+$sKPZbno_WhtSm#f=_jjWVr;Nt7)h;_v@k$9>pue^bX0{cF z2142oLSCF~YPiYXZ?TzsF2@k~hn_4pnnE2kLmuBoS!@|T0%v6S9=;LIk}Y2o%`-G` zfix={a#*qpH?v$HTqMmlJ2hOh4?$!BVS7CcHxaWD0$0O=eP)6E-4=<2Bd#;B4vSH0 zePfZ~#(7A?I1VMQ!h-GYv8R1UeFvLC5M^0JL-Z3YShz}T14$HwPbPg_K9}Ws@$wNl zgrJ|{0eRFf53w{xgqVVz?pTtgQHm35)#bOdG;eht5WkU6>b!Hde@KXD z#d&Ob?Dv+NmvP{t7I@k0Cd%T1f5?+_puVOdP4n|nGUN0rMFgqv-jQR=AmW3kN9XW0 zFMTjd9=mWni$c|TfEuqPZIPJl% z&UFIgozhh`EUw8X?DU|nI(tb^4w5TjWZ?&8c!D#qTwT+?Ix*7wAK|+O?6SjDnUa(@ z9qaHkVUS zh7o$-4R^aEBUSnVd%d0X#=}ITNUjdqBacsAdV$LvAtquJC5;iVKkxHdGdv?V7ZA2B z`XCGmrPL5?Xvc9r3V%PZ*;^=$E%SpXP}y#3+~5*_Xp~^CWCc4omaiwS`HN$%8=Xu` zw7*#{mp5}bG+ly#Om#=EVY$UBu3#U>M|U-2+4;b zUR5LEq^wW_ce(PIqDIYN;|Z*cPYN29uB3fqv)3u?3h3HW3K2Uy4nEoIia0;C@v-=1 zuPPsrW|L$qeXl57kso@IIUF}wc(!DgC`t|wP_h>l>xkbNv4=3*4MZEMv&RGkh--Up zl)T-otLUW89#CvMHv%(BXT1WR*j{in%AB`jXVo89Z@%(S_OR#|98^#RzFvO;{vl@z Tr^0uo00000NkvXXu0mjfW-Wg1 diff --git a/packages/nodes-base/nodes/Freshdesk/freshdesk.svg b/packages/nodes-base/nodes/Freshdesk/freshdesk.svg new file mode 100644 index 0000000000000..8b93780da6d6e --- /dev/null +++ b/packages/nodes-base/nodes/Freshdesk/freshdesk.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/Github/Github.node.ts b/packages/nodes-base/nodes/Github/Github.node.ts index dcfa2ef9a5fc1..888d6b2cebad9 100644 --- a/packages/nodes-base/nodes/Github/Github.node.ts +++ b/packages/nodes-base/nodes/Github/Github.node.ts @@ -17,7 +17,7 @@ export class Github implements INodeType { description: INodeTypeDescription = { displayName: 'GitHub', name: 'github', - icon: 'file:github.svg', + icon: { light: 'file:github.svg', dark: 'file:github.dark.svg' }, group: ['input'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Github/github.dark.svg b/packages/nodes-base/nodes/Github/github.dark.svg new file mode 100644 index 0000000000000..0366b08a3dd1f --- /dev/null +++ b/packages/nodes-base/nodes/Github/github.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Github/github.svg b/packages/nodes-base/nodes/Github/github.svg index cefbcec946a0d..fe1ac05178b83 100644 --- a/packages/nodes-base/nodes/Github/github.svg +++ b/packages/nodes-base/nodes/Github/github.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/Google/Perspective/GooglePerspective.node.ts b/packages/nodes-base/nodes/Google/Perspective/GooglePerspective.node.ts index 74de6a53ee7b4..86d1ddaee6726 100644 --- a/packages/nodes-base/nodes/Google/Perspective/GooglePerspective.node.ts +++ b/packages/nodes-base/nodes/Google/Perspective/GooglePerspective.node.ts @@ -23,7 +23,7 @@ export class GooglePerspective implements INodeType { description: INodeTypeDescription = { displayName: 'Google Perspective', name: 'googlePerspective', - icon: 'file:perspective.svg', + icon: { light: 'file:googlePerspective.svg', dark: 'file:googlePerspective.dark.svg' }, group: ['transform'], version: 1, description: 'Consume Google Perspective API', diff --git a/packages/nodes-base/nodes/Google/Perspective/googlePerspective.dark.svg b/packages/nodes-base/nodes/Google/Perspective/googlePerspective.dark.svg new file mode 100644 index 0000000000000..6c584708cdaad --- /dev/null +++ b/packages/nodes-base/nodes/Google/Perspective/googlePerspective.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Google/Perspective/googlePerspective.svg b/packages/nodes-base/nodes/Google/Perspective/googlePerspective.svg new file mode 100644 index 0000000000000..bfed121b4a469 --- /dev/null +++ b/packages/nodes-base/nodes/Google/Perspective/googlePerspective.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Google/Perspective/perspective.svg b/packages/nodes-base/nodes/Google/Perspective/perspective.svg deleted file mode 100644 index 428a6647bc8b3..0000000000000 --- a/packages/nodes-base/nodes/Google/Perspective/perspective.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/nodes-base/nodes/Google/Task/GoogleTasks.node.ts b/packages/nodes-base/nodes/Google/Task/GoogleTasks.node.ts index 880b2a707cd09..5b6926e389213 100644 --- a/packages/nodes-base/nodes/Google/Task/GoogleTasks.node.ts +++ b/packages/nodes-base/nodes/Google/Task/GoogleTasks.node.ts @@ -17,7 +17,7 @@ export class GoogleTasks implements INodeType { displayName: 'Google Tasks', name: 'googleTasks', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:googleTasks.png', + icon: 'file:googleTasks.svg', group: ['input'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Google/Task/googleTasks.png b/packages/nodes-base/nodes/Google/Task/googleTasks.png deleted file mode 100644 index 77d9a08356da494bf83870d11defc47d5d3a65c1..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 2396 zcmV-i38VIjP)`RaGQjPWQ{{R2{{`>s@Ns#zUi}X;B z@I;FCKY`{@lJrW7@kNI5LVM*yeCkb)`1=3)Qj+;igWEiT>s68ROpNs*J@O?$}t z!VOi5)>DDgL3GYbfXz{a%u9B_z1#mqiu$F-^>m))n6u>b{QtPu|ER|Njj!ivnB!%W z-Cc^>O?%K|dX((NIPt+D&glQ2!SkHC?p~1Vex>S{xaeJo#pB0W$ld=`jN!SqjoS17 z*6aVo;{UGC|ML3%K!5d+xAa_-@`tYPOpND*r`mCp)Iw>%aFDfTinXY#g37sW^uYy~ z!T3~sww0Wdf1lZCkI{6Dpx(r0{k|N^zl!?AEZxGt{{R37zDYzuR7l5-mv>teK@i5T zWcQL>&t2|PO;3oVksuurR0KglioN&VzW*P-vzMsg^Pux^VH5V3cV>2Wc9CRRQ6yDW zm6#%vVJIm|3>L>jBYY^{OE6iMCKkQL$EqZaVM(R&F9Rn&CRoATvoJ|07~q*;(H!ze zJQ95+CdtCfQzl@VP43e$LIoWeVEh%*!42B+Z3yonsehB1R_CJetc#w3N{ zc>D}J$)AjGwJa=3J|@|WHSa%oe6V)?`t^gySMN8ODq9L=);bN75Ilvh4P8uusJXlM zVl-ducLUcQ_KTwzSB{}>0aaROl_}4}+A<~H*6u&OQLL3pwOWeva+RlQ#lgwieUp)A zr&mg(ih==)0UW+^c#?J;&QqxrFPF>Q)w$yh7q2zfWn20SmPi;b$MVS0%4YFNi5CjF zLLtpzj^hTdqtB!Un=2a2pM|3=T5>E7_Uhb|QlY?eZjN);CDx&V?s!gn>9Wbx(=eRP zlh=U3j`mZfln$I52IRS(p8qTdrNzG8m5pVn3#D{ks|)1!g2_zV810uzrF1%#CNyPKfd!l+XJyazyy@xA;)bT?QF4N{@W23D zGP}FEUn`{xX&6r%$aS^Kb*Msj8m~O8cKV~cjOCHwUvN~EOuJSrkAw?l1^KBN$vW8TPHJ5;%sjx7f<)35RS16YGH0b%zITkQ&Tw&JAkAur#~EBnz;J zS?pIOpI6O;{gP3wQl`eNBi4CF*Mr*P<9p5BYsDZ8`)isI6TK%Ehbqd09p6Zm^lH@* zFe26+$1rq##&Nr~#akwAvZn*STHZRg30B31fFWR}T{$rdX*~th$#H{d9WdNpHRdmy zYD;0-{iVL=^{+wN7A;ni1gx^=i~R!E)2S5d+94PwU~Uv|X|{sZV9n)rufmL&k!cL;2O1H0sPR(QV{6Y4?%bC{(=zutMZuRAD?ptf{bTaU-k zR8{TD#YQiiZTR);+NAG^giDrrJqV1#;hUqIKX!I@jy}FVajRAL+0reIskS0p_WG5J zm0mBK$<*tcrfLKKbubW|t~7edULuifjGAa4l)^Er0CpVx_1hoc zz>@NkpPI+|$`;KsZ(nRT>VBq|^b^U<$dsT=uo6|Ow$?>Ke0Xyt+&=pFp;(-~%9z+Z zg3V+Rt)IyHeq&RMvK7N}5sam38@ZXKFUZ)ZHTzC&VUT;N++^K%XD)zeSrW@iyE z_MmFv^kF8kjZ89;xNrgN)N1zdE|#8Hc??U;yjJ9%qw66Le18GWMxnFXCf#f!%w_?D zPEJiPJjeH{5ljcTDEs5Bbb1DD1C6dTf6rEJWJBbt-NB3SfyEku&5G)PA=fXobydlWTL9Hq1hb9#6rV18JP3Gk7fYOv;?0h8 zCD257d4q|wH7YLAcd2`72Sq-OEzD>5;JK-3q+5Y1k>oJpoysT8wtz?ijv5MMip}oL zJ<~%s^t`aUxVC%u-lvz9MgqDQU=Z~}-_OqPGTJCDTC54IGDXR24;G)L!}6*Z2Hp1Z z^2?W%Y{IXjssxlarDao4~*CCir36z30nCgV=B;NKPgE8wb?|OY78bWYWDd~i=EcOBU><8 zWV96*nQcM31@ZH&C5~)cCd2I^Z_$80QsU#Q`*~(z=7biFf^f0q+`|I4Bo;{TD! zstO1G#}t^L>9;E0PMrS-IXOJxC9NvNC-$E#U~z+2nHmE;{zoN#7XAqZ7V#~(lnqJ% O0000 + + + diff --git a/packages/nodes-base/nodes/HighLevel/highLevel.svg b/packages/nodes-base/nodes/HighLevel/highLevel.svg index 3df6e466f0bfa..407b6798f0a9f 100644 --- a/packages/nodes-base/nodes/HighLevel/highLevel.svg +++ b/packages/nodes-base/nodes/HighLevel/highLevel.svg @@ -1 +1,11 @@ - \ No newline at end of file + + + + + + + + + + + diff --git a/packages/nodes-base/nodes/HumanticAI/HumanticAi.node.ts b/packages/nodes-base/nodes/HumanticAI/HumanticAi.node.ts index 0c8a99a1e0135..e74d9a6ee2bfd 100644 --- a/packages/nodes-base/nodes/HumanticAI/HumanticAi.node.ts +++ b/packages/nodes-base/nodes/HumanticAI/HumanticAi.node.ts @@ -15,7 +15,7 @@ export class HumanticAi implements INodeType { displayName: 'Humantic AI', name: 'humanticAi', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:humanticai.png', + icon: 'file:humanticai.svg', group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/HumanticAI/humanticai.png b/packages/nodes-base/nodes/HumanticAI/humanticai.png deleted file mode 100644 index efdfbdbe7f6bcc93a4920e64a25e6bacd12f9120..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1639 zcmV-t2AKJYP)8uqtj#qoo9Gb5`)ul5hUM1Ewb4Zd6=zwdt+KgQ&aqXNBs!d+ zdBzkk3=EM22&5AzamvgJ5#dsUVQ=a1{KwRk7StzC#A!S+?RC4Y>? z7k@#8lnc_T=3}^7os9TkGYHvbD+;7sNP0k7YRSMKV~1gAu(|xLPhG0MXo{*M2OV+C zFeuodDEJO50}1M{`V?4$2HSib4Vs-Uc#+R-mt# zbB~eac$TPinz%|LNXi=^1pfKkcroCx<3?bxsx$cmiAo~0fifgHo>PV1^9f!H7;I=L zp6EPUKU!p9iDk1 zz_8t-ZR^j42JpBkuvNRUi=V>b+8r;SPgJ#psB$q;`8@4on^VjqUJ)PmO`Q% z8ANp-ssGOP1|K+ou*}bgIe4fExcwyBWx#nM3RBHIWrr_(M%3z3R>OAXHn;^W!f;x% zS5;>x=o_~;j;X_X)m)%!JhP^$rPDA)i1yG{EYei0D(3T@yqO^m>s5{z})F*4%?|~yNv_$Dt74%4sf3!0$()&_%B-!fr}?=OzBUJ17F#taSWT8 z(hgqHn$BNB8U?Q3&@)BrN*XT7r=@|~r={CY1He`6HfvT01CtGs5O8G@ev<#S`tX6P z-(fpfzd=86QyRO?swHe#=R_Is-7GW<0q@>`xta=B*(`pPukX_jttFicpOX1onuK&A zV1P4@&yMFq*RJG4U)`e*xFNx}opbMM8o#s0V1O`iTQ=^?8d2IFa*Nj^)vYJGQ^tq; zyMpM#m!5AMw*C8U_ckhCVZ#xxNrcK zOz6Uq>d>W8o``4#Js0EG&J5qIaV_-)_C3TCTWlzpMdCeDalRw~?OmL_rF?{2yGrq7 zvP+eVWNA$$Q@eb6n1gnsz{uQ&cy?-oNc4V*6@9v`mRIz&We#8q-e)7OEsd^=h`eKaL&dy#MIe!MShp$U@|tWPbDtNBZ`| zxw({14>z@V0RYAW{rJF-Wb1DZsAG(BKY0UuAJ6z*p#rd&0u8{@eiC<8!M)>KX*uen zNRo;tlaxP5ydgWM0J!(zlqRQaeMve!jHIGbp2ulLVV-SWw+btw z_G~<8O2<`^Z%qXT0PAK<&>Rf|%KQeKynTme-FILWSC|7e7t&eE0P+muuHkP)M$m>mVg8C(TD*M5)7w$ lt=D?(KWIVz&$u49e*jBpKRv0y_F@14002ovPDHLkV1mCmAhQ4f diff --git a/packages/nodes-base/nodes/HumanticAI/humanticai.svg b/packages/nodes-base/nodes/HumanticAI/humanticai.svg new file mode 100644 index 0000000000000..bcd352fe1c3b7 --- /dev/null +++ b/packages/nodes-base/nodes/HumanticAI/humanticai.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/packages/nodes-base/nodes/InvoiceNinja/invoiceNinja.svg b/packages/nodes-base/nodes/InvoiceNinja/invoiceNinja.svg index fb0d71c694683..af34f552f65c3 100644 --- a/packages/nodes-base/nodes/InvoiceNinja/invoiceNinja.svg +++ b/packages/nodes-base/nodes/InvoiceNinja/invoiceNinja.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + diff --git a/packages/nodes-base/nodes/Jenkins/jenkins.svg b/packages/nodes-base/nodes/Jenkins/jenkins.svg index 59187b8c5701b..6fba06f467a1a 100644 --- a/packages/nodes-base/nodes/Jenkins/jenkins.svg +++ b/packages/nodes-base/nodes/Jenkins/jenkins.svg @@ -1 +1,60 @@ - \ No newline at end of file + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/nodes-base/nodes/Kafka/Kafka.node.ts b/packages/nodes-base/nodes/Kafka/Kafka.node.ts index 331333fd63375..027b17131cd66 100644 --- a/packages/nodes-base/nodes/Kafka/Kafka.node.ts +++ b/packages/nodes-base/nodes/Kafka/Kafka.node.ts @@ -21,7 +21,7 @@ export class Kafka implements INodeType { description: INodeTypeDescription = { displayName: 'Kafka', name: 'kafka', - icon: 'file:kafka.svg', + icon: { light: 'file:kafka.svg', dark: 'file:kafka.dark.svg' }, group: ['transform'], version: 1, description: 'Sends messages to a Kafka topic', diff --git a/packages/nodes-base/nodes/Kafka/kafka.dark.svg b/packages/nodes-base/nodes/Kafka/kafka.dark.svg new file mode 100644 index 0000000000000..b322611c7042c --- /dev/null +++ b/packages/nodes-base/nodes/Kafka/kafka.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Kafka/kafka.svg b/packages/nodes-base/nodes/Kafka/kafka.svg index 9ef827e234dbd..978a747202ece 100644 --- a/packages/nodes-base/nodes/Kafka/kafka.svg +++ b/packages/nodes-base/nodes/Kafka/kafka.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/Ldap/Ldap.node.ts b/packages/nodes-base/nodes/Ldap/Ldap.node.ts index 3f62afa729e40..e581a986c0c44 100644 --- a/packages/nodes-base/nodes/Ldap/Ldap.node.ts +++ b/packages/nodes-base/nodes/Ldap/Ldap.node.ts @@ -20,7 +20,7 @@ export class Ldap implements INodeType { description: INodeTypeDescription = { displayName: 'Ldap', name: 'ldap', - icon: 'file:ldap.svg', + icon: { light: 'file:ldap.svg', dark: 'file:ldap.dark.svg' }, group: ['transform'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Ldap/ldap.dark.svg b/packages/nodes-base/nodes/Ldap/ldap.dark.svg new file mode 100644 index 0000000000000..93cdb23caa3d3 --- /dev/null +++ b/packages/nodes-base/nodes/Ldap/ldap.dark.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/Ldap/ldap.svg b/packages/nodes-base/nodes/Ldap/ldap.svg index 116934012edbc..3b1e9e9ff1ba9 100644 --- a/packages/nodes-base/nodes/Ldap/ldap.svg +++ b/packages/nodes-base/nodes/Ldap/ldap.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + diff --git a/packages/nodes-base/nodes/Lemlist/lemlist.svg b/packages/nodes-base/nodes/Lemlist/lemlist.svg index 990519775060f..12a5d3efff77c 100644 --- a/packages/nodes-base/nodes/Lemlist/lemlist.svg +++ b/packages/nodes-base/nodes/Lemlist/lemlist.svg @@ -1 +1,6 @@ - \ No newline at end of file + + + + + + diff --git a/packages/nodes-base/nodes/LoneScale/LoneScale.node.ts b/packages/nodes-base/nodes/LoneScale/LoneScale.node.ts index 713d3bb84abe2..0b66ff0348058 100644 --- a/packages/nodes-base/nodes/LoneScale/LoneScale.node.ts +++ b/packages/nodes-base/nodes/LoneScale/LoneScale.node.ts @@ -15,7 +15,7 @@ export class LoneScale implements INodeType { displayName: 'LoneScale', name: 'loneScale', group: ['transform'], - icon: 'file:lonescale-logo.svg', + icon: { light: 'file:loneScale.svg', dark: 'file:loneScale.dark.svg' }, version: 1, description: 'Create List, add / delete items', subtitle: '={{$parameter["resource"] + ": " + $parameter["operation"]}}', diff --git a/packages/nodes-base/nodes/LoneScale/loneScale.dark.svg b/packages/nodes-base/nodes/LoneScale/loneScale.dark.svg new file mode 100644 index 0000000000000..f4922cd38c308 --- /dev/null +++ b/packages/nodes-base/nodes/LoneScale/loneScale.dark.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/packages/nodes-base/nodes/LoneScale/loneScale.svg b/packages/nodes-base/nodes/LoneScale/loneScale.svg new file mode 100644 index 0000000000000..11e0f506e0743 --- /dev/null +++ b/packages/nodes-base/nodes/LoneScale/loneScale.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/packages/nodes-base/nodes/LoneScale/lonescale-logo.svg b/packages/nodes-base/nodes/LoneScale/lonescale-logo.svg deleted file mode 100644 index b8a15e626094a..0000000000000 --- a/packages/nodes-base/nodes/LoneScale/lonescale-logo.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/nodes-base/nodes/Mailchimp/Mailchimp.node.ts b/packages/nodes-base/nodes/Mailchimp/Mailchimp.node.ts index 07d8345826c8d..229f4626e5af2 100644 --- a/packages/nodes-base/nodes/Mailchimp/Mailchimp.node.ts +++ b/packages/nodes-base/nodes/Mailchimp/Mailchimp.node.ts @@ -50,7 +50,7 @@ export class Mailchimp implements INodeType { description: INodeTypeDescription = { displayName: 'Mailchimp', name: 'mailchimp', - icon: 'file:mailchimp.svg', + icon: { light: 'file:mailchimp.svg', dark: 'file:mailchimp.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Mailchimp/mailchimp.dark.svg b/packages/nodes-base/nodes/Mailchimp/mailchimp.dark.svg new file mode 100644 index 0000000000000..9561abcf6b03d --- /dev/null +++ b/packages/nodes-base/nodes/Mailchimp/mailchimp.dark.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/packages/nodes-base/nodes/Mailchimp/mailchimp.svg b/packages/nodes-base/nodes/Mailchimp/mailchimp.svg index 959a3d2a1b3d5..758d9b54586ac 100644 --- a/packages/nodes-base/nodes/Mailchimp/mailchimp.svg +++ b/packages/nodes-base/nodes/Mailchimp/mailchimp.svg @@ -1 +1,16 @@ - \ No newline at end of file + + + + + + + + + + + + + + + + diff --git a/packages/nodes-base/nodes/Marketstack/Marketstack.node.ts b/packages/nodes-base/nodes/Marketstack/Marketstack.node.ts index 1a4b87a877c50..b59da5ffdb8a6 100644 --- a/packages/nodes-base/nodes/Marketstack/Marketstack.node.ts +++ b/packages/nodes-base/nodes/Marketstack/Marketstack.node.ts @@ -30,7 +30,7 @@ export class Marketstack implements INodeType { displayName: 'Marketstack', name: 'marketstack', subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', - icon: 'file:marketstack.svg', + icon: { light: 'file:marketstack.svg', dark: 'file:marketstack.dark.svg' }, group: ['transform'], version: 1, description: 'Consume Marketstack API', diff --git a/packages/nodes-base/nodes/Marketstack/marketstack.dark.svg b/packages/nodes-base/nodes/Marketstack/marketstack.dark.svg new file mode 100644 index 0000000000000..6060cc0745bd8 --- /dev/null +++ b/packages/nodes-base/nodes/Marketstack/marketstack.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Marketstack/marketstack.svg b/packages/nodes-base/nodes/Marketstack/marketstack.svg index 8e55325a3df1e..054c6ea752604 100644 --- a/packages/nodes-base/nodes/Marketstack/marketstack.svg +++ b/packages/nodes-base/nodes/Marketstack/marketstack.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/Microsoft/Dynamics/MicrosoftDynamicsCrm.node.ts b/packages/nodes-base/nodes/Microsoft/Dynamics/MicrosoftDynamicsCrm.node.ts index 37f39b04984bd..101002eae8788 100644 --- a/packages/nodes-base/nodes/Microsoft/Dynamics/MicrosoftDynamicsCrm.node.ts +++ b/packages/nodes-base/nodes/Microsoft/Dynamics/MicrosoftDynamicsCrm.node.ts @@ -24,7 +24,7 @@ export class MicrosoftDynamicsCrm implements INodeType { description: INodeTypeDescription = { displayName: 'Microsoft Dynamics CRM', name: 'microsoftDynamicsCrm', - icon: 'file:dynamicsCrm.svg', + icon: { light: 'file:microsoftDynamicsCrm.svg', dark: 'file:microsoftDynamicsCrm.dark.svg' }, group: ['input'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Microsoft/Dynamics/dynamicsCrm.svg b/packages/nodes-base/nodes/Microsoft/Dynamics/dynamicsCrm.svg deleted file mode 100644 index 03652f8c9ba12..0000000000000 --- a/packages/nodes-base/nodes/Microsoft/Dynamics/dynamicsCrm.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/nodes-base/nodes/Microsoft/Dynamics/microsoftDynamicsCrm.dark.svg b/packages/nodes-base/nodes/Microsoft/Dynamics/microsoftDynamicsCrm.dark.svg new file mode 100644 index 0000000000000..5f629263e35b1 --- /dev/null +++ b/packages/nodes-base/nodes/Microsoft/Dynamics/microsoftDynamicsCrm.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Microsoft/Dynamics/microsoftDynamicsCrm.svg b/packages/nodes-base/nodes/Microsoft/Dynamics/microsoftDynamicsCrm.svg new file mode 100644 index 0000000000000..573707de4c7bc --- /dev/null +++ b/packages/nodes-base/nodes/Microsoft/Dynamics/microsoftDynamicsCrm.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Mocean/Mocean.node.ts b/packages/nodes-base/nodes/Mocean/Mocean.node.ts index 137b47385cb72..e0b0521ec9397 100644 --- a/packages/nodes-base/nodes/Mocean/Mocean.node.ts +++ b/packages/nodes-base/nodes/Mocean/Mocean.node.ts @@ -19,7 +19,7 @@ export class Mocean implements INodeType { displayName: 'Mocean', name: 'mocean', subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', - icon: 'file:mocean.svg', + icon: { light: 'file:mocean.svg', dark: 'file:mocean.dark.svg' }, group: ['transform'], version: 1, description: 'Send SMS and voice messages via Mocean', diff --git a/packages/nodes-base/nodes/Mocean/mocean.dark.svg b/packages/nodes-base/nodes/Mocean/mocean.dark.svg new file mode 100644 index 0000000000000..0957234f22864 --- /dev/null +++ b/packages/nodes-base/nodes/Mocean/mocean.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Mocean/mocean.svg b/packages/nodes-base/nodes/Mocean/mocean.svg index 406a00e517a0b..6ba14bdc84637 100644 --- a/packages/nodes-base/nodes/Mocean/mocean.svg +++ b/packages/nodes-base/nodes/Mocean/mocean.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/Msg91/Msg91.node.ts b/packages/nodes-base/nodes/Msg91/Msg91.node.ts index 6f62c5eec1d04..b3e6d68352f60 100644 --- a/packages/nodes-base/nodes/Msg91/Msg91.node.ts +++ b/packages/nodes-base/nodes/Msg91/Msg91.node.ts @@ -15,7 +15,7 @@ export class Msg91 implements INodeType { displayName: 'MSG91', name: 'msg91', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:msg91.png', + icon: { light: 'file:msg91.svg', dark: 'file:msg91.dark.svg' }, group: ['transform'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Msg91/msg91.dark.svg b/packages/nodes-base/nodes/Msg91/msg91.dark.svg new file mode 100644 index 0000000000000..5f6bb824e2e86 --- /dev/null +++ b/packages/nodes-base/nodes/Msg91/msg91.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Msg91/msg91.png b/packages/nodes-base/nodes/Msg91/msg91.png deleted file mode 100644 index e3dcfb6605f9a4f1c958f07db45fef6e6ed19906..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1166 zcmV;91abR`P)xlMP}fl=64P*uSLAm{*x|teusROaQm1` zNFuK}`Ve{_aMAPojw`_FBmGiV??tFp04^Wt-2)%N3&H=;vyqSRMXhq+vvAq_u=4mU zTq@bMb8zu)0B8QvC1xyxA7qThpvXI?ahz-ePj;+u9Ea`f$OOT|hbR8yAziNiZ6EOg z5q0gFzjkpEF$SwfOBHI{qM`uBhM}QWkuTMg72dE63@4h(YwD)Y+0^HueOEE04wk|C# znL4O9Iv*x~wM)Nt>&m?nh`su)IA2%Bg`ia^(-VBj40;=&r-f@X^eZHNO?D)UE! zg)p#`oa^F5;*u%-D_B_Jk|jYtyPd*9??|$)V=!`{QxpbT3;?;SwXNe%Q(qsc3QUncxgY z+94MyBRNur$_ZRd7N|(7M1!~taVLz~&;`n1e+)u6@d&1J(M8&*glzgQn+BP1b%ri> zqOKFU)Ou*+ojL^VVgnZdo!zu9R-l~3h3N}UFzYbWE_vUj1Be@}U%2?<(Kx9~hDD2; z{yo+-cc$8=`?JfLNB*=fv3-F{kkLBU?NVbCt6y~Dp-XuX-#gQ|q^2n;R&FEFev!GZ z%UZduWyBtlHptY=?e|%}#P(c*U@h?e+QnXChRwz{2)SsQ9cZ!ypX4eqarL3^@{@2y zoC0Dm{J!41ToQu$|moMeAc_P1Fr1fHC})fb>iPJy=*+ gSXfwCSooj(0&BuQ#+Z!iX8-^I07*qoM6N<$f|XAr%K!iX diff --git a/packages/nodes-base/nodes/Msg91/msg91.svg b/packages/nodes-base/nodes/Msg91/msg91.svg new file mode 100644 index 0000000000000..b208338075f78 --- /dev/null +++ b/packages/nodes-base/nodes/Msg91/msg91.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/OpenWeatherMap/OpenWeatherMap.node.ts b/packages/nodes-base/nodes/OpenWeatherMap/OpenWeatherMap.node.ts index f1f40ffc32990..3b9e4e6ff85d8 100644 --- a/packages/nodes-base/nodes/OpenWeatherMap/OpenWeatherMap.node.ts +++ b/packages/nodes-base/nodes/OpenWeatherMap/OpenWeatherMap.node.ts @@ -13,13 +13,12 @@ export class OpenWeatherMap implements INodeType { description: INodeTypeDescription = { displayName: 'OpenWeatherMap', name: 'openWeatherMap', - icon: 'fa:sun', + icon: 'file:openWeatherMap.svg', group: ['input'], version: 1, description: 'Gets current and future weather information', defaults: { name: 'OpenWeatherMap', - color: '#554455', }, inputs: ['main'], outputs: ['main'], diff --git a/packages/nodes-base/nodes/OpenWeatherMap/openWeatherMap.svg b/packages/nodes-base/nodes/OpenWeatherMap/openWeatherMap.svg new file mode 100644 index 0000000000000..41244f3893d99 --- /dev/null +++ b/packages/nodes-base/nodes/OpenWeatherMap/openWeatherMap.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/nodes/Orbit/Orbit.node.ts b/packages/nodes-base/nodes/Orbit/Orbit.node.ts index f5faa28220614..48069d20369c1 100644 --- a/packages/nodes-base/nodes/Orbit/Orbit.node.ts +++ b/packages/nodes-base/nodes/Orbit/Orbit.node.ts @@ -25,7 +25,7 @@ export class Orbit implements INodeType { description: INodeTypeDescription = { displayName: 'Orbit', name: 'orbit', - icon: 'file:orbit.svg', + icon: { light: 'file:orbit.svg', dark: 'file:orbit.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Orbit/orbit.dark.svg b/packages/nodes-base/nodes/Orbit/orbit.dark.svg new file mode 100644 index 0000000000000..7782c9dfeca5f --- /dev/null +++ b/packages/nodes-base/nodes/Orbit/orbit.dark.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/packages/nodes-base/nodes/Orbit/orbit.svg b/packages/nodes-base/nodes/Orbit/orbit.svg index a52b999c6b931..fd3687c272725 100644 --- a/packages/nodes-base/nodes/Orbit/orbit.svg +++ b/packages/nodes-base/nodes/Orbit/orbit.svg @@ -1 +1,7 @@ - \ No newline at end of file + + + + + + + diff --git a/packages/nodes-base/nodes/Oura/Oura.node.ts b/packages/nodes-base/nodes/Oura/Oura.node.ts index ecadcb9fcc53d..bf57b489da9b3 100644 --- a/packages/nodes-base/nodes/Oura/Oura.node.ts +++ b/packages/nodes-base/nodes/Oura/Oura.node.ts @@ -17,7 +17,7 @@ export class Oura implements INodeType { description: INodeTypeDescription = { displayName: 'Oura', name: 'oura', - icon: 'file:oura.svg', + icon: { light: 'file:oura.svg', dark: 'file:oura.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Oura/oura.dark.svg b/packages/nodes-base/nodes/Oura/oura.dark.svg new file mode 100644 index 0000000000000..6aa47774cf42e --- /dev/null +++ b/packages/nodes-base/nodes/Oura/oura.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Oura/oura.svg b/packages/nodes-base/nodes/Oura/oura.svg index 85ddf3fd2975e..ac24a91213970 100644 --- a/packages/nodes-base/nodes/Oura/oura.svg +++ b/packages/nodes-base/nodes/Oura/oura.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/ProfitWell/ProfitWell.node.ts b/packages/nodes-base/nodes/ProfitWell/ProfitWell.node.ts index d5a834024c215..a153607cf9bfa 100644 --- a/packages/nodes-base/nodes/ProfitWell/ProfitWell.node.ts +++ b/packages/nodes-base/nodes/ProfitWell/ProfitWell.node.ts @@ -24,7 +24,7 @@ export class ProfitWell implements INodeType { displayName: 'ProfitWell', name: 'profitWell', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:profitwell.png', + icon: { light: 'file:profitwell.svg', dark: 'file:profitwell.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/ProfitWell/profitwell.dark.svg b/packages/nodes-base/nodes/ProfitWell/profitwell.dark.svg new file mode 100644 index 0000000000000..9cec2b4cecde0 --- /dev/null +++ b/packages/nodes-base/nodes/ProfitWell/profitwell.dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/nodes/ProfitWell/profitwell.png b/packages/nodes-base/nodes/ProfitWell/profitwell.png deleted file mode 100644 index 78b9c0afc0749afd93b9b920572bad844938254b..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1870 zcmd5*dpJ~S7(e6CFk>c0t-+8;a-R!ACbt=x5>inbcUvi2E+G*j4a!|EEv7OF z3CYrhvgMLp_EGNFhs*m%x3}GaLdYTj06@{K zD2`Ax7A#RvkWo@Ig@Ul3nT;6$+`fe5c!@w~MQDi0fv`=UM249EBM^&>=mC(0e^dw&OJ50E2FO~5 zP)Ehzt8f-Hu{(LFk}F@yBr>9ofnetTMTQ8_{!>P<`GQX+h`L-vEkiOXTC~0Zdo~D1 zwH9OD6m2R-R%C)h&EK|F&@sZ9TcLB4QTdlpd7mMfd=^!hD!1ENV2x<}83bc_12X~i zOrQ?(MB`7!A@2gh$2ka`e!+Kd`47L{$IBo`vr*7Cgl2-H>=caR<7AMv*TtX>|^Yf|!>9oi3a}#IVl@!(d!aC@VkfNJ=m4;Bt6;%MuDOv=5*|#mp~6Rz2vO+`Zx>gy0RR-DQOumI+NWMEyZ4x4 z;V1T2L~TkEGOtFbZcz`+xl1*pwo+m6I3={xfZRaTOuW09y$*Qi-;55PjOO(O|OBv58oOR1r7-JH3?!AJ}|KPY8?Lvx_R?*3w(`1KT7GbQe-dv9%55Ey4#8+T|} z(K`FhO0!MHtyuB8*@0fP-1Jc&^1*`AB7Ltbjp{`S6iT+Fm=RjQ0;k?_N4D_WB1D^{0yK!AZSiAt_lMYBhMZnz51=m8H&s zh=4JVT zx8PZi2QTtQkF?Zj_Z=6mm^3L33~dPMr>2e9_bg45CtMX(0P0@l>5*US5>+rFS+jX= zu1XzE^saKv%euosr?Z^9(T|c{=OwCI`*LMY7kEAI?^22o$03W-Bf>E&yiP5zKSZQ= z;hB@AqxP|5H4n!MeSCZhbugp)BglSnZ`OfGYrid0puAm$q2<2HadWHD!`P4mp6C2! z!V3?F?9^`)*N{s=lr31a%{#U?A9b7Xa+spdTT1sNNw71V#`W0y3N0}B8Ctq_QFe2o zW87T3!Orax4y7K6EqcG0wzMbM!J>3L&eS}qDbKO>d+8TJK$BkF;*^_Y>?k=_3xZv< zKLQ!YpY$;LKHTo`nXh#AW0eK?S`2nFM{^$^h%32hbi>H1K#MJf5OHN&c=N;P@eb--v%N& + + + + diff --git a/packages/nodes-base/nodes/RabbitMQ/RabbitMQ.node.ts b/packages/nodes-base/nodes/RabbitMQ/RabbitMQ.node.ts index 85017cbdcd937..f64ff61cc94e0 100644 --- a/packages/nodes-base/nodes/RabbitMQ/RabbitMQ.node.ts +++ b/packages/nodes-base/nodes/RabbitMQ/RabbitMQ.node.ts @@ -21,7 +21,7 @@ export class RabbitMQ implements INodeType { displayName: 'RabbitMQ', name: 'rabbitmq', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:rabbitmq.png', + icon: 'file:rabbitmq.svg', group: ['transform'], version: [1, 1.1], description: 'Sends messages to a RabbitMQ topic', diff --git a/packages/nodes-base/nodes/RabbitMQ/rabbitmq.png b/packages/nodes-base/nodes/RabbitMQ/rabbitmq.png deleted file mode 100644 index d37a2a0fbeeb23a1db89fefbf9f0988ed88d4273..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 527 zcmV+q0`UEbP)H{rhJG{bmCBX9oWN{r>#)|M>3y{`&EQHvazi{r>;;X$t@K>G^63{PE!ZW&`~H z{`~s#`u_azt#|Ts9sB(D`|;)a?b!Ee3H|o$^lT6PX94>C`u_g%`RCI6Wd-*3?)Tor z^S_zwmsjtUQ1N;x_WSer;>h&Kp76(=^u3Srs&4IzNA`v~>V7TwaTxM&7dUJ~-v9ss zF-b&0R7l6|(`j#mARNc>BKWTq>;|%GJ$fIzulN7rhGL9M8YN`QX6pBW$o z%QGLFJjr4O9%WGf00nxkqz&dQdb-mcf?7w<<$PS(V7YolW#pY!GhS3n9AoImF!d`e zwn2pxWJ;B?#|Y2M$rEg5&MdH3V}j?PC)^^_4do*q@jt>+Pt{;1?J-I-s*ls8xf$%S zz#9%4?+b%*V2^d@UCdarAoV=nvsMbA6AM2KL%gjQA!*p^yz9oOKtzX{NUQWDJ8)0M z4BRoEdG4581s1*z + + diff --git a/packages/nodes-base/nodes/SentryIo/SentryIo.node.ts b/packages/nodes-base/nodes/SentryIo/SentryIo.node.ts index 5133f74fe8077..0e0d54ddf8341 100644 --- a/packages/nodes-base/nodes/SentryIo/SentryIo.node.ts +++ b/packages/nodes-base/nodes/SentryIo/SentryIo.node.ts @@ -28,7 +28,7 @@ export class SentryIo implements INodeType { description: INodeTypeDescription = { displayName: 'Sentry.io', name: 'sentryIo', - icon: 'file:sentryio.svg', + icon: { light: 'file:sentryio.svg', dark: 'file:sentryio.dark.svg' }, group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/SentryIo/sentryio.dark.svg b/packages/nodes-base/nodes/SentryIo/sentryio.dark.svg new file mode 100644 index 0000000000000..0436a2d5ddcdd --- /dev/null +++ b/packages/nodes-base/nodes/SentryIo/sentryio.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/SentryIo/sentryio.svg b/packages/nodes-base/nodes/SentryIo/sentryio.svg index 1988b93ff0166..29339cf49f356 100644 --- a/packages/nodes-base/nodes/SentryIo/sentryio.svg +++ b/packages/nodes-base/nodes/SentryIo/sentryio.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/TimescaleDb/TimescaleDb.node.ts b/packages/nodes-base/nodes/TimescaleDb/TimescaleDb.node.ts index e287be8edec91..eb49ea8963b9a 100644 --- a/packages/nodes-base/nodes/TimescaleDb/TimescaleDb.node.ts +++ b/packages/nodes-base/nodes/TimescaleDb/TimescaleDb.node.ts @@ -13,7 +13,7 @@ export class TimescaleDb implements INodeType { description: INodeTypeDescription = { displayName: 'TimescaleDB', name: 'timescaleDb', - icon: 'file:timescale.svg', + icon: { light: 'file:timescaleDb.svg', dark: 'file:timescaleDb.dark.svg' }, group: ['input'], version: 1, description: 'Add and update data in TimescaleDB', diff --git a/packages/nodes-base/nodes/TimescaleDb/timescale.svg b/packages/nodes-base/nodes/TimescaleDb/timescale.svg deleted file mode 100644 index e0f4d6e2e60f8..0000000000000 --- a/packages/nodes-base/nodes/TimescaleDb/timescale.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/nodes-base/nodes/TimescaleDb/timescaleDb.dark.svg b/packages/nodes-base/nodes/TimescaleDb/timescaleDb.dark.svg new file mode 100644 index 0000000000000..1aba89babe215 --- /dev/null +++ b/packages/nodes-base/nodes/TimescaleDb/timescaleDb.dark.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/packages/nodes-base/nodes/TimescaleDb/timescaleDb.svg b/packages/nodes-base/nodes/TimescaleDb/timescaleDb.svg new file mode 100644 index 0000000000000..42274c0217367 --- /dev/null +++ b/packages/nodes-base/nodes/TimescaleDb/timescaleDb.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/packages/nodes-base/nodes/Twitter/Twitter.node.ts b/packages/nodes-base/nodes/Twitter/Twitter.node.ts index 922b29f4a220e..0cfb9b296b394 100644 --- a/packages/nodes-base/nodes/Twitter/Twitter.node.ts +++ b/packages/nodes-base/nodes/Twitter/Twitter.node.ts @@ -10,7 +10,7 @@ export class Twitter extends VersionedNodeType { const baseDescription: INodeTypeBaseDescription = { displayName: 'X (Formerly Twitter)', name: 'twitter', - icon: 'file:x.svg', + icon: { light: 'file:x.svg', dark: 'file:x.dark.svg' }, group: ['output'], subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', description: 'Consume the X API', diff --git a/packages/nodes-base/nodes/Twitter/x.dark.svg b/packages/nodes-base/nodes/Twitter/x.dark.svg new file mode 100644 index 0000000000000..df3ffb0e6b34a --- /dev/null +++ b/packages/nodes-base/nodes/Twitter/x.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Twitter/x.svg b/packages/nodes-base/nodes/Twitter/x.svg index 95d7fc2f51382..3a72554876c77 100644 --- a/packages/nodes-base/nodes/Twitter/x.svg +++ b/packages/nodes-base/nodes/Twitter/x.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/Typeform/TypeformTrigger.node.ts b/packages/nodes-base/nodes/Typeform/TypeformTrigger.node.ts index 5b85262a6e2c9..52aa072dae5c3 100644 --- a/packages/nodes-base/nodes/Typeform/TypeformTrigger.node.ts +++ b/packages/nodes-base/nodes/Typeform/TypeformTrigger.node.ts @@ -23,7 +23,7 @@ export class TypeformTrigger implements INodeType { description: INodeTypeDescription = { displayName: 'Typeform Trigger', name: 'typeformTrigger', - icon: 'file:typeform.svg', + icon: { light: 'file:typeform.svg', dark: 'file:typeform.dark.svg' }, group: ['trigger'], version: [1, 1.1], subtitle: '=Form ID: {{$parameter["formId"]}}', diff --git a/packages/nodes-base/nodes/Typeform/typeform.dark.svg b/packages/nodes-base/nodes/Typeform/typeform.dark.svg new file mode 100644 index 0000000000000..020fa91565ef7 --- /dev/null +++ b/packages/nodes-base/nodes/Typeform/typeform.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Typeform/typeform.svg b/packages/nodes-base/nodes/Typeform/typeform.svg index 4720d1190061a..578ff3ef8a557 100644 --- a/packages/nodes-base/nodes/Typeform/typeform.svg +++ b/packages/nodes-base/nodes/Typeform/typeform.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/Vonage/Vonage.node.ts b/packages/nodes-base/nodes/Vonage/Vonage.node.ts index b6944f4f1a2f7..14793158c1017 100644 --- a/packages/nodes-base/nodes/Vonage/Vonage.node.ts +++ b/packages/nodes-base/nodes/Vonage/Vonage.node.ts @@ -13,7 +13,7 @@ export class Vonage implements INodeType { displayName: 'Vonage', name: 'vonage', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:vonage.png', + icon: { light: 'file:vonage.svg', dark: 'file:vonage.dark.svg' }, group: ['input'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Vonage/vonage.dark.svg b/packages/nodes-base/nodes/Vonage/vonage.dark.svg new file mode 100644 index 0000000000000..223f61e095e9b --- /dev/null +++ b/packages/nodes-base/nodes/Vonage/vonage.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Vonage/vonage.png b/packages/nodes-base/nodes/Vonage/vonage.png deleted file mode 100644 index f4b8b02565079a88a8c6ad184e63e2aabee0b3e8..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 855 zcmeAS@N?(olHy`uVBq!ia0vp^HXzKw3=&b&bO2II1AIbUfixOmWMYDdFf*|*GlSFv z0TWOZB+dvFVPs@vVqgQ3KpKph7#TnukU9tnVj%!XjuC1OP!wbk*eIZxAQKpXMnh!5 zCVmxF%3eNmpuIIW%S)g8Mrv}bwXt@|)#q2|01eglba4#vIR18OZulbu zk(S^L4{jz`4W)HVyEg6Ucz^Hz|I0F*51Y(0Uz9&Duy|s0c*)!1re9arKgwEla>Mms zVe7ZgNs4?at24LU;;2Gk?5)*nx(>|}etnV8`&7@hTN%!*;lB_4*SH*=x~1WBb&02D z?$rf$ZV%u5JY%VuyZVUVf2Fjg#eSzh)IaxL$vR)w@6HBC@rbr7Hp-6=#fGn0mnX3K z@a)eHQogbK_H1tc8}p&g?(kLB{11|P;`^?4-28aiEpDsnUcsF?&-rK1$~t#-{fElK z$$D}MhvIuO)SV9tD9pSodvEif9SJ9{CR`DZJE)lXgVXE0Fq^{MSP88iHyV>>+&aSF z@u!sY6qEPFZwySH0qfpxuwxXk*I<^+^K?*<*O;5^wo&6x!-m9j_Wu$N8#=IPeA_f> zG6QErQKoE7(+>tqwpQKKlNl2OZWyQb+c@sI%FiUicw*Lb#()Ka(+nL{G_HlPF;og3 zWfJLLFTG8hVd4Ub-*fJ+k!N#hV!F&C&#J)7*}_*}pxNq=?ta|N z@l@Lz2vsGGp4L8 zbh*U6?`Oo8x0xKSo3(8BXXagXtEZn8f3oT3k9BG9-|ni&&kuc~HK})FoImI4Mc=r$ Xg-ltNda{ull#o4L{an^LB{Ts5jwCi% diff --git a/packages/nodes-base/nodes/Vonage/vonage.svg b/packages/nodes-base/nodes/Vonage/vonage.svg new file mode 100644 index 0000000000000..e1064cf3173a9 --- /dev/null +++ b/packages/nodes-base/nodes/Vonage/vonage.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Wekan/Wekan.node.ts b/packages/nodes-base/nodes/Wekan/Wekan.node.ts index b3a8501f47bb3..0f64e67132de2 100644 --- a/packages/nodes-base/nodes/Wekan/Wekan.node.ts +++ b/packages/nodes-base/nodes/Wekan/Wekan.node.ts @@ -32,7 +32,7 @@ export class Wekan implements INodeType { displayName: 'Wekan', name: 'wekan', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:wekan.png', + icon: 'file:wekan.svg', group: ['transform'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Wekan/wekan.png b/packages/nodes-base/nodes/Wekan/wekan.png deleted file mode 100644 index 8849da129cd9e7d899d40b13ac9398b5ebe264a3..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 941 zcmV;e15*5nP)K^mNtf*Er6F4a*F_GgC}~DKZ>6#eU&YJlskx>F@TpkhnyyRlR}K3OOT{W zk)$Mck9w@Ti?_sdskm*Uv`&qorp3<%YlR+okP&f;7n5!pylRk={U7fE^lcr&wuTzz%GlG~gf0kpNuRe&K zEq;`Bs<~gCu2Yq$OOB#no2_V}v0EzbIn1^^%Nhl!q^X=^E;MvW~!??7ss;Hu(o0^x3g?x8zYE4Kt85a}x^XA~$ z$;rdQzPq}ysi2;km5`5)hkkr`b8>KLX=q?tSy@t2L_#?&BOe}}jLXgd00EszL_t(Y z$L-ctZ^JMYhT*SEN-M3r!kC$vnVFfv=OpR&|8EA;?y}ZZq-mA%Tv)kzW66o*z-IeP zcixC2kH~5YzfpUcN#sGy-73tL8=@ei9Hx8~R5&I#OjT+^0>e}r2^lceE-b`lcKm~M zE;1&fpR3k^W-cZs4mX89i?1872Z*zDOdK1UP{-mV>b~Z8Okm%TjEU+`G2ZXPSSEt=p_ z+-T8B1fuMERu?5>Z5NlCpsFkqxlTVG$XLf{#LZGMg&%u#L5)xvT*p3~=&mPZk}m^J zxdof5CBd7>@>(*0p7$+a%mbx@Bp;O!Jc1#2r5A{W{lL-rWJi4yNxoqed__yA#|wYm z^*u1$7Yz=^WMjdDxZ2TY$CY%SYXq6l+x!B{Z;aqZZ-{7aJI?Iv8t#~W + + + From 95e2cc82bc2ef74a446be1ea8457e23abdb163a1 Mon Sep 17 00:00:00 2001 From: Elias Meire Date: Fri, 31 May 2024 10:43:42 +0200 Subject: [PATCH 08/20] Add theme support for badgeIcon --- packages/editor-ui/src/components/NodeIcon.vue | 7 +++++-- packages/editor-ui/src/utils/nodeTypesUtils.ts | 7 +++++++ 2 files changed, 12 insertions(+), 2 deletions(-) diff --git a/packages/editor-ui/src/components/NodeIcon.vue b/packages/editor-ui/src/components/NodeIcon.vue index 0e7648f3984bb..179ccb1db5330 100644 --- a/packages/editor-ui/src/components/NodeIcon.vue +++ b/packages/editor-ui/src/components/NodeIcon.vue @@ -19,7 +19,7 @@ import type { IVersionNode } from '@/Interface'; import { useRootStore } from '@/stores/n8nRoot.store'; import { useUIStore } from '@/stores/ui.store'; -import { getNodeIcon, getNodeIconUrl } from '@/utils/nodeTypesUtils'; +import { getBadgeIconUrl, getNodeIcon, getNodeIconUrl } from '@/utils/nodeTypesUtils'; import type { INodeTypeDescription } from 'n8n-workflow'; import { computed } from 'vue'; @@ -123,7 +123,10 @@ const iconSource = computed(() => { const badge = computed(() => { const nodeType = props.nodeType; if (nodeType && 'badgeIconUrl' in nodeType && nodeType.badgeIconUrl) { - return { type: 'file', src: rootStore.getBaseUrl + nodeType.badgeIconUrl }; + return { + type: 'file', + src: rootStore.getBaseUrl + getBadgeIconUrl(nodeType, uiStore.appliedTheme), + }; } return undefined; diff --git a/packages/editor-ui/src/utils/nodeTypesUtils.ts b/packages/editor-ui/src/utils/nodeTypesUtils.ts index 6a1f4788dfae1..16ef6db925dcc 100644 --- a/packages/editor-ui/src/utils/nodeTypesUtils.ts +++ b/packages/editor-ui/src/utils/nodeTypesUtils.ts @@ -463,3 +463,10 @@ export const getNodeIconUrl = ( ): string | null => { return getThemedValue(nodeType.iconUrl, theme); }; + +export const getBadgeIconUrl = ( + nodeType: INodeTypeDescription, + theme: AppliedThemeOption = 'light', +): string | null => { + return getThemedValue(nodeType.badgeIconUrl, theme); +}; From ae049a5acb605ec3aeb22e8223f5aad369eecce5 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Fri, 31 May 2024 15:14:45 +0200 Subject: [PATCH 09/20] More nodes color stuff (still in progress). --- .../nodes/agents/Agent/Agent.node.ts | 1 + .../EmbeddingsOpenAI/EmbeddingsOpenAi.node.ts | 2 +- .../embeddings/EmbeddingsOpenAI/openAi.svg | 1 - .../EmbeddingsOpenAI/openAiLight.dark.svg | 3 +++ .../EmbeddingsOpenAI/openAiLight.svg | 3 +++ .../llms/LMChatOpenAi/LmChatOpenAi.node.ts | 2 +- .../nodes/llms/LMChatOpenAi/openAi.svg | 1 - .../llms/LMChatOpenAi/openAiLight.dark.svg | 3 +++ .../nodes/llms/LMChatOpenAi/openAiLight.svg | 3 +++ .../nodes/llms/LMOpenAi/LmOpenAi.node.ts | 2 +- .../nodes/llms/LMOpenAi/openAi.svg | 1 - .../nodes/llms/LMOpenAi/openAiLight.dark.svg | 3 +++ .../nodes/llms/LMOpenAi/openAiLight.svg | 3 +++ .../OpenAi/actions/versionDescription.ts | 2 +- .../nodes/vendors/OpenAi/openAi.dark.svg | 3 +++ .../nodes/vendors/OpenAi/openAi.svg | 4 +++- .../design-system/src/css/_tokens.dark.scss | 9 +++++++-- packages/design-system/src/css/_tokens.scss | 19 +++++++++++++++---- packages/editor-ui/src/n8n-theme.scss | 10 ++-------- .../nodes/Compression/Compression.node.ts | 1 + .../nodes-base/nodes/Crypto/Crypto.node.ts | 1 + .../nodes/EditImage/EditImage.node.ts | 1 + .../nodes/ErrorTrigger/ErrorTrigger.node.ts | 1 + .../Files/ConvertToFile/ConvertToFile.node.ts | 2 +- .../ConvertToFile/convertToFile.dark.svg | 5 +++++ .../Files/ConvertToFile/convertToFile.svg | 15 ++++----------- .../ExtractFromFile/ExtractFromFile.node.ts | 2 +- .../ExtractFromFile/extractFromFile.dark.svg | 5 +++++ .../Files/ExtractFromFile/extractFromFile.svg | 8 ++++---- packages/nodes-base/nodes/Html/Html.node.ts | 2 +- packages/nodes-base/nodes/Html/html.dark.svg | 7 +++++++ packages/nodes-base/nodes/Html/html.svg | 8 +++++++- .../nodes/HttpRequest/HttpRequest.node.ts | 2 +- .../nodes/HttpRequest/httprequest.dark.svg | 3 +++ .../nodes/HttpRequest/httprequest.svg | 4 +++- .../LocalFileTrigger/LocalFileTrigger.node.ts | 1 + .../nodes/Markdown/Markdown.node.ts | 2 +- .../nodes/Markdown/markdown.dark.svg | 3 +++ .../nodes-base/nodes/Markdown/markdown.svg | 4 +++- packages/nodes-base/nodes/MySql/MySql.node.ts | 2 +- .../nodes-base/nodes/MySql/mysql.dark.svg | 3 +++ packages/nodes-base/nodes/MySql/mysql.svg | 4 +++- .../MySql/v2/actions/versionDescription.ts | 2 +- .../nodes-base/nodes/Notion/Notion.node.ts | 2 +- .../nodes/Notion/NotionTrigger.node.ts | 2 +- .../nodes-base/nodes/Notion/notion.dark.svg | 3 +++ packages/nodes-base/nodes/Notion/notion.svg | 4 +++- .../nodes/Notion/v2/VersionDescription.ts | 2 +- .../nodes/RenameKeys/RenameKeys.node.ts | 1 + .../nodes-base/nodes/Set/v2/SetV2.node.ts | 3 +-- packages/nodes-base/nodes/Ssh/Ssh.node.ts | 1 + .../nodes/StopAndError/StopAndError.node.ts | 1 + packages/nodes-base/nodes/Wait/Wait.node.ts | 1 + packages/nodes-base/nodes/Xml/Xml.node.ts | 1 + packages/workflow/src/Interfaces.ts | 16 +++++++++++++++- 55 files changed, 145 insertions(+), 55 deletions(-) delete mode 100644 packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAi.svg create mode 100644 packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAiLight.dark.svg create mode 100644 packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAiLight.svg delete mode 100644 packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAi.svg create mode 100644 packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAiLight.dark.svg create mode 100644 packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAiLight.svg delete mode 100644 packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAi.svg create mode 100644 packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAiLight.dark.svg create mode 100644 packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAiLight.svg create mode 100644 packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/openAi.dark.svg create mode 100644 packages/nodes-base/nodes/Files/ConvertToFile/convertToFile.dark.svg create mode 100644 packages/nodes-base/nodes/Files/ExtractFromFile/extractFromFile.dark.svg create mode 100644 packages/nodes-base/nodes/Html/html.dark.svg create mode 100644 packages/nodes-base/nodes/HttpRequest/httprequest.dark.svg create mode 100644 packages/nodes-base/nodes/Markdown/markdown.dark.svg create mode 100644 packages/nodes-base/nodes/MySql/mysql.dark.svg create mode 100644 packages/nodes-base/nodes/Notion/notion.dark.svg diff --git a/packages/@n8n/nodes-langchain/nodes/agents/Agent/Agent.node.ts b/packages/@n8n/nodes-langchain/nodes/agents/Agent/Agent.node.ts index 1d15d718401d4..e4ab53da125e3 100644 --- a/packages/@n8n/nodes-langchain/nodes/agents/Agent/Agent.node.ts +++ b/packages/@n8n/nodes-langchain/nodes/agents/Agent/Agent.node.ts @@ -234,6 +234,7 @@ export class Agent implements INodeType { displayName: 'AI Agent', name: 'agent', icon: 'fa:robot', + iconColor: 'black', group: ['transform'], version: [1, 1.1, 1.2, 1.3, 1.4, 1.5, 1.6], description: 'Generates an action plan and executes it. Can use external tools.', diff --git a/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/EmbeddingsOpenAi.node.ts b/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/EmbeddingsOpenAi.node.ts index fa4387629948a..31180cd1e97b5 100644 --- a/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/EmbeddingsOpenAi.node.ts +++ b/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/EmbeddingsOpenAi.node.ts @@ -71,7 +71,7 @@ export class EmbeddingsOpenAi implements INodeType { description: INodeTypeDescription = { displayName: 'Embeddings OpenAI', name: 'embeddingsOpenAi', - icon: 'file:openAi.svg', + icon: { light: 'file:openAiLight.svg', dark: 'file:openAiLight.dark.svg' }, credentials: [ { name: 'openAiApi', diff --git a/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAi.svg b/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAi.svg deleted file mode 100644 index 73d7895782176..0000000000000 --- a/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAi.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAiLight.dark.svg b/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAiLight.dark.svg new file mode 100644 index 0000000000000..ceaa2c40b35b7 --- /dev/null +++ b/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAiLight.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAiLight.svg b/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAiLight.svg new file mode 100644 index 0000000000000..c8a79cebaba68 --- /dev/null +++ b/packages/@n8n/nodes-langchain/nodes/embeddings/EmbeddingsOpenAI/openAiLight.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/LmChatOpenAi.node.ts b/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/LmChatOpenAi.node.ts index 42bb08aaea8af..5cf188e75226c 100644 --- a/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/LmChatOpenAi.node.ts +++ b/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/LmChatOpenAi.node.ts @@ -16,7 +16,7 @@ export class LmChatOpenAi implements INodeType { displayName: 'OpenAI Chat Model', // eslint-disable-next-line n8n-nodes-base/node-class-description-name-miscased name: 'lmChatOpenAi', - icon: 'file:openAi.svg', + icon: { light: 'file:openAiLight.svg', dark: 'file:openAiLight.dark.svg' }, group: ['transform'], version: 1, description: 'For advanced usage with an AI chain', diff --git a/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAi.svg b/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAi.svg deleted file mode 100644 index 73d7895782176..0000000000000 --- a/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAi.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAiLight.dark.svg b/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAiLight.dark.svg new file mode 100644 index 0000000000000..ceaa2c40b35b7 --- /dev/null +++ b/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAiLight.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAiLight.svg b/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAiLight.svg new file mode 100644 index 0000000000000..c8a79cebaba68 --- /dev/null +++ b/packages/@n8n/nodes-langchain/nodes/llms/LMChatOpenAi/openAiLight.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/LmOpenAi.node.ts b/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/LmOpenAi.node.ts index 70b8970cc25ec..3f2d1c4315c4e 100644 --- a/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/LmOpenAi.node.ts +++ b/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/LmOpenAi.node.ts @@ -28,7 +28,7 @@ export class LmOpenAi implements INodeType { displayName: 'OpenAI Model', // eslint-disable-next-line n8n-nodes-base/node-class-description-name-miscased name: 'lmOpenAi', - icon: 'file:openAi.svg', + icon: { light: 'file:openAiLight.svg', dark: 'file:openAiLight.dark.svg' }, group: ['transform'], version: 1, description: 'For advanced usage with an AI chain', diff --git a/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAi.svg b/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAi.svg deleted file mode 100644 index 73d7895782176..0000000000000 --- a/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAi.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAiLight.dark.svg b/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAiLight.dark.svg new file mode 100644 index 0000000000000..ceaa2c40b35b7 --- /dev/null +++ b/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAiLight.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAiLight.svg b/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAiLight.svg new file mode 100644 index 0000000000000..c8a79cebaba68 --- /dev/null +++ b/packages/@n8n/nodes-langchain/nodes/llms/LMOpenAi/openAiLight.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/actions/versionDescription.ts b/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/actions/versionDescription.ts index 38aa1698a588b..4f918a8cd9d87 100644 --- a/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/actions/versionDescription.ts +++ b/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/actions/versionDescription.ts @@ -67,7 +67,7 @@ const configureNodeInputs = (resource: string, operation: string, hideTools: str export const versionDescription: INodeTypeDescription = { displayName: 'OpenAI', name: 'openAi', - icon: 'file:openAi.svg', + icon: { light: 'file:openAi.svg', dark: 'file:openAi.dark.svg' }, group: ['transform'], version: [1, 1.1, 1.2, 1.3], subtitle: `={{(${prettifyOperation})($parameter.resource, $parameter.operation)}}`, diff --git a/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/openAi.dark.svg b/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/openAi.dark.svg new file mode 100644 index 0000000000000..afc9e5cb6a916 --- /dev/null +++ b/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/openAi.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/openAi.svg b/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/openAi.svg index 4f8812da72e68..1a25faf77d597 100644 --- a/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/openAi.svg +++ b/packages/@n8n/nodes-langchain/nodes/vendors/OpenAi/openAi.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/design-system/src/css/_tokens.dark.scss b/packages/design-system/src/css/_tokens.dark.scss index 7c2f4304dfc86..094c3fe03d003 100644 --- a/packages/design-system/src/css/_tokens.dark.scss +++ b/packages/design-system/src/css/_tokens.dark.scss @@ -79,10 +79,11 @@ --color-node-icon-black: var(--prim-gray-70); --color-node-icon-blue: #766dfb; --color-node-icon-light-blue: #5fabf7; + --color-node-icon-dark-blue: #6275ad; --color-node-icon-orange: #ff965a; --color-node-icon-orange-red: #ff6d5a; + --color-node-icon-red: var(--prim-color-alt-k); --color-node-icon-light-green: #26b28f; - --color-node-icon-green: #49d7b4; --color-node-icon-dark-green: #86dec8; --color-node-icon-azure: #54b8c9; --color-node-icon-purple: #9b6dd5; @@ -236,6 +237,10 @@ --color-mfa-recovery-code-color: var(--color-text-dark); --color-mfa-lose-access-text-color: var(--color-danger); + // AI + --node-type-background-l: 20%; + --node-type-supplemental-color-s: 15%; + // Various --color-info-tint-1: var(--prim-gray-420); --color-info-tint-2: var(--prim-gray-740); @@ -248,7 +253,7 @@ var(--node-type-supplemental-label-color-s), var(--node-type-supplemental-label-color-l) ); - --color-configurable-node-name: var(--color-text-lighter); + --color-configurable-node-name: var(--color-text-dark); --color-secondary-link: var(--prim-color-secondary-tint-200); --color-secondary-link-hover: var(--prim-color-secondary-tint-100); } diff --git a/packages/design-system/src/css/_tokens.scss b/packages/design-system/src/css/_tokens.scss index d7c788de0e425..ffa9a5eb99752 100644 --- a/packages/design-system/src/css/_tokens.scss +++ b/packages/design-system/src/css/_tokens.scss @@ -109,16 +109,18 @@ // NodeIcon --color-node-icon-gray: var(--prim-gray-420); --color-node-icon-black: var(--prim-gray-780); - --color-node-icon-blue: #4a3eea; + --color-node-icon-blue: #3a42e9; --color-node-icon-light-blue: #5fabf7; + --color-node-icon-dark-blue: #353f6e; --color-node-icon-orange: #ff965a; --color-node-icon-orange-red: #ff6d5a; + --color-node-icon-red: var(--prim-color-alt-c); --color-node-icon-light-green: #31c49f; - --color-node-icon-green: #1ea986; + --color-node-icon-green: #108e49; --color-node-icon-dark-green: #15755d; --color-node-icon-azure: #54b8c9; - --color-node-icon-purple: #9b6dd5; - --color-node-icon-crimson: #bb3a5a; + --color-node-icon-purple: #553399; + --color-node-icon-crimson: #772244; // Expressions, autocomplete, infobox --color-valid-resolvable-foreground: var(--prim-color-alt-a); @@ -296,6 +298,15 @@ --color-mfa-recovery-code-color: var(--prim-gray-490); --color-mfa-lose-access-text-color: var(--color-danger); + // AI + --node-type-background-l: 95%; + --node-type-supplemental-label-color-h: 235; + --node-type-supplemental-label-color-s: 28%; + --node-type-supplemental-label-color-l: 40%; + --node-type-supplemental-color-h: 235; + --node-type-supplemental-color-s: 28%; + --node-type-supplemental-color-l: 60%; + // Various --color-avatar-accent-1: var(--prim-gray-120); --color-avatar-accent-2: var(--prim-color-alt-e-shade-100); diff --git a/packages/editor-ui/src/n8n-theme.scss b/packages/editor-ui/src/n8n-theme.scss index 7893d0610dc30..e67a07bd2a32c 100644 --- a/packages/editor-ui/src/n8n-theme.scss +++ b/packages/editor-ui/src/n8n-theme.scss @@ -2,19 +2,11 @@ @import 'styles'; :root { - --node-type-background-l: 95%; - - --node-type-supplemental-label-color-h: 235; - --node-type-supplemental-label-color-s: 28%; - --node-type-supplemental-label-color-l: 40%; --node-type-supplemental-label-color: hsl( var(--node-type-supplemental-label-color-h), var(--node-type-supplemental-label-color-s), var(--node-type-supplemental-label-color-l) ); - --node-type-supplemental-color-h: 235; - --node-type-supplemental-color-s: 28%; - --node-type-supplemental-color-l: 60%; --node-type-supplemental-icon: var(--color-foreground-dark); --node-type-supplemental-color: hsl( var(--node-type-supplemental-color-h), @@ -187,6 +179,7 @@ --chat--header--color: var(--color-text-dark); --chat--header--border-bottom: var(--border-base); --chat--close--button--color-hover: var(--color-primary); + // Message styles --chat--message--padding: var(--spacing-3xs); --chat--message--font-size: 14px; @@ -196,6 +189,7 @@ --chat--message--user--color: var(--color-text-dark); --chat--message--user--background: var(--color-success-tint-1); --chat--message--user--border: 1px solid var(--color-success-light-2); + // Chat input --chat--input--font-size: var(--font-size-s); --chat--input--send--button--color: var(--color-success); diff --git a/packages/nodes-base/nodes/Compression/Compression.node.ts b/packages/nodes-base/nodes/Compression/Compression.node.ts index a26a99657bc9b..506b239ffed2c 100644 --- a/packages/nodes-base/nodes/Compression/Compression.node.ts +++ b/packages/nodes-base/nodes/Compression/Compression.node.ts @@ -48,6 +48,7 @@ export class Compression implements INodeType { displayName: 'Compression', name: 'compression', icon: 'fa:file-archive', + iconColor: 'green', group: ['transform'], subtitle: '={{$parameter["operation"]}}', version: [1, 1.1], diff --git a/packages/nodes-base/nodes/Crypto/Crypto.node.ts b/packages/nodes-base/nodes/Crypto/Crypto.node.ts index fc6416349c5a9..131946f63526b 100644 --- a/packages/nodes-base/nodes/Crypto/Crypto.node.ts +++ b/packages/nodes-base/nodes/Crypto/Crypto.node.ts @@ -30,6 +30,7 @@ export class Crypto implements INodeType { displayName: 'Crypto', name: 'crypto', icon: 'fa:key', + iconColor: 'green', group: ['transform'], version: 1, subtitle: '={{$parameter["action"]}}', diff --git a/packages/nodes-base/nodes/EditImage/EditImage.node.ts b/packages/nodes-base/nodes/EditImage/EditImage.node.ts index 04b8e3dc9149a..098c75c67ae17 100644 --- a/packages/nodes-base/nodes/EditImage/EditImage.node.ts +++ b/packages/nodes-base/nodes/EditImage/EditImage.node.ts @@ -757,6 +757,7 @@ export class EditImage implements INodeType { displayName: 'Edit Image', name: 'editImage', icon: 'fa:image', + iconColor: 'purple', group: ['transform'], version: 1, description: 'Edits an image like blur, resize or adding border and text', diff --git a/packages/nodes-base/nodes/ErrorTrigger/ErrorTrigger.node.ts b/packages/nodes-base/nodes/ErrorTrigger/ErrorTrigger.node.ts index 21cae5777be54..a3f30516cc699 100644 --- a/packages/nodes-base/nodes/ErrorTrigger/ErrorTrigger.node.ts +++ b/packages/nodes-base/nodes/ErrorTrigger/ErrorTrigger.node.ts @@ -10,6 +10,7 @@ export class ErrorTrigger implements INodeType { displayName: 'Error Trigger', name: 'errorTrigger', icon: 'fa:bug', + iconColor: 'blue', group: ['trigger'], version: 1, description: 'Triggers the workflow when another workflow has an error', diff --git a/packages/nodes-base/nodes/Files/ConvertToFile/ConvertToFile.node.ts b/packages/nodes-base/nodes/Files/ConvertToFile/ConvertToFile.node.ts index a89beebb51277..b30aa7cb5dbd9 100644 --- a/packages/nodes-base/nodes/Files/ConvertToFile/ConvertToFile.node.ts +++ b/packages/nodes-base/nodes/Files/ConvertToFile/ConvertToFile.node.ts @@ -16,7 +16,7 @@ export class ConvertToFile implements INodeType { description: INodeTypeDescription = { displayName: 'Convert to File', name: 'convertToFile', - icon: 'file:convertToFile.svg', + icon: { light: 'file:convertToFile.svg', dark: 'file:convertToFile.dark.svg' }, group: ['input'], version: [1, 1.1], description: 'Convert JSON data to binary data', diff --git a/packages/nodes-base/nodes/Files/ConvertToFile/convertToFile.dark.svg b/packages/nodes-base/nodes/Files/ConvertToFile/convertToFile.dark.svg new file mode 100644 index 0000000000000..8c53600475f96 --- /dev/null +++ b/packages/nodes-base/nodes/Files/ConvertToFile/convertToFile.dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/nodes/Files/ConvertToFile/convertToFile.svg b/packages/nodes-base/nodes/Files/ConvertToFile/convertToFile.svg index 60ca4a415a137..ec23c0abc3ba9 100644 --- a/packages/nodes-base/nodes/Files/ConvertToFile/convertToFile.svg +++ b/packages/nodes-base/nodes/Files/ConvertToFile/convertToFile.svg @@ -1,12 +1,5 @@ - - - - - - - - - - - + + + + diff --git a/packages/nodes-base/nodes/Files/ExtractFromFile/ExtractFromFile.node.ts b/packages/nodes-base/nodes/Files/ExtractFromFile/ExtractFromFile.node.ts index 156988eefa3fc..cec7211989a98 100644 --- a/packages/nodes-base/nodes/Files/ExtractFromFile/ExtractFromFile.node.ts +++ b/packages/nodes-base/nodes/Files/ExtractFromFile/ExtractFromFile.node.ts @@ -14,7 +14,7 @@ export class ExtractFromFile implements INodeType { description: INodeTypeDescription = { displayName: 'Extract from File', name: 'extractFromFile', - icon: 'file:extractFromFile.svg', + icon: { light: 'file:extractFromFile.svg', dark: 'file:extractFromFile.dark.svg' }, group: ['input'], version: 1, description: 'Convert binary data to JSON', diff --git a/packages/nodes-base/nodes/Files/ExtractFromFile/extractFromFile.dark.svg b/packages/nodes-base/nodes/Files/ExtractFromFile/extractFromFile.dark.svg new file mode 100644 index 0000000000000..0b85f112c1b36 --- /dev/null +++ b/packages/nodes-base/nodes/Files/ExtractFromFile/extractFromFile.dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/nodes/Files/ExtractFromFile/extractFromFile.svg b/packages/nodes-base/nodes/Files/ExtractFromFile/extractFromFile.svg index 2c235b7a2d9d8..90ae4db326836 100644 --- a/packages/nodes-base/nodes/Files/ExtractFromFile/extractFromFile.svg +++ b/packages/nodes-base/nodes/Files/ExtractFromFile/extractFromFile.svg @@ -1,5 +1,5 @@ - - - - + + + + diff --git a/packages/nodes-base/nodes/Html/Html.node.ts b/packages/nodes-base/nodes/Html/Html.node.ts index a181575269671..d4df15e547086 100644 --- a/packages/nodes-base/nodes/Html/Html.node.ts +++ b/packages/nodes-base/nodes/Html/Html.node.ts @@ -125,7 +125,7 @@ export class Html implements INodeType { description: INodeTypeDescription = { displayName: 'HTML', name: 'html', - icon: 'file:html.svg', + icon: { light: 'file:html.svg', dark: 'file:html.dark.svg' }, group: ['transform'], version: [1, 1.1, 1.2], subtitle: '={{ $parameter["operation"] }}', diff --git a/packages/nodes-base/nodes/Html/html.dark.svg b/packages/nodes-base/nodes/Html/html.dark.svg new file mode 100644 index 0000000000000..40e2c2fb65dfa --- /dev/null +++ b/packages/nodes-base/nodes/Html/html.dark.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/packages/nodes-base/nodes/Html/html.svg b/packages/nodes-base/nodes/Html/html.svg index 816043b8872ea..dc8fcad033158 100644 --- a/packages/nodes-base/nodes/Html/html.svg +++ b/packages/nodes-base/nodes/Html/html.svg @@ -1 +1,7 @@ - \ No newline at end of file + + + + + + + diff --git a/packages/nodes-base/nodes/HttpRequest/HttpRequest.node.ts b/packages/nodes-base/nodes/HttpRequest/HttpRequest.node.ts index a8317a289ae8f..b125a1630a97b 100644 --- a/packages/nodes-base/nodes/HttpRequest/HttpRequest.node.ts +++ b/packages/nodes-base/nodes/HttpRequest/HttpRequest.node.ts @@ -10,7 +10,7 @@ export class HttpRequest extends VersionedNodeType { const baseDescription: INodeTypeBaseDescription = { displayName: 'HTTP Request', name: 'httpRequest', - icon: 'file:httprequest.svg', + icon: { light: 'file:httprequest.svg', dark: 'file:httprequest.dark.svg' }, group: ['output'], subtitle: '={{$parameter["requestMethod"] + ": " + $parameter["url"]}}', description: 'Makes an HTTP request and returns the response data', diff --git a/packages/nodes-base/nodes/HttpRequest/httprequest.dark.svg b/packages/nodes-base/nodes/HttpRequest/httprequest.dark.svg new file mode 100644 index 0000000000000..3c3deba21d1cf --- /dev/null +++ b/packages/nodes-base/nodes/HttpRequest/httprequest.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/HttpRequest/httprequest.svg b/packages/nodes-base/nodes/HttpRequest/httprequest.svg index 955eb3940194a..5300c5953e554 100644 --- a/packages/nodes-base/nodes/HttpRequest/httprequest.svg +++ b/packages/nodes-base/nodes/HttpRequest/httprequest.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/LocalFileTrigger/LocalFileTrigger.node.ts b/packages/nodes-base/nodes/LocalFileTrigger/LocalFileTrigger.node.ts index 1acb8d4c475ae..fa8322a73cabb 100644 --- a/packages/nodes-base/nodes/LocalFileTrigger/LocalFileTrigger.node.ts +++ b/packages/nodes-base/nodes/LocalFileTrigger/LocalFileTrigger.node.ts @@ -13,6 +13,7 @@ export class LocalFileTrigger implements INodeType { displayName: 'Local File Trigger', name: 'localFileTrigger', icon: 'fa:folder-open', + iconColor: 'black', group: ['trigger'], version: 1, subtitle: '=Path: {{$parameter["path"]}}', diff --git a/packages/nodes-base/nodes/Markdown/Markdown.node.ts b/packages/nodes-base/nodes/Markdown/Markdown.node.ts index e3b7fc79ada4f..82272a44e5187 100644 --- a/packages/nodes-base/nodes/Markdown/Markdown.node.ts +++ b/packages/nodes-base/nodes/Markdown/Markdown.node.ts @@ -19,7 +19,7 @@ export class Markdown implements INodeType { description: INodeTypeDescription = { displayName: 'Markdown', name: 'markdown', - icon: 'file:markdown.svg', + icon: { light: 'file:markdown.svg', dark: 'file:markdown.dark.svg' }, group: ['output'], version: 1, subtitle: diff --git a/packages/nodes-base/nodes/Markdown/markdown.dark.svg b/packages/nodes-base/nodes/Markdown/markdown.dark.svg new file mode 100644 index 0000000000000..fc6232ce5d7ee --- /dev/null +++ b/packages/nodes-base/nodes/Markdown/markdown.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Markdown/markdown.svg b/packages/nodes-base/nodes/Markdown/markdown.svg index 98de0464e12e6..44ebca8dc6f64 100644 --- a/packages/nodes-base/nodes/Markdown/markdown.svg +++ b/packages/nodes-base/nodes/Markdown/markdown.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/MySql/MySql.node.ts b/packages/nodes-base/nodes/MySql/MySql.node.ts index 30cbbaada0b12..426c1bff47cbb 100644 --- a/packages/nodes-base/nodes/MySql/MySql.node.ts +++ b/packages/nodes-base/nodes/MySql/MySql.node.ts @@ -9,7 +9,7 @@ export class MySql extends VersionedNodeType { const baseDescription: INodeTypeBaseDescription = { displayName: 'MySQL', name: 'mySql', - icon: 'file:mysql.svg', + icon: { light: 'file:mysql.svg', dark: 'file:mysql.dark.svg' }, group: ['input'], defaultVersion: 2.4, description: 'Get, add and update data in MySQL', diff --git a/packages/nodes-base/nodes/MySql/mysql.dark.svg b/packages/nodes-base/nodes/MySql/mysql.dark.svg new file mode 100644 index 0000000000000..14e86ad18a708 --- /dev/null +++ b/packages/nodes-base/nodes/MySql/mysql.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/MySql/mysql.svg b/packages/nodes-base/nodes/MySql/mysql.svg index 165fd30c82abd..ca3b2693c4a41 100644 --- a/packages/nodes-base/nodes/MySql/mysql.svg +++ b/packages/nodes-base/nodes/MySql/mysql.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/MySql/v2/actions/versionDescription.ts b/packages/nodes-base/nodes/MySql/v2/actions/versionDescription.ts index 2c1b7b3e7db70..ad8e170691d77 100644 --- a/packages/nodes-base/nodes/MySql/v2/actions/versionDescription.ts +++ b/packages/nodes-base/nodes/MySql/v2/actions/versionDescription.ts @@ -6,7 +6,7 @@ import * as database from './database/Database.resource'; export const versionDescription: INodeTypeDescription = { displayName: 'MySQL', name: 'mySql', - icon: 'file:mysql.svg', + icon: { light: 'file:mysql.svg', dark: 'file:mysql.dark.svg' }, group: ['input'], version: [2, 2.1, 2.2, 2.3, 2.4], subtitle: '={{ $parameter["operation"] }}', diff --git a/packages/nodes-base/nodes/Notion/Notion.node.ts b/packages/nodes-base/nodes/Notion/Notion.node.ts index 7601a89867e68..953c4233ef4cc 100644 --- a/packages/nodes-base/nodes/Notion/Notion.node.ts +++ b/packages/nodes-base/nodes/Notion/Notion.node.ts @@ -9,7 +9,7 @@ export class Notion extends VersionedNodeType { const baseDescription: INodeTypeBaseDescription = { displayName: 'Notion', name: 'notion', - icon: 'file:notion.svg', + icon: { light: 'file:notion.svg', dark: 'file:notion.dark.svg' }, group: ['output'], subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', description: 'Consume Notion API', diff --git a/packages/nodes-base/nodes/Notion/NotionTrigger.node.ts b/packages/nodes-base/nodes/Notion/NotionTrigger.node.ts index ca6c69aa86852..537fbfa43d636 100644 --- a/packages/nodes-base/nodes/Notion/NotionTrigger.node.ts +++ b/packages/nodes-base/nodes/Notion/NotionTrigger.node.ts @@ -15,7 +15,7 @@ export class NotionTrigger implements INodeType { description: INodeTypeDescription = { displayName: 'Notion Trigger', name: 'notionTrigger', - icon: 'file:notion.svg', + icon: { light: 'file:notion.svg', dark: 'file:notion.dark.svg' }, group: ['trigger'], version: 1, description: 'Starts the workflow when Notion events occur', diff --git a/packages/nodes-base/nodes/Notion/notion.dark.svg b/packages/nodes-base/nodes/Notion/notion.dark.svg new file mode 100644 index 0000000000000..06d94f49736d4 --- /dev/null +++ b/packages/nodes-base/nodes/Notion/notion.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/nodes/Notion/notion.svg b/packages/nodes-base/nodes/Notion/notion.svg index f2af3da9b223a..d41d03330277f 100644 --- a/packages/nodes-base/nodes/Notion/notion.svg +++ b/packages/nodes-base/nodes/Notion/notion.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/Notion/v2/VersionDescription.ts b/packages/nodes-base/nodes/Notion/v2/VersionDescription.ts index 0cdd0995738ab..934152fa26c6d 100644 --- a/packages/nodes-base/nodes/Notion/v2/VersionDescription.ts +++ b/packages/nodes-base/nodes/Notion/v2/VersionDescription.ts @@ -16,7 +16,7 @@ import { export const versionDescription: INodeTypeDescription = { displayName: 'Notion', name: 'notion', - icon: 'file:notion.svg', + icon: { light: 'file:notion.svg', dark: 'file:notion.dark.svg' }, group: ['output'], version: [2, 2.1, 2.2], subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/RenameKeys/RenameKeys.node.ts b/packages/nodes-base/nodes/RenameKeys/RenameKeys.node.ts index d3a8d1ba71916..940bb04d171a8 100644 --- a/packages/nodes-base/nodes/RenameKeys/RenameKeys.node.ts +++ b/packages/nodes-base/nodes/RenameKeys/RenameKeys.node.ts @@ -21,6 +21,7 @@ export class RenameKeys implements INodeType { displayName: 'Rename Keys', name: 'renameKeys', icon: 'fa:edit', + iconColor: 'crimson', group: ['transform'], version: 1, description: 'Update item field names', diff --git a/packages/nodes-base/nodes/Set/v2/SetV2.node.ts b/packages/nodes-base/nodes/Set/v2/SetV2.node.ts index 41cc4a2f337d2..89ace04c7d9cb 100644 --- a/packages/nodes-base/nodes/Set/v2/SetV2.node.ts +++ b/packages/nodes-base/nodes/Set/v2/SetV2.node.ts @@ -19,14 +19,13 @@ type Mode = 'manual' | 'raw'; const versionDescription: INodeTypeDescription = { displayName: 'Edit Fields (Set)', name: 'set', - icon: 'fa:pen', + iconColor: 'blue', group: ['input'], version: [3, 3.1, 3.2, 3.3], description: 'Modify, add, or remove item fields', subtitle: '={{$parameter["mode"]}}', defaults: { name: 'Edit Fields', - color: '#0000FF', }, inputs: ['main'], outputs: ['main'], diff --git a/packages/nodes-base/nodes/Ssh/Ssh.node.ts b/packages/nodes-base/nodes/Ssh/Ssh.node.ts index 7625289797609..a43a20f243203 100644 --- a/packages/nodes-base/nodes/Ssh/Ssh.node.ts +++ b/packages/nodes-base/nodes/Ssh/Ssh.node.ts @@ -52,6 +52,7 @@ export class Ssh implements INodeType { displayName: 'SSH', name: 'ssh', icon: 'fa:terminal', + iconColor: 'black', group: ['input'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/StopAndError/StopAndError.node.ts b/packages/nodes-base/nodes/StopAndError/StopAndError.node.ts index 3378c73699ea9..addd4c0cf9f21 100644 --- a/packages/nodes-base/nodes/StopAndError/StopAndError.node.ts +++ b/packages/nodes-base/nodes/StopAndError/StopAndError.node.ts @@ -17,6 +17,7 @@ export class StopAndError implements INodeType { displayName: 'Stop and Error', name: 'stopAndError', icon: 'fa:exclamation-triangle', + iconColor: 'red', group: ['input'], version: 1, description: 'Throw an error in the workflow', diff --git a/packages/nodes-base/nodes/Wait/Wait.node.ts b/packages/nodes-base/nodes/Wait/Wait.node.ts index f30b006a08c64..d796bbadc2bae 100644 --- a/packages/nodes-base/nodes/Wait/Wait.node.ts +++ b/packages/nodes-base/nodes/Wait/Wait.node.ts @@ -226,6 +226,7 @@ export class Wait extends Webhook { displayName: 'Wait', name: 'wait', icon: 'fa:pause-circle', + iconColor: 'crimson', group: ['organization'], version: [1, 1.1], description: 'Wait before continue with execution', diff --git a/packages/nodes-base/nodes/Xml/Xml.node.ts b/packages/nodes-base/nodes/Xml/Xml.node.ts index efb3518a3414a..b29e80faf3cbd 100644 --- a/packages/nodes-base/nodes/Xml/Xml.node.ts +++ b/packages/nodes-base/nodes/Xml/Xml.node.ts @@ -12,6 +12,7 @@ export class Xml implements INodeType { displayName: 'XML', name: 'xml', icon: 'fa:file-code', + iconColor: 'purple', group: ['transform'], version: 1, subtitle: '={{$parameter["mode"]==="jsonToxml" ? "JSON to XML" : "XML to JSON"}}', diff --git a/packages/workflow/src/Interfaces.ts b/packages/workflow/src/Interfaces.ts index 509826d5e548e..1bb51caf686b5 100644 --- a/packages/workflow/src/Interfaces.ts +++ b/packages/workflow/src/Interfaces.ts @@ -1543,7 +1543,21 @@ export interface IWorkflowIssues { [key: string]: INodeIssues; } -export type NodeIconColor = 'gray' | 'black' | 'blue' | 'light-blue' | 'orange' | 'orange-red' | 'light-green' | 'green' | 'dark-green' | 'azure' | 'purple' | 'crimson'; +export type NodeIconColor = + | 'gray' + | 'black' + | 'blue' + | 'light-blue' + | 'dark-blue' + | 'orange' + | 'orange-red' + | 'red' + | 'light-green' + | 'green' + | 'dark-green' + | 'azure' + | 'purple' + | 'crimson'; export type Icon = `fa:${string}` | `file:${string}` | `node:${string}`; export type Themed = T | { light: T; dark: T }; From 2635000c0c808fdf1dd087edfa9cd771193bb220 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Fri, 31 May 2024 15:18:42 +0200 Subject: [PATCH 10/20] A couple of nodes more. --- packages/nodes-base/nodes/DateTime/DateTime.node.ts | 1 + packages/nodes-base/nodes/Ftp/Ftp.node.ts | 1 + 2 files changed, 2 insertions(+) diff --git a/packages/nodes-base/nodes/DateTime/DateTime.node.ts b/packages/nodes-base/nodes/DateTime/DateTime.node.ts index daffa817c0466..b5960c11c0478 100644 --- a/packages/nodes-base/nodes/DateTime/DateTime.node.ts +++ b/packages/nodes-base/nodes/DateTime/DateTime.node.ts @@ -10,6 +10,7 @@ export class DateTime extends VersionedNodeType { displayName: 'Date & Time', name: 'dateTime', icon: 'fa:clock', + iconColor: 'green', group: ['transform'], defaultVersion: 2, description: 'Allows you to manipulate date and time values', diff --git a/packages/nodes-base/nodes/Ftp/Ftp.node.ts b/packages/nodes-base/nodes/Ftp/Ftp.node.ts index 850c9eae54402..5306d928ff930 100644 --- a/packages/nodes-base/nodes/Ftp/Ftp.node.ts +++ b/packages/nodes-base/nodes/Ftp/Ftp.node.ts @@ -113,6 +113,7 @@ export class Ftp implements INodeType { displayName: 'FTP', name: 'ftp', icon: 'fa:server', + iconColor: 'dark-blue', group: ['input'], version: 1, subtitle: '={{$parameter["protocol"] + ": " + $parameter["operation"]}}', From 63760abeee500c7515e784b3a4ffc45994e86f78 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Fri, 31 May 2024 16:09:56 +0200 Subject: [PATCH 11/20] More color for nodes. --- packages/nodes-base/nodes/ExecuteCommand/ExecuteCommand.node.ts | 1 + packages/nodes-base/nodes/RssFeedRead/RssFeedRead.node.ts | 1 + packages/nodes-base/nodes/SseTrigger/SseTrigger.node.ts | 1 + 3 files changed, 3 insertions(+) diff --git a/packages/nodes-base/nodes/ExecuteCommand/ExecuteCommand.node.ts b/packages/nodes-base/nodes/ExecuteCommand/ExecuteCommand.node.ts index 5250270038c3f..b5e0b0f702daa 100644 --- a/packages/nodes-base/nodes/ExecuteCommand/ExecuteCommand.node.ts +++ b/packages/nodes-base/nodes/ExecuteCommand/ExecuteCommand.node.ts @@ -47,6 +47,7 @@ export class ExecuteCommand implements INodeType { displayName: 'Execute Command', name: 'executeCommand', icon: 'fa:terminal', + iconColor: 'crimson', group: ['transform'], version: 1, description: 'Executes a command on the host', diff --git a/packages/nodes-base/nodes/RssFeedRead/RssFeedRead.node.ts b/packages/nodes-base/nodes/RssFeedRead/RssFeedRead.node.ts index e16db2fb1c374..5eb9dc47aaefe 100644 --- a/packages/nodes-base/nodes/RssFeedRead/RssFeedRead.node.ts +++ b/packages/nodes-base/nodes/RssFeedRead/RssFeedRead.node.ts @@ -27,6 +27,7 @@ export class RssFeedRead implements INodeType { displayName: 'RSS Read', name: 'rssFeedRead', icon: 'fa:rss', + iconColor: 'orange-red', group: ['input'], version: [1, 1.1], description: 'Reads data from an RSS Feed', diff --git a/packages/nodes-base/nodes/SseTrigger/SseTrigger.node.ts b/packages/nodes-base/nodes/SseTrigger/SseTrigger.node.ts index 16d696817d8bc..48324668a6604 100644 --- a/packages/nodes-base/nodes/SseTrigger/SseTrigger.node.ts +++ b/packages/nodes-base/nodes/SseTrigger/SseTrigger.node.ts @@ -13,6 +13,7 @@ export class SseTrigger implements INodeType { displayName: 'SSE Trigger', name: 'sseTrigger', icon: 'fa:cloud-download-alt', + iconColor: 'dark-blue', group: ['trigger'], version: 1, description: 'Triggers the workflow when Server-Sent Events occur', From 5d84ab5ea770b538dfef049783cf584ded65eb91 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Fri, 31 May 2024 17:19:52 +0200 Subject: [PATCH 12/20] SVG icons. --- packages/nodes-base/credentials/icons/AWS.dark.svg | 5 +++++ packages/nodes-base/credentials/icons/AWS.svg | 6 +++++- packages/nodes-base/credentials/icons/Auth0.dark.svg | 3 +++ packages/nodes-base/credentials/icons/Auth0.svg | 4 +++- packages/nodes-base/credentials/icons/Cisco.dark.svg | 9 +++++++++ packages/nodes-base/credentials/icons/Cisco.svg | 10 +++++++++- .../credentials/icons/CrowdStrike.dark.svg | 7 +++++++ .../nodes-base/credentials/icons/CrowdStrike.svg | 8 +++++++- packages/nodes-base/credentials/icons/IBM.dark.svg | 3 +++ packages/nodes-base/credentials/icons/IBM.svg | 4 +++- .../nodes-base/credentials/icons/Imperva.dark.svg | 4 ++++ packages/nodes-base/credentials/icons/Imperva.svg | 5 ++++- packages/nodes-base/credentials/icons/Okta.dark.svg | 3 +++ packages/nodes-base/credentials/icons/Okta.svg | 4 +++- .../credentials/icons/RecordedFuture.dark.svg | 3 +++ .../nodes-base/credentials/icons/RecordedFuture.svg | 4 +++- packages/nodes-base/credentials/icons/Sekoia.svg | 4 +++- packages/nodes-base/credentials/icons/highLevel.svg | 12 +++++++++++- .../nodes-base/credentials/icons/vmware.dark.svg | 3 +++ packages/nodes-base/credentials/icons/vmware.svg | 4 +++- packages/nodes-base/nodes/Copper/copper.svg | 5 ++++- 21 files changed, 98 insertions(+), 12 deletions(-) create mode 100644 packages/nodes-base/credentials/icons/AWS.dark.svg create mode 100644 packages/nodes-base/credentials/icons/Auth0.dark.svg create mode 100644 packages/nodes-base/credentials/icons/Cisco.dark.svg create mode 100644 packages/nodes-base/credentials/icons/CrowdStrike.dark.svg create mode 100644 packages/nodes-base/credentials/icons/IBM.dark.svg create mode 100644 packages/nodes-base/credentials/icons/Imperva.dark.svg create mode 100644 packages/nodes-base/credentials/icons/Okta.dark.svg create mode 100644 packages/nodes-base/credentials/icons/RecordedFuture.dark.svg create mode 100644 packages/nodes-base/credentials/icons/vmware.dark.svg diff --git a/packages/nodes-base/credentials/icons/AWS.dark.svg b/packages/nodes-base/credentials/icons/AWS.dark.svg new file mode 100644 index 0000000000000..b4d02869ec81a --- /dev/null +++ b/packages/nodes-base/credentials/icons/AWS.dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/credentials/icons/AWS.svg b/packages/nodes-base/credentials/icons/AWS.svg index 760c2530f4568..2e6cea9b0454c 100644 --- a/packages/nodes-base/credentials/icons/AWS.svg +++ b/packages/nodes-base/credentials/icons/AWS.svg @@ -1 +1,5 @@ - \ No newline at end of file + + + + + diff --git a/packages/nodes-base/credentials/icons/Auth0.dark.svg b/packages/nodes-base/credentials/icons/Auth0.dark.svg new file mode 100644 index 0000000000000..548a8866db9b7 --- /dev/null +++ b/packages/nodes-base/credentials/icons/Auth0.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/credentials/icons/Auth0.svg b/packages/nodes-base/credentials/icons/Auth0.svg index 75ee017e1a036..040a94154c6dc 100644 --- a/packages/nodes-base/credentials/icons/Auth0.svg +++ b/packages/nodes-base/credentials/icons/Auth0.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/credentials/icons/Cisco.dark.svg b/packages/nodes-base/credentials/icons/Cisco.dark.svg new file mode 100644 index 0000000000000..9122bd2a4bf3b --- /dev/null +++ b/packages/nodes-base/credentials/icons/Cisco.dark.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/packages/nodes-base/credentials/icons/Cisco.svg b/packages/nodes-base/credentials/icons/Cisco.svg index 66a600af2cedf..3ef365fbb6497 100644 --- a/packages/nodes-base/credentials/icons/Cisco.svg +++ b/packages/nodes-base/credentials/icons/Cisco.svg @@ -1 +1,9 @@ - \ No newline at end of file + + + + + + + + + diff --git a/packages/nodes-base/credentials/icons/CrowdStrike.dark.svg b/packages/nodes-base/credentials/icons/CrowdStrike.dark.svg new file mode 100644 index 0000000000000..7cf9f3e8cc1f9 --- /dev/null +++ b/packages/nodes-base/credentials/icons/CrowdStrike.dark.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/packages/nodes-base/credentials/icons/CrowdStrike.svg b/packages/nodes-base/credentials/icons/CrowdStrike.svg index 8db5558b7bd33..9c83667d35af0 100644 --- a/packages/nodes-base/credentials/icons/CrowdStrike.svg +++ b/packages/nodes-base/credentials/icons/CrowdStrike.svg @@ -1 +1,7 @@ - \ No newline at end of file + + + + + + + diff --git a/packages/nodes-base/credentials/icons/IBM.dark.svg b/packages/nodes-base/credentials/icons/IBM.dark.svg new file mode 100644 index 0000000000000..eeb1d176ecfb7 --- /dev/null +++ b/packages/nodes-base/credentials/icons/IBM.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/credentials/icons/IBM.svg b/packages/nodes-base/credentials/icons/IBM.svg index 0e5ac9ec259ed..fc9472d3ef51f 100644 --- a/packages/nodes-base/credentials/icons/IBM.svg +++ b/packages/nodes-base/credentials/icons/IBM.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/credentials/icons/Imperva.dark.svg b/packages/nodes-base/credentials/icons/Imperva.dark.svg new file mode 100644 index 0000000000000..a19a28a31aa46 --- /dev/null +++ b/packages/nodes-base/credentials/icons/Imperva.dark.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/credentials/icons/Imperva.svg b/packages/nodes-base/credentials/icons/Imperva.svg index f8521cb9be7a9..730c87b9e501a 100644 --- a/packages/nodes-base/credentials/icons/Imperva.svg +++ b/packages/nodes-base/credentials/icons/Imperva.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + diff --git a/packages/nodes-base/credentials/icons/Okta.dark.svg b/packages/nodes-base/credentials/icons/Okta.dark.svg new file mode 100644 index 0000000000000..b6f1fd7e2b477 --- /dev/null +++ b/packages/nodes-base/credentials/icons/Okta.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/credentials/icons/Okta.svg b/packages/nodes-base/credentials/icons/Okta.svg index a7f2ff4ca8703..4ba579621f863 100644 --- a/packages/nodes-base/credentials/icons/Okta.svg +++ b/packages/nodes-base/credentials/icons/Okta.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/credentials/icons/RecordedFuture.dark.svg b/packages/nodes-base/credentials/icons/RecordedFuture.dark.svg new file mode 100644 index 0000000000000..2ee6c9e50358a --- /dev/null +++ b/packages/nodes-base/credentials/icons/RecordedFuture.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/credentials/icons/RecordedFuture.svg b/packages/nodes-base/credentials/icons/RecordedFuture.svg index 6e8e317fc3691..5bf4851764ea9 100644 --- a/packages/nodes-base/credentials/icons/RecordedFuture.svg +++ b/packages/nodes-base/credentials/icons/RecordedFuture.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/credentials/icons/Sekoia.svg b/packages/nodes-base/credentials/icons/Sekoia.svg index a60aa68d6aad0..8ee51e1789c60 100644 --- a/packages/nodes-base/credentials/icons/Sekoia.svg +++ b/packages/nodes-base/credentials/icons/Sekoia.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/credentials/icons/highLevel.svg b/packages/nodes-base/credentials/icons/highLevel.svg index 3df6e466f0bfa..407b6798f0a9f 100644 --- a/packages/nodes-base/credentials/icons/highLevel.svg +++ b/packages/nodes-base/credentials/icons/highLevel.svg @@ -1 +1,11 @@ - \ No newline at end of file + + + + + + + + + + + diff --git a/packages/nodes-base/credentials/icons/vmware.dark.svg b/packages/nodes-base/credentials/icons/vmware.dark.svg new file mode 100644 index 0000000000000..9291d339b37b3 --- /dev/null +++ b/packages/nodes-base/credentials/icons/vmware.dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/packages/nodes-base/credentials/icons/vmware.svg b/packages/nodes-base/credentials/icons/vmware.svg index 20b525da40d86..5c8d1c34ba970 100644 --- a/packages/nodes-base/credentials/icons/vmware.svg +++ b/packages/nodes-base/credentials/icons/vmware.svg @@ -1 +1,3 @@ - \ No newline at end of file + + + diff --git a/packages/nodes-base/nodes/Copper/copper.svg b/packages/nodes-base/nodes/Copper/copper.svg index 34114d9b916fe..90e88bfaf08cc 100644 --- a/packages/nodes-base/nodes/Copper/copper.svg +++ b/packages/nodes-base/nodes/Copper/copper.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + From fa22a5c9dc34d4e5a60aa807163d4210134d327b Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Fri, 31 May 2024 17:52:08 +0200 Subject: [PATCH 13/20] More icons. --- .../memory/MemoryManager/MemoryManager.node.ts | 1 + .../nodes/DebugHelper/DebugHelper.dark.svg | 5 +++++ .../nodes/DebugHelper/DebugHelper.node.ts | 2 +- .../nodes-base/nodes/DebugHelper/DebugHelper.svg | 6 +++++- .../nodes-base/nodes/Intercom/Intercom.node.ts | 2 +- packages/nodes-base/nodes/Intercom/intercom.png | Bin 1539 -> 0 bytes packages/nodes-base/nodes/Intercom/intercom.svg | 4 ++++ .../nodes-base/nodes/Kitemaker/Kitemaker.node.ts | 2 +- .../nodes/Kitemaker/kitemaker.dark.svg | 5 +++++ .../nodes-base/nodes/Kitemaker/kitemaker.svg | 6 +++++- .../N8nTrainingCustomerDatastore.node.ts | 5 ++++- .../n8nTrainingCustomerDatastore.dark.svg | 5 +++++ .../n8nTrainingCustomerDatastore.svg | 6 +++++- .../N8nTrainingCustomerMessenger.node.ts | 5 ++++- .../n8nTrainingCustomerMessenger.dark.svg | 4 ++++ .../n8nTrainingCustomerMessenger.svg | 5 ++++- 16 files changed, 54 insertions(+), 9 deletions(-) create mode 100644 packages/nodes-base/nodes/DebugHelper/DebugHelper.dark.svg delete mode 100644 packages/nodes-base/nodes/Intercom/intercom.png create mode 100644 packages/nodes-base/nodes/Intercom/intercom.svg create mode 100644 packages/nodes-base/nodes/Kitemaker/kitemaker.dark.svg create mode 100644 packages/nodes-base/nodes/N8nTrainingCustomerDatastore/n8nTrainingCustomerDatastore.dark.svg create mode 100644 packages/nodes-base/nodes/N8nTrainingCustomerMessenger/n8nTrainingCustomerMessenger.dark.svg diff --git a/packages/@n8n/nodes-langchain/nodes/memory/MemoryManager/MemoryManager.node.ts b/packages/@n8n/nodes-langchain/nodes/memory/MemoryManager/MemoryManager.node.ts index ef20fb041f816..d689bd97d6fc8 100644 --- a/packages/@n8n/nodes-langchain/nodes/memory/MemoryManager/MemoryManager.node.ts +++ b/packages/@n8n/nodes-langchain/nodes/memory/MemoryManager/MemoryManager.node.ts @@ -68,6 +68,7 @@ export class MemoryManager implements INodeType { displayName: 'Chat Memory Manager', name: 'memoryManager', icon: 'fa:database', + iconColor: 'black', group: ['transform'], version: [1, 1.1], description: 'Manage chat messages memory and use it in the workflow', diff --git a/packages/nodes-base/nodes/DebugHelper/DebugHelper.dark.svg b/packages/nodes-base/nodes/DebugHelper/DebugHelper.dark.svg new file mode 100644 index 0000000000000..86a929a1b73fd --- /dev/null +++ b/packages/nodes-base/nodes/DebugHelper/DebugHelper.dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/nodes/DebugHelper/DebugHelper.node.ts b/packages/nodes-base/nodes/DebugHelper/DebugHelper.node.ts index 6d657f66451d3..b8a80d110f73c 100644 --- a/packages/nodes-base/nodes/DebugHelper/DebugHelper.node.ts +++ b/packages/nodes-base/nodes/DebugHelper/DebugHelper.node.ts @@ -26,7 +26,7 @@ export class DebugHelper implements INodeType { description: INodeTypeDescription = { displayName: 'DebugHelper', name: 'debugHelper', - icon: 'file:DebugHelper.svg', + icon: { light: 'file:DebugHelper.svg', dark: 'file:DebugHelper.dark.svg' }, group: ['output'], subtitle: '={{$parameter["category"]}}', description: 'Causes problems intentionally and generates useful data for debugging', diff --git a/packages/nodes-base/nodes/DebugHelper/DebugHelper.svg b/packages/nodes-base/nodes/DebugHelper/DebugHelper.svg index b1a62f59e0379..e6940bec13044 100644 --- a/packages/nodes-base/nodes/DebugHelper/DebugHelper.svg +++ b/packages/nodes-base/nodes/DebugHelper/DebugHelper.svg @@ -1 +1,5 @@ - \ No newline at end of file + + + + + diff --git a/packages/nodes-base/nodes/Intercom/Intercom.node.ts b/packages/nodes-base/nodes/Intercom/Intercom.node.ts index ba16a6422726a..82d2fcabdafe8 100644 --- a/packages/nodes-base/nodes/Intercom/Intercom.node.ts +++ b/packages/nodes-base/nodes/Intercom/Intercom.node.ts @@ -22,7 +22,7 @@ export class Intercom implements INodeType { displayName: 'Intercom', name: 'intercom', // eslint-disable-next-line n8n-nodes-base/node-class-description-icon-not-svg - icon: 'file:intercom.png', + icon: 'file:intercom.svg', group: ['output'], version: 1, subtitle: '={{$parameter["operation"] + ": " + $parameter["resource"]}}', diff --git a/packages/nodes-base/nodes/Intercom/intercom.png b/packages/nodes-base/nodes/Intercom/intercom.png deleted file mode 100644 index 50225c561191af008b6e9f786415c7d156264c07..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 1539 zcmX|>dpy%?9LI-Mv2;8EXS=RVK-Y$08k8ipj7aw`d0x-+e7~R9`}w?{Kb|xXHzzG9914Lzw44t) zdV%X+#Z*^ORE#nEArK{X4_6-oc$}BW{~wc!azy9?I&uXSwSr~H(a`{?-+aF!BbRY> z87@|irAtxdRUBQ>!qVj!3V@}`(UDTco+d|;SI|@d8zTpWqDs-ANMdxocwv z?`p~%=Iq+%m)t+pRS@0#B)goyxk=B@oXaJ~%&l#<_BDsiFfLxHh~iotx!pe94P`x@ z3fmtq@Pq2S>rh)yKZt-y=un9lG9McBE!KvX8y#=8$P4zQWkL0<9%bfx5~aH zAL(sfzMzz2Ur;|{x5Kk%o#{U#eIb5ECX9;9B$?U4&BPxLR}G7+?O=?!o96j> z+^yQ+JCa{z&zOkZJ~M(l^K9GMQ4Z$A*I5S7{7D*moCVi5-5HPZO)SHV4O;pDP`JGy ze#|B!9zTXJm{;?(nE!-(6#JNIyWb*%S5Rc0F7hbu4U-_G#-gV@Eu%-jzn4fil>i-c*t%STgE>*(hg}34z3Bc^~q7{r<2=E!vjWc~~E$^xGN diff --git a/packages/nodes-base/nodes/Intercom/intercom.svg b/packages/nodes-base/nodes/Intercom/intercom.svg new file mode 100644 index 0000000000000..ac70304597c13 --- /dev/null +++ b/packages/nodes-base/nodes/Intercom/intercom.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/Kitemaker/Kitemaker.node.ts b/packages/nodes-base/nodes/Kitemaker/Kitemaker.node.ts index 0f6bb768b9545..c29dbfd9e9b96 100644 --- a/packages/nodes-base/nodes/Kitemaker/Kitemaker.node.ts +++ b/packages/nodes-base/nodes/Kitemaker/Kitemaker.node.ts @@ -40,7 +40,7 @@ export class Kitemaker implements INodeType { description: INodeTypeDescription = { displayName: 'Kitemaker', name: 'kitemaker', - icon: 'file:kitemaker.svg', + icon: { light: 'file:kitemaker.svg', dark: 'file:kitemaker.dark.svg' }, group: ['input'], version: 1, subtitle: '={{$parameter["resource"] + ": " + $parameter["operation"]}}', diff --git a/packages/nodes-base/nodes/Kitemaker/kitemaker.dark.svg b/packages/nodes-base/nodes/Kitemaker/kitemaker.dark.svg new file mode 100644 index 0000000000000..d8f4392dcec72 --- /dev/null +++ b/packages/nodes-base/nodes/Kitemaker/kitemaker.dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/nodes/Kitemaker/kitemaker.svg b/packages/nodes-base/nodes/Kitemaker/kitemaker.svg index db36157041079..21479787596ea 100644 --- a/packages/nodes-base/nodes/Kitemaker/kitemaker.svg +++ b/packages/nodes-base/nodes/Kitemaker/kitemaker.svg @@ -1 +1,5 @@ - \ No newline at end of file + + + + + diff --git a/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/N8nTrainingCustomerDatastore.node.ts b/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/N8nTrainingCustomerDatastore.node.ts index a5fd20b0e94a1..c7807afcd3beb 100644 --- a/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/N8nTrainingCustomerDatastore.node.ts +++ b/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/N8nTrainingCustomerDatastore.node.ts @@ -52,7 +52,10 @@ export class N8nTrainingCustomerDatastore implements INodeType { description: INodeTypeDescription = { displayName: 'Customer Datastore (n8n training)', name: 'n8nTrainingCustomerDatastore', - icon: 'file:n8nTrainingCustomerDatastore.svg', + icon: { + light: 'file:n8nTrainingCustomerDatastore.svg', + dark: 'file:n8nTrainingCustomerDatastore.dark.svg', + }, group: ['transform'], version: 1, subtitle: '={{$parameter["operation"]}}', diff --git a/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/n8nTrainingCustomerDatastore.dark.svg b/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/n8nTrainingCustomerDatastore.dark.svg new file mode 100644 index 0000000000000..297a88a2e0704 --- /dev/null +++ b/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/n8nTrainingCustomerDatastore.dark.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/n8nTrainingCustomerDatastore.svg b/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/n8nTrainingCustomerDatastore.svg index 3e20ed4539712..bff65776b6c02 100644 --- a/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/n8nTrainingCustomerDatastore.svg +++ b/packages/nodes-base/nodes/N8nTrainingCustomerDatastore/n8nTrainingCustomerDatastore.svg @@ -1 +1,5 @@ - \ No newline at end of file + + + + + diff --git a/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/N8nTrainingCustomerMessenger.node.ts b/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/N8nTrainingCustomerMessenger.node.ts index 975cd570394be..403af6d683745 100644 --- a/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/N8nTrainingCustomerMessenger.node.ts +++ b/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/N8nTrainingCustomerMessenger.node.ts @@ -9,7 +9,10 @@ export class N8nTrainingCustomerMessenger implements INodeType { description: INodeTypeDescription = { displayName: 'Customer Messenger (n8n training)', name: 'n8nTrainingCustomerMessenger', - icon: 'file:n8nTrainingCustomerMessenger.svg', + icon: { + light: 'file:n8nTrainingCustomerMessenger.svg', + dark: 'file:n8nTrainingCustomerMessenger.dark.svg', + }, group: ['transform'], version: 1, description: 'Dummy node used for n8n training', diff --git a/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/n8nTrainingCustomerMessenger.dark.svg b/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/n8nTrainingCustomerMessenger.dark.svg new file mode 100644 index 0000000000000..05f01d14acccd --- /dev/null +++ b/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/n8nTrainingCustomerMessenger.dark.svg @@ -0,0 +1,4 @@ + + + + diff --git a/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/n8nTrainingCustomerMessenger.svg b/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/n8nTrainingCustomerMessenger.svg index 800416c3b54b5..ee3b8accd8cd0 100644 --- a/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/n8nTrainingCustomerMessenger.svg +++ b/packages/nodes-base/nodes/N8nTrainingCustomerMessenger/n8nTrainingCustomerMessenger.svg @@ -1 +1,4 @@ - \ No newline at end of file + + + + From 626a4ebb9a830975ef44005a54b0f19557ac0333 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Mon, 3 Jun 2024 14:27:41 +0200 Subject: [PATCH 14/20] Improved HTTP Request icon for creds-only. --- packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue | 2 +- packages/nodes-base/nodes/HttpRequest/httprequest.dark.svg | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue b/packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue index 3ad907287f53a..7ba2287fe65e7 100644 --- a/packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue +++ b/packages/design-system/src/components/N8nNodeIcon/NodeIcon.vue @@ -83,7 +83,7 @@ const badgeSize = computed((): number => { return 10; case 18: default: - return 8; + return 12; } }); diff --git a/packages/nodes-base/nodes/HttpRequest/httprequest.dark.svg b/packages/nodes-base/nodes/HttpRequest/httprequest.dark.svg index 3c3deba21d1cf..41d0b3204c1c7 100644 --- a/packages/nodes-base/nodes/HttpRequest/httprequest.dark.svg +++ b/packages/nodes-base/nodes/HttpRequest/httprequest.dark.svg @@ -1,3 +1,3 @@ - + From 906cd38cc6e8de58cbad525da14123f4d04b0eb7 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Mon, 3 Jun 2024 14:28:07 +0200 Subject: [PATCH 15/20] Minor tweak to AI nodes background saturation. --- packages/design-system/src/css/_tokens.dark.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/design-system/src/css/_tokens.dark.scss b/packages/design-system/src/css/_tokens.dark.scss index 094c3fe03d003..d842b62f3afc0 100644 --- a/packages/design-system/src/css/_tokens.dark.scss +++ b/packages/design-system/src/css/_tokens.dark.scss @@ -239,7 +239,7 @@ // AI --node-type-background-l: 20%; - --node-type-supplemental-color-s: 15%; + --node-type-supplemental-color-s: 13%; // Various --color-info-tint-1: var(--prim-gray-420); From c7091ee51b8cbb9353c1869e982058b102e75586 Mon Sep 17 00:00:00 2001 From: Elias Meire Date: Tue, 4 Jun 2024 14:46:15 +0200 Subject: [PATCH 16/20] Fix icon color in node creator sidebar --- packages/editor-ui/src/Interface.ts | 1 + .../Node/NodeCreator/composables/useActionsGeneration.ts | 2 ++ 2 files changed, 3 insertions(+) diff --git a/packages/editor-ui/src/Interface.ts b/packages/editor-ui/src/Interface.ts index f3d536cc4fc7c..b08d3ab4a5622 100644 --- a/packages/editor-ui/src/Interface.ts +++ b/packages/editor-ui/src/Interface.ts @@ -930,6 +930,7 @@ export type SimplifiedNodeType = Pick< | 'group' | 'icon' | 'iconUrl' + | 'iconColor' | 'badgeIconUrl' | 'codex' | 'defaults' diff --git a/packages/editor-ui/src/components/Node/NodeCreator/composables/useActionsGeneration.ts b/packages/editor-ui/src/components/Node/NodeCreator/composables/useActionsGeneration.ts index 1c5cf669528a2..7385100141e85 100644 --- a/packages/editor-ui/src/components/Node/NodeCreator/composables/useActionsGeneration.ts +++ b/packages/editor-ui/src/components/Node/NodeCreator/composables/useActionsGeneration.ts @@ -254,6 +254,7 @@ export function useActionsGenerator() { group, icon, iconUrl, + iconColor, badgeIconUrl, outputs, codex, @@ -266,6 +267,7 @@ export function useActionsGenerator() { name, group, icon, + iconColor, iconUrl, badgeIconUrl, outputs, From b97aac93dc8c59f6483a0dacb46f59a7313e100f Mon Sep 17 00:00:00 2001 From: Elias Meire Date: Tue, 4 Jun 2024 14:54:26 +0200 Subject: [PATCH 17/20] Add dark mode icon support to credentials --- .../src/components/CredentialIcon.vue | 20 +++++++++++++------ .../Auth0ManagementApi.credentials.ts | 3 +-- .../nodes-base/credentials/Aws.credentials.ts | 3 +-- .../credentials/CarbonBlackApi.credentials.ts | 4 ++-- .../credentials/CiscoMerakiApi.credentials.ts | 4 ++-- .../CiscoSecureEndpointApi.credentials.ts | 3 +-- .../CiscoUmbrellaApi.credentials.ts | 3 +-- .../CiscoWebexOAuth2Api.credentials.ts | 4 ++-- .../CrowdStrikeOAuth2Api.credentials.ts | 3 +-- .../credentials/ImpervaWafApi.credentials.ts | 4 ++-- .../credentials/OktaApi.credentials.ts | 3 +-- .../credentials/QRadarApi.credentials.ts | 4 ++-- .../RecordedFutureApi.credentials.ts | 7 +++++-- packages/workflow/src/Interfaces.ts | 4 ++-- 14 files changed, 37 insertions(+), 32 deletions(-) diff --git a/packages/editor-ui/src/components/CredentialIcon.vue b/packages/editor-ui/src/components/CredentialIcon.vue index 43cdcd32fbafc..038c5c1f404c1 100644 --- a/packages/editor-ui/src/components/CredentialIcon.vue +++ b/packages/editor-ui/src/components/CredentialIcon.vue @@ -15,6 +15,8 @@ import { useRootStore } from '@/stores/n8nRoot.store'; import { useNodeTypesStore } from '@/stores/nodeTypes.store'; import type { ICredentialType, INodeTypeDescription } from 'n8n-workflow'; import NodeIcon from '@/components/NodeIcon.vue'; +import { getThemedValue } from '@/utils/nodeTypesUtils'; +import { useUIStore } from '@/stores/ui.store'; export default defineComponent({ components: { @@ -26,22 +28,28 @@ export default defineComponent({ }, }, computed: { - ...mapStores(useCredentialsStore, useNodeTypesStore, useRootStore), + ...mapStores(useCredentialsStore, useNodeTypesStore, useRootStore, useUIStore), credentialWithIcon(): ICredentialType | null { return this.credentialTypeName ? this.getCredentialWithIcon(this.credentialTypeName) : null; }, filePath(): string | null { - const iconUrl = this.credentialWithIcon?.iconUrl; - if (!iconUrl) { + const themeIconUrl = getThemedValue( + this.credentialWithIcon?.iconUrl, + this.uiStore.appliedTheme, + ); + + if (!themeIconUrl) { return null; } - return this.rootStore.getBaseUrl + iconUrl; + + return this.rootStore.getBaseUrl + themeIconUrl; }, relevantNode(): INodeTypeDescription | null { - if (this.credentialWithIcon?.icon?.startsWith('node:')) { - const nodeType = this.credentialWithIcon.icon.replace('node:', ''); + const icon = this.credentialWithIcon?.icon; + if (typeof icon === 'string' && icon.startsWith('node:')) { + const nodeType = icon.replace('node:', ''); return this.nodeTypesStore.getNodeType(nodeType); } if (!this.credentialTypeName) { diff --git a/packages/nodes-base/credentials/Auth0ManagementApi.credentials.ts b/packages/nodes-base/credentials/Auth0ManagementApi.credentials.ts index 8638a14774787..d4d2865220e84 100644 --- a/packages/nodes-base/credentials/Auth0ManagementApi.credentials.ts +++ b/packages/nodes-base/credentials/Auth0ManagementApi.credentials.ts @@ -5,7 +5,6 @@ import type { ICredentialType, IHttpRequestHelper, INodeProperties, - Icon, } from 'n8n-workflow'; export class Auth0ManagementApi implements ICredentialType { @@ -15,7 +14,7 @@ export class Auth0ManagementApi implements ICredentialType { documentationUrl = 'auth0management'; - icon: Icon = 'file:icons/Auth0.svg'; + icon = { light: 'file:icons/Auth0.svg', dark: 'file:icons/Auth0.dark.svg' } as const; httpRequestNode = { name: 'Auth0', diff --git a/packages/nodes-base/credentials/Aws.credentials.ts b/packages/nodes-base/credentials/Aws.credentials.ts index 29711942edc2d..e6ec85eec1306 100644 --- a/packages/nodes-base/credentials/Aws.credentials.ts +++ b/packages/nodes-base/credentials/Aws.credentials.ts @@ -9,7 +9,6 @@ import type { IHttpRequestOptions, INodeProperties, IRequestOptions, - Icon, } from 'n8n-workflow'; import { isObjectEmpty } from 'n8n-workflow'; @@ -135,7 +134,7 @@ export class Aws implements ICredentialType { documentationUrl = 'aws'; - icon: Icon = 'file:icons/AWS.svg'; + icon = { light: 'file:icons/AWS.svg', dark: 'file:icons/AWS.dark.svg' } as const; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/CarbonBlackApi.credentials.ts b/packages/nodes-base/credentials/CarbonBlackApi.credentials.ts index 3f434b8b7de2a..70119d362e142 100644 --- a/packages/nodes-base/credentials/CarbonBlackApi.credentials.ts +++ b/packages/nodes-base/credentials/CarbonBlackApi.credentials.ts @@ -1,11 +1,11 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; export class CarbonBlackApi implements ICredentialType { name = 'carbonBlackApi'; displayName = 'Carbon Black API'; - icon: Icon = 'file:icons/vmware.svg'; + icon = { light: 'file:icons/vmware.svg', dark: 'file:icons/vmware.dark.svg' } as const; documentationUrl = 'carbonblack'; diff --git a/packages/nodes-base/credentials/CiscoMerakiApi.credentials.ts b/packages/nodes-base/credentials/CiscoMerakiApi.credentials.ts index 38bcd4a5ac60c..24346845badf3 100644 --- a/packages/nodes-base/credentials/CiscoMerakiApi.credentials.ts +++ b/packages/nodes-base/credentials/CiscoMerakiApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; export class CiscoMerakiApi implements ICredentialType { name = 'ciscoMerakiApi'; @@ -7,7 +7,7 @@ export class CiscoMerakiApi implements ICredentialType { documentationUrl = 'ciscomeraki'; - icon: Icon = 'file:icons/Cisco.svg'; + icon = { light: 'file:icons/Cisco.svg', dark: 'file:icons/Cisco.dark.svg' } as const; httpRequestNode = { name: 'Cisco Meraki', diff --git a/packages/nodes-base/credentials/CiscoSecureEndpointApi.credentials.ts b/packages/nodes-base/credentials/CiscoSecureEndpointApi.credentials.ts index a1f447132907c..7ffac617797a2 100644 --- a/packages/nodes-base/credentials/CiscoSecureEndpointApi.credentials.ts +++ b/packages/nodes-base/credentials/CiscoSecureEndpointApi.credentials.ts @@ -4,7 +4,6 @@ import type { ICredentialType, IHttpRequestOptions, INodeProperties, - Icon, } from 'n8n-workflow'; import axios from 'axios'; @@ -16,7 +15,7 @@ export class CiscoSecureEndpointApi implements ICredentialType { documentationUrl = 'ciscosecureendpoint'; - icon: Icon = 'file:icons/Cisco.svg'; + icon = { light: 'file:icons/Cisco.svg', dark: 'file:icons/Cisco.dark.svg' } as const; httpRequestNode = { name: 'Cisco Secure Endpoint', diff --git a/packages/nodes-base/credentials/CiscoUmbrellaApi.credentials.ts b/packages/nodes-base/credentials/CiscoUmbrellaApi.credentials.ts index 2536da3282ccd..f2bca5986039f 100644 --- a/packages/nodes-base/credentials/CiscoUmbrellaApi.credentials.ts +++ b/packages/nodes-base/credentials/CiscoUmbrellaApi.credentials.ts @@ -5,7 +5,6 @@ import type { ICredentialType, IHttpRequestHelper, INodeProperties, - Icon, } from 'n8n-workflow'; export class CiscoUmbrellaApi implements ICredentialType { @@ -15,7 +14,7 @@ export class CiscoUmbrellaApi implements ICredentialType { documentationUrl = 'ciscoumbrella'; - icon: Icon = 'file:icons/Cisco.svg'; + icon = { light: 'file:icons/Cisco.svg', dark: 'file:icons/Cisco.dark.svg' } as const; httpRequestNode = { name: 'Cisco Umbrella', diff --git a/packages/nodes-base/credentials/CiscoWebexOAuth2Api.credentials.ts b/packages/nodes-base/credentials/CiscoWebexOAuth2Api.credentials.ts index c2edc05e2f170..9de1ff62f8fcf 100644 --- a/packages/nodes-base/credentials/CiscoWebexOAuth2Api.credentials.ts +++ b/packages/nodes-base/credentials/CiscoWebexOAuth2Api.credentials.ts @@ -1,4 +1,4 @@ -import type { ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; +import type { ICredentialType, INodeProperties } from 'n8n-workflow'; export class CiscoWebexOAuth2Api implements ICredentialType { name = 'ciscoWebexOAuth2Api'; @@ -9,7 +9,7 @@ export class CiscoWebexOAuth2Api implements ICredentialType { documentationUrl = 'ciscowebex'; - icon: Icon = 'file:icons/Cisco.svg'; + icon = { light: 'file:icons/Cisco.svg', dark: 'file:icons/Cisco.dark.svg' } as const; properties: INodeProperties[] = [ { diff --git a/packages/nodes-base/credentials/CrowdStrikeOAuth2Api.credentials.ts b/packages/nodes-base/credentials/CrowdStrikeOAuth2Api.credentials.ts index c3b407f11df13..de69b0d5db1e5 100644 --- a/packages/nodes-base/credentials/CrowdStrikeOAuth2Api.credentials.ts +++ b/packages/nodes-base/credentials/CrowdStrikeOAuth2Api.credentials.ts @@ -5,7 +5,6 @@ import type { ICredentialType, IHttpRequestHelper, INodeProperties, - Icon, } from 'n8n-workflow'; export class CrowdStrikeOAuth2Api implements ICredentialType { @@ -15,7 +14,7 @@ export class CrowdStrikeOAuth2Api implements ICredentialType { documentationUrl = 'crowdstrike'; - icon: Icon = 'file:icons/CrowdStrike.svg'; + icon = { light: 'file:icons/CrowdStrike.svg', dark: 'file:icons/CrowdStrike.dark.svg' } as const; httpRequestNode = { name: 'CrowdStrike', diff --git a/packages/nodes-base/credentials/ImpervaWafApi.credentials.ts b/packages/nodes-base/credentials/ImpervaWafApi.credentials.ts index 3e72a14773649..b37b3e7d34349 100644 --- a/packages/nodes-base/credentials/ImpervaWafApi.credentials.ts +++ b/packages/nodes-base/credentials/ImpervaWafApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; export class ImpervaWafApi implements ICredentialType { name = 'impervaWafApi'; @@ -7,7 +7,7 @@ export class ImpervaWafApi implements ICredentialType { documentationUrl = 'impervawaf'; - icon: Icon = 'file:icons/Imperva.svg'; + icon = { light: 'file:icons/Imperva.svg', dark: 'file:icons/Imperva.dark.svg' } as const; httpRequestNode = { name: 'Imperva WAF', diff --git a/packages/nodes-base/credentials/OktaApi.credentials.ts b/packages/nodes-base/credentials/OktaApi.credentials.ts index 3be4e4c0b519b..c5b925c0718d8 100644 --- a/packages/nodes-base/credentials/OktaApi.credentials.ts +++ b/packages/nodes-base/credentials/OktaApi.credentials.ts @@ -3,7 +3,6 @@ import type { ICredentialTestRequest, ICredentialType, INodeProperties, - Icon, } from 'n8n-workflow'; export class OktaApi implements ICredentialType { @@ -13,7 +12,7 @@ export class OktaApi implements ICredentialType { documentationUrl = 'okta'; - icon: Icon = 'file:icons/Okta.svg'; + icon = { light: 'file:icons/Okta.svg', dark: 'file:icons/Okta.dark.svg' } as const; httpRequestNode = { name: 'Okta', diff --git a/packages/nodes-base/credentials/QRadarApi.credentials.ts b/packages/nodes-base/credentials/QRadarApi.credentials.ts index 62e179b9f0c54..6eb8c3a46ed97 100644 --- a/packages/nodes-base/credentials/QRadarApi.credentials.ts +++ b/packages/nodes-base/credentials/QRadarApi.credentials.ts @@ -1,11 +1,11 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; export class QRadarApi implements ICredentialType { name = 'qRadarApi'; displayName = 'QRadar API'; - icon: Icon = 'file:icons/IBM.svg'; + icon = { light: 'file:icons/IBM.svg', dark: 'file:icons/IBM.dark.svg' } as const; documentationUrl = 'qradar'; diff --git a/packages/nodes-base/credentials/RecordedFutureApi.credentials.ts b/packages/nodes-base/credentials/RecordedFutureApi.credentials.ts index 5b10efb03e040..f07f7ba878344 100644 --- a/packages/nodes-base/credentials/RecordedFutureApi.credentials.ts +++ b/packages/nodes-base/credentials/RecordedFutureApi.credentials.ts @@ -1,4 +1,4 @@ -import type { IAuthenticateGeneric, ICredentialType, INodeProperties, Icon } from 'n8n-workflow'; +import type { IAuthenticateGeneric, ICredentialType, INodeProperties } from 'n8n-workflow'; export class RecordedFutureApi implements ICredentialType { name = 'recordedFutureApi'; @@ -7,7 +7,10 @@ export class RecordedFutureApi implements ICredentialType { documentationUrl = 'recordedfuture'; - icon: Icon = 'file:icons/RecordedFuture.svg'; + icon = { + light: 'file:icons/RecordedFuture.svg', + dark: 'file:icons/RecordedFuture.dark.svg', + } as const; httpRequestNode = { name: 'Recorded Future', diff --git a/packages/workflow/src/Interfaces.ts b/packages/workflow/src/Interfaces.ts index b9a715abb1b8c..ac7e4b7748835 100644 --- a/packages/workflow/src/Interfaces.ts +++ b/packages/workflow/src/Interfaces.ts @@ -307,8 +307,8 @@ type ICredentialHttpRequestNode = { export interface ICredentialType { name: string; displayName: string; - icon?: Icon; - iconUrl?: string; + icon?: Themed; + iconUrl?: Themed; extends?: string[]; properties: INodeProperties[]; documentationUrl?: string; From 7a65c399498c32c898bc01bf097e885ea1919b30 Mon Sep 17 00:00:00 2001 From: Elias Meire Date: Tue, 4 Jun 2024 15:48:33 +0200 Subject: [PATCH 18/20] Fix AI Node colors --- .../design-system/src/css/_tokens.dark.scss | 165 ++++++++++++++++++ packages/design-system/src/css/_tokens.scss | 160 +++++++++++++++++ .../components/Node/NodeCreator/viewsData.ts | 8 +- .../editor-ui/src/components/NodeIcon.vue | 4 +- packages/editor-ui/src/n8n-theme.scss | 161 ----------------- 5 files changed, 328 insertions(+), 170 deletions(-) diff --git a/packages/design-system/src/css/_tokens.dark.scss b/packages/design-system/src/css/_tokens.dark.scss index d842b62f3afc0..9ff52592eafb9 100644 --- a/packages/design-system/src/css/_tokens.dark.scss +++ b/packages/design-system/src/css/_tokens.dark.scss @@ -239,7 +239,172 @@ // AI --node-type-background-l: 20%; + --node-type-supplemental-label-color-h: 235; + --node-type-supplemental-label-color-s: 28%; + --node-type-supplemental-label-color-l: 40%; + --node-type-supplemental-color-h: 235; --node-type-supplemental-color-s: 13%; + --node-type-supplemental-color-l: 60%; + --node-type-supplemental-label-color: hsl( + var(--node-type-supplemental-label-color-h), + var(--node-type-supplemental-label-color-s), + var(--node-type-supplemental-label-color-l) + ); + --node-type-supplemental-icon: var(--color-foreground-dark); + --node-type-supplemental-color: hsl( + var(--node-type-supplemental-color-h), + var(--node-type-supplemental-color-s), + var(--node-type-supplemental-color-l) + ); + --node-type-supplemental-background: hsl( + var(--node-type-supplemental-color-h), + var(--node-type-supplemental-color-s), + var(--node-type-background-l) + ); + --node-type-supplemental-connector-color: var(--color-foreground-dark); + --node-type-ai_chain-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_chain-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_chain-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_chain-color: hsl( + var(--node-type-ai_chain-color-h), + var(--node-type-ai_chain-color-s), + var(--node-type-ai_chain-color-l) + ); + --node-type-chain-background: hsl( + var(--node-type-ai_chain-color-h), + var(--node-type-ai_chain-color-s), + var(--node-type-background-l) + ); + --node-type-ai_document-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_document-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_document-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_document-color: hsl( + var(--node-type-ai_document-color-h), + var(--node-type-ai_document-color-s), + var(--node-type-ai_document-color-l) + ); + --node-type-ai_document-background: hsl( + var(--node-type-ai_document-color-h), + var(--node-type-ai_document-color-s), + var(--node-type-background-l) + ); + --node-type-ai_embedding-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_embedding-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_embedding-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_embedding-color: hsl( + var(--node-type-ai_embedding-color-h), + var(--node-type-ai_embedding-color-s), + var(--node-type-ai_embedding-color-l) + ); + --node-type-ai_embedding-background: hsl( + var(--node-type-ai_embedding-color-h), + var(--node-type-ai_embedding-color-s), + var(--node-type-background-l) + ); + --node-type-ai_languageModel-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_languageModel-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_languageModel-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_languageModel-color: hsl( + var(--node-type-ai_languageModel-color-h), + var(--node-type-ai_languageModel-color-s), + var(--node-type-ai_languageModel-color-l) + ); + --node-type-ai_languageModel-background: hsl( + var(--node-type-ai_languageModel-color-h), + var(--node-type-ai_languageModel-color-s), + var(--node-type-background-l) + ); + --node-type-ai_memory-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_memory-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_memory-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_memory-color: hsl( + var(--node-type-ai_memory-color-h), + var(--node-type-ai_memory-color-s), + var(--node-type-ai_memory-color-l) + ); + --node-type-ai_memory-background: hsl( + var(--node-type-ai_memory-color-h), + var(--node-type-ai_memory-color-s), + var(--node-type-background-l) + ); + --node-type-ai_outputParser-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_outputParser-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_outputParser-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_outputParser-color: hsl( + var(--node-type-ai_outputParser-color-h), + var(--node-type-ai_outputParser-color-s), + var(--node-type-ai_outputParser-color-l) + ); + --node-type-ai_outputParser-background: hsl( + var(--node-type-ai_outputParser-color-h), + var(--node-type-ai_outputParser-color-s), + var(--node-type-background-l) + ); + --node-type-ai_tool-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_tool-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_tool-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_tool-color: hsl( + var(--node-type-ai_tool-color-h), + var(--node-type-ai_tool-color-s), + var(--node-type-ai_tool-color-l) + ); + --node-type-ai_tool-background: hsl( + var(--node-type-ai_tool-color-h), + var(--node-type-ai_tool-color-s), + var(--node-type-background-l) + ); + --node-type-ai_retriever-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_retriever-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_retriever-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_retriever-color: hsl( + var(--node-type-ai_retriever-color-h), + var(--node-type-ai_retriever-color-s), + var(--node-type-ai_retriever-color-l) + ); + --node-type-ai_retriever-background: hsl( + var(--node-type-ai_retriever-color-h), + var(--node-type-ai_retriever-color-s), + var(--node-type-background-l) + ); + --node-type-ai_textSplitter-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_textSplitter-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_textSplitter-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_textSplitter-color: hsl( + var(--node-type-ai_textSplitter-color-h), + var(--node-type-ai_textSplitter-color-s), + var(--node-type-ai_textSplitter-color-l) + ); + --node-type-ai_textSplitter-background: hsl( + var(--node-type-ai_textSplitter-color-h), + var(--node-type-ai_textSplitter-color-s), + var(--node-type-background-l) + ); + --node-type-ai_vectorRetriever-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_vectorRetriever-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_vectorRetriever-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_vectorRetriever-color: hsl( + var(--node-type-ai_vectorRetriever-color-h), + var(--node-type-ai_vectorRetriever-color-s), + var(--node-type-ai_vectorRetriever-color-l) + ); + --node-type-ai_vectorRetriever-background: hsl( + var(--node-type-ai_vectorRetriever-color-h), + var(--node-type-ai_vectorRetriever-color-s), + var(--node-type-background-l) + ); + --node-type-ai_vectorStore-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_vectorStore-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_vectorStore-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_vectorStore-color: hsl( + var(--node-type-ai_vectorStore-color-h), + var(--node-type-ai_vectorStore-color-s), + var(--node-type-ai_vectorStore-color-l) + ); + --node-type-ai_vectorStore-background: hsl( + var(--node-type-ai_vectorStore-color-h), + var(--node-type-ai_vectorStore-color-s), + var(--node-type-background-l) + ); // Various --color-info-tint-1: var(--prim-gray-420); diff --git a/packages/design-system/src/css/_tokens.scss b/packages/design-system/src/css/_tokens.scss index ffa9a5eb99752..f14f3f29cd297 100644 --- a/packages/design-system/src/css/_tokens.scss +++ b/packages/design-system/src/css/_tokens.scss @@ -306,6 +306,166 @@ --node-type-supplemental-color-h: 235; --node-type-supplemental-color-s: 28%; --node-type-supplemental-color-l: 60%; + --node-type-supplemental-label-color: hsl( + var(--node-type-supplemental-label-color-h), + var(--node-type-supplemental-label-color-s), + var(--node-type-supplemental-label-color-l) + ); + --node-type-supplemental-icon: var(--color-foreground-dark); + --node-type-supplemental-color: hsl( + var(--node-type-supplemental-color-h), + var(--node-type-supplemental-color-s), + var(--node-type-supplemental-color-l) + ); + --node-type-supplemental-background: hsl( + var(--node-type-supplemental-color-h), + var(--node-type-supplemental-color-s), + var(--node-type-background-l) + ); + --node-type-supplemental-connector-color: var(--color-foreground-dark); + --node-type-ai_chain-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_chain-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_chain-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_chain-color: hsl( + var(--node-type-ai_chain-color-h), + var(--node-type-ai_chain-color-s), + var(--node-type-ai_chain-color-l) + ); + --node-type-chain-background: hsl( + var(--node-type-ai_chain-color-h), + var(--node-type-ai_chain-color-s), + var(--node-type-background-l) + ); + --node-type-ai_document-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_document-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_document-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_document-color: hsl( + var(--node-type-ai_document-color-h), + var(--node-type-ai_document-color-s), + var(--node-type-ai_document-color-l) + ); + --node-type-ai_document-background: hsl( + var(--node-type-ai_document-color-h), + var(--node-type-ai_document-color-s), + var(--node-type-background-l) + ); + --node-type-ai_embedding-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_embedding-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_embedding-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_embedding-color: hsl( + var(--node-type-ai_embedding-color-h), + var(--node-type-ai_embedding-color-s), + var(--node-type-ai_embedding-color-l) + ); + --node-type-ai_embedding-background: hsl( + var(--node-type-ai_embedding-color-h), + var(--node-type-ai_embedding-color-s), + var(--node-type-background-l) + ); + --node-type-ai_languageModel-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_languageModel-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_languageModel-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_languageModel-color: hsl( + var(--node-type-ai_languageModel-color-h), + var(--node-type-ai_languageModel-color-s), + var(--node-type-ai_languageModel-color-l) + ); + --node-type-ai_languageModel-background: hsl( + var(--node-type-ai_languageModel-color-h), + var(--node-type-ai_languageModel-color-s), + var(--node-type-background-l) + ); + --node-type-ai_memory-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_memory-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_memory-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_memory-color: hsl( + var(--node-type-ai_memory-color-h), + var(--node-type-ai_memory-color-s), + var(--node-type-ai_memory-color-l) + ); + --node-type-ai_memory-background: hsl( + var(--node-type-ai_memory-color-h), + var(--node-type-ai_memory-color-s), + var(--node-type-background-l) + ); + --node-type-ai_outputParser-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_outputParser-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_outputParser-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_outputParser-color: hsl( + var(--node-type-ai_outputParser-color-h), + var(--node-type-ai_outputParser-color-s), + var(--node-type-ai_outputParser-color-l) + ); + --node-type-ai_outputParser-background: hsl( + var(--node-type-ai_outputParser-color-h), + var(--node-type-ai_outputParser-color-s), + var(--node-type-background-l) + ); + --node-type-ai_tool-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_tool-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_tool-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_tool-color: hsl( + var(--node-type-ai_tool-color-h), + var(--node-type-ai_tool-color-s), + var(--node-type-ai_tool-color-l) + ); + --node-type-ai_tool-background: hsl( + var(--node-type-ai_tool-color-h), + var(--node-type-ai_tool-color-s), + var(--node-type-background-l) + ); + --node-type-ai_retriever-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_retriever-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_retriever-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_retriever-color: hsl( + var(--node-type-ai_retriever-color-h), + var(--node-type-ai_retriever-color-s), + var(--node-type-ai_retriever-color-l) + ); + --node-type-ai_retriever-background: hsl( + var(--node-type-ai_retriever-color-h), + var(--node-type-ai_retriever-color-s), + var(--node-type-background-l) + ); + --node-type-ai_textSplitter-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_textSplitter-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_textSplitter-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_textSplitter-color: hsl( + var(--node-type-ai_textSplitter-color-h), + var(--node-type-ai_textSplitter-color-s), + var(--node-type-ai_textSplitter-color-l) + ); + --node-type-ai_textSplitter-background: hsl( + var(--node-type-ai_textSplitter-color-h), + var(--node-type-ai_textSplitter-color-s), + var(--node-type-background-l) + ); + --node-type-ai_vectorRetriever-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_vectorRetriever-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_vectorRetriever-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_vectorRetriever-color: hsl( + var(--node-type-ai_vectorRetriever-color-h), + var(--node-type-ai_vectorRetriever-color-s), + var(--node-type-ai_vectorRetriever-color-l) + ); + --node-type-ai_vectorRetriever-background: hsl( + var(--node-type-ai_vectorRetriever-color-h), + var(--node-type-ai_vectorRetriever-color-s), + var(--node-type-background-l) + ); + --node-type-ai_vectorStore-color-h: var(--node-type-supplemental-color-h); + --node-type-ai_vectorStore-color-s: var(--node-type-supplemental-color-s); + --node-type-ai_vectorStore-color-l: var(--node-type-supplemental-color-l); + --node-type-ai_vectorStore-color: hsl( + var(--node-type-ai_vectorStore-color-h), + var(--node-type-ai_vectorStore-color-s), + var(--node-type-ai_vectorStore-color-l) + ); + --node-type-ai_vectorStore-background: hsl( + var(--node-type-ai_vectorStore-color-h), + var(--node-type-ai_vectorStore-color-s), + var(--node-type-background-l) + ); // Various --color-avatar-accent-1: var(--prim-gray-120); diff --git a/packages/editor-ui/src/components/Node/NodeCreator/viewsData.ts b/packages/editor-ui/src/components/Node/NodeCreator/viewsData.ts index d97a7329b8746..d0f3d7fd15280 100644 --- a/packages/editor-ui/src/components/Node/NodeCreator/viewsData.ts +++ b/packages/editor-ui/src/components/Node/NodeCreator/viewsData.ts @@ -123,13 +123,7 @@ function getAiNodesBySubcategory(nodes: INodeTypeDescription[], subcategory: str description: node.description, // eslint-disable-next-line @typescript-eslint/no-non-null-assertion icon: node.icon!, - iconData: node.name.toLowerCase().includes('openai') - ? { - type: 'file', - icon: 'openai', - fileBuffer: '/static/open-ai.svg', - } - : undefined, + iconUrl: node.iconUrl, }, })) .sort((a, b) => a.properties.displayName.localeCompare(b.properties.displayName)); diff --git a/packages/editor-ui/src/components/NodeIcon.vue b/packages/editor-ui/src/components/NodeIcon.vue index 179ccb1db5330..0c46ae6db9727 100644 --- a/packages/editor-ui/src/components/NodeIcon.vue +++ b/packages/editor-ui/src/components/NodeIcon.vue @@ -63,7 +63,7 @@ const iconType = computed(() => { if (nodeType) { if (nodeType.iconUrl) return 'file'; - if ('iconData' in nodeType) { + if ('iconData' in nodeType && nodeType.iconData) { return nodeType.iconData.type; } if (nodeType.icon) { @@ -90,7 +90,7 @@ const iconSource = computed(() => { if (nodeType) { // If node type has icon data, use it - if ('iconData' in nodeType) { + if ('iconData' in nodeType && nodeType.iconData) { return { icon: nodeType.iconData.icon, fileBuffer: nodeType.iconData.fileBuffer, diff --git a/packages/editor-ui/src/n8n-theme.scss b/packages/editor-ui/src/n8n-theme.scss index e67a07bd2a32c..802f8f4bc2b2e 100644 --- a/packages/editor-ui/src/n8n-theme.scss +++ b/packages/editor-ui/src/n8n-theme.scss @@ -2,167 +2,6 @@ @import 'styles'; :root { - --node-type-supplemental-label-color: hsl( - var(--node-type-supplemental-label-color-h), - var(--node-type-supplemental-label-color-s), - var(--node-type-supplemental-label-color-l) - ); - --node-type-supplemental-icon: var(--color-foreground-dark); - --node-type-supplemental-color: hsl( - var(--node-type-supplemental-color-h), - var(--node-type-supplemental-color-s), - var(--node-type-supplemental-color-l) - ); - --node-type-supplemental-background: hsl( - var(--node-type-supplemental-color-h), - var(--node-type-supplemental-color-s), - var(--node-type-background-l) - ); - --node-type-supplemental-connector-color: var(--color-foreground-dark); - --node-type-ai_chain-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_chain-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_chain-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_chain-color: hsl( - var(--node-type-ai_chain-color-h), - var(--node-type-ai_chain-color-s), - var(--node-type-ai_chain-color-l) - ); - --node-type-chain-background: hsl( - var(--node-type-ai_chain-color-h), - var(--node-type-ai_chain-color-s), - var(--node-type-background-l) - ); - --node-type-ai_document-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_document-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_document-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_document-color: hsl( - var(--node-type-ai_document-color-h), - var(--node-type-ai_document-color-s), - var(--node-type-ai_document-color-l) - ); - --node-type-ai_document-background: hsl( - var(--node-type-ai_document-color-h), - var(--node-type-ai_document-color-s), - var(--node-type-background-l) - ); - --node-type-ai_embedding-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_embedding-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_embedding-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_embedding-color: hsl( - var(--node-type-ai_embedding-color-h), - var(--node-type-ai_embedding-color-s), - var(--node-type-ai_embedding-color-l) - ); - --node-type-ai_embedding-background: hsl( - var(--node-type-ai_embedding-color-h), - var(--node-type-ai_embedding-color-s), - var(--node-type-background-l) - ); - --node-type-ai_languageModel-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_languageModel-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_languageModel-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_languageModel-color: hsl( - var(--node-type-ai_languageModel-color-h), - var(--node-type-ai_languageModel-color-s), - var(--node-type-ai_languageModel-color-l) - ); - --node-type-ai_languageModel-background: hsl( - var(--node-type-ai_languageModel-color-h), - var(--node-type-ai_languageModel-color-s), - var(--node-type-background-l) - ); - --node-type-ai_memory-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_memory-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_memory-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_memory-color: hsl( - var(--node-type-ai_memory-color-h), - var(--node-type-ai_memory-color-s), - var(--node-type-ai_memory-color-l) - ); - --node-type-ai_memory-background: hsl( - var(--node-type-ai_memory-color-h), - var(--node-type-ai_memory-color-s), - var(--node-type-background-l) - ); - --node-type-ai_outputParser-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_outputParser-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_outputParser-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_outputParser-color: hsl( - var(--node-type-ai_outputParser-color-h), - var(--node-type-ai_outputParser-color-s), - var(--node-type-ai_outputParser-color-l) - ); - --node-type-ai_outputParser-background: hsl( - var(--node-type-ai_outputParser-color-h), - var(--node-type-ai_outputParser-color-s), - var(--node-type-background-l) - ); - --node-type-ai_tool-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_tool-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_tool-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_tool-color: hsl( - var(--node-type-ai_tool-color-h), - var(--node-type-ai_tool-color-s), - var(--node-type-ai_tool-color-l) - ); - --node-type-ai_tool-background: hsl( - var(--node-type-ai_tool-color-h), - var(--node-type-ai_tool-color-s), - var(--node-type-background-l) - ); - --node-type-ai_retriever-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_retriever-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_retriever-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_retriever-color: hsl( - var(--node-type-ai_retriever-color-h), - var(--node-type-ai_retriever-color-s), - var(--node-type-ai_retriever-color-l) - ); - --node-type-ai_retriever-background: hsl( - var(--node-type-ai_retriever-color-h), - var(--node-type-ai_retriever-color-s), - var(--node-type-background-l) - ); - --node-type-ai_textSplitter-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_textSplitter-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_textSplitter-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_textSplitter-color: hsl( - var(--node-type-ai_textSplitter-color-h), - var(--node-type-ai_textSplitter-color-s), - var(--node-type-ai_textSplitter-color-l) - ); - --node-type-ai_textSplitter-background: hsl( - var(--node-type-ai_textSplitter-color-h), - var(--node-type-ai_textSplitter-color-s), - var(--node-type-background-l) - ); - --node-type-ai_vectorRetriever-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_vectorRetriever-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_vectorRetriever-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_vectorRetriever-color: hsl( - var(--node-type-ai_vectorRetriever-color-h), - var(--node-type-ai_vectorRetriever-color-s), - var(--node-type-ai_vectorRetriever-color-l) - ); - --node-type-ai_vectorRetriever-background: hsl( - var(--node-type-ai_vectorRetriever-color-h), - var(--node-type-ai_vectorRetriever-color-s), - var(--node-type-background-l) - ); - --node-type-ai_vectorStore-color-h: var(--node-type-supplemental-color-h); - --node-type-ai_vectorStore-color-s: var(--node-type-supplemental-color-s); - --node-type-ai_vectorStore-color-l: var(--node-type-supplemental-color-l); - --node-type-ai_vectorStore-color: hsl( - var(--node-type-ai_vectorStore-color-h), - var(--node-type-ai_vectorStore-color-s), - var(--node-type-ai_vectorStore-color-l) - ); - --node-type-ai_vectorStore-background: hsl( - var(--node-type-ai_vectorStore-color-h), - var(--node-type-ai_vectorStore-color-s), - var(--node-type-background-l) - ); - // Using native css variable enables us to use this value in JS --header-height: 65; --chat-width: 350; From 57b769acd21e1edabb227818f76428487d1a7218 Mon Sep 17 00:00:00 2001 From: Elias Meire Date: Tue, 4 Jun 2024 17:00:48 +0200 Subject: [PATCH 19/20] Fix color bug --- packages/editor-ui/src/components/NodeIcon.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/editor-ui/src/components/NodeIcon.vue b/packages/editor-ui/src/components/NodeIcon.vue index 0c46ae6db9727..47dba118c2bd4 100644 --- a/packages/editor-ui/src/components/NodeIcon.vue +++ b/packages/editor-ui/src/components/NodeIcon.vue @@ -78,7 +78,7 @@ const iconType = computed(() => { const color = computed(() => { const nodeType = props.nodeType; - if (nodeType && 'iconColor' in nodeType) { + if (nodeType && 'iconColor' in nodeType && nodeType.iconColor) { return `var(--color-node-icon-${nodeType.iconColor})`; } return nodeType?.defaults?.color?.toString() ?? props.colorDefault ?? ''; From 1b5bbcb84ee75a2db01ab0ae11b24f6652630729 Mon Sep 17 00:00:00 2001 From: Giulio Andreini Date: Tue, 4 Jun 2024 17:32:49 +0200 Subject: [PATCH 20/20] More icon colors. --- packages/design-system/src/css/_tokens.dark.scss | 9 +++------ packages/design-system/src/css/_tokens.scss | 5 +++-- .../nodes/ExecuteWorkflow/ExecuteWorkflow.node.ts | 1 + .../nodes-base/nodes/ExecutionData/ExecutionData.node.ts | 1 + packages/nodes-base/nodes/Filter/Filter.node.ts | 1 + packages/nodes-base/nodes/If/If.node.ts | 1 + .../nodes/SplitInBatches/SplitInBatches.node.ts | 1 + .../nodes/SplitInBatches/v3/SplitInBatchesV3.node.ts | 1 + packages/nodes-base/nodes/Switch/Switch.node.ts | 1 + .../nodes/WorkflowTrigger/WorkflowTrigger.node.ts | 1 + packages/workflow/src/Interfaces.ts | 1 + 11 files changed, 15 insertions(+), 8 deletions(-) diff --git a/packages/design-system/src/css/_tokens.dark.scss b/packages/design-system/src/css/_tokens.dark.scss index 9ff52592eafb9..4b8288cc42c11 100644 --- a/packages/design-system/src/css/_tokens.dark.scss +++ b/packages/design-system/src/css/_tokens.dark.scss @@ -78,14 +78,11 @@ --color-node-icon-gray: var(--prim-gray-200); --color-node-icon-black: var(--prim-gray-70); --color-node-icon-blue: #766dfb; - --color-node-icon-light-blue: #5fabf7; --color-node-icon-dark-blue: #6275ad; - --color-node-icon-orange: #ff965a; - --color-node-icon-orange-red: #ff6d5a; + --color-node-icon-orange-red: var(--prim-color-primary); --color-node-icon-red: var(--prim-color-alt-k); - --color-node-icon-light-green: #26b28f; - --color-node-icon-dark-green: #86dec8; - --color-node-icon-azure: #54b8c9; + --color-node-icon-light-green: #20b69e; + --color-node-icon-dark-green: #86decc; --color-node-icon-purple: #9b6dd5; --color-node-icon-crimson: #d05876; diff --git a/packages/design-system/src/css/_tokens.scss b/packages/design-system/src/css/_tokens.scss index f14f3f29cd297..11bff5141bf41 100644 --- a/packages/design-system/src/css/_tokens.scss +++ b/packages/design-system/src/css/_tokens.scss @@ -114,10 +114,11 @@ --color-node-icon-dark-blue: #353f6e; --color-node-icon-orange: #ff965a; --color-node-icon-orange-red: #ff6d5a; + --color-node-icon-pink-red: #ea4b71; --color-node-icon-red: var(--prim-color-alt-c); - --color-node-icon-light-green: #31c49f; + --color-node-icon-light-green: #31c4ab; --color-node-icon-green: #108e49; - --color-node-icon-dark-green: #15755d; + --color-node-icon-dark-green: #157562; --color-node-icon-azure: #54b8c9; --color-node-icon-purple: #553399; --color-node-icon-crimson: #772244; diff --git a/packages/nodes-base/nodes/ExecuteWorkflow/ExecuteWorkflow.node.ts b/packages/nodes-base/nodes/ExecuteWorkflow/ExecuteWorkflow.node.ts index 55f8c90338064..d75b3098eb6b8 100644 --- a/packages/nodes-base/nodes/ExecuteWorkflow/ExecuteWorkflow.node.ts +++ b/packages/nodes-base/nodes/ExecuteWorkflow/ExecuteWorkflow.node.ts @@ -14,6 +14,7 @@ export class ExecuteWorkflow implements INodeType { displayName: 'Execute Workflow', name: 'executeWorkflow', icon: 'fa:sign-in-alt', + iconColor: 'orange-red', group: ['transform'], version: 1, subtitle: '={{"Workflow: " + $parameter["workflowId"]}}', diff --git a/packages/nodes-base/nodes/ExecutionData/ExecutionData.node.ts b/packages/nodes-base/nodes/ExecutionData/ExecutionData.node.ts index 0dd3097e13518..9bba0a7c700cb 100644 --- a/packages/nodes-base/nodes/ExecutionData/ExecutionData.node.ts +++ b/packages/nodes-base/nodes/ExecutionData/ExecutionData.node.ts @@ -12,6 +12,7 @@ export class ExecutionData implements INodeType { name: 'executionData', icon: 'fa:tasks', group: ['input'], + iconColor: 'light-green', version: 1, description: 'Add execution data for search', defaults: { diff --git a/packages/nodes-base/nodes/Filter/Filter.node.ts b/packages/nodes-base/nodes/Filter/Filter.node.ts index 880542c4880d4..69a46d4a4f807 100644 --- a/packages/nodes-base/nodes/Filter/Filter.node.ts +++ b/packages/nodes-base/nodes/Filter/Filter.node.ts @@ -10,6 +10,7 @@ export class Filter extends VersionedNodeType { displayName: 'Filter', name: 'filter', icon: 'fa:filter', + iconColor: 'light-blue', group: ['transform'], description: 'Remove items matching a condition', }; diff --git a/packages/nodes-base/nodes/If/If.node.ts b/packages/nodes-base/nodes/If/If.node.ts index 0e0f55f21f37e..7bc1d459ca8e4 100644 --- a/packages/nodes-base/nodes/If/If.node.ts +++ b/packages/nodes-base/nodes/If/If.node.ts @@ -10,6 +10,7 @@ export class If extends VersionedNodeType { displayName: 'If', name: 'if', icon: 'fa:map-signs', + iconColor: 'green', group: ['transform'], description: 'Route items to different branches (true/false)', defaultVersion: 2, diff --git a/packages/nodes-base/nodes/SplitInBatches/SplitInBatches.node.ts b/packages/nodes-base/nodes/SplitInBatches/SplitInBatches.node.ts index befc773106020..8bb3a2da45a2a 100644 --- a/packages/nodes-base/nodes/SplitInBatches/SplitInBatches.node.ts +++ b/packages/nodes-base/nodes/SplitInBatches/SplitInBatches.node.ts @@ -11,6 +11,7 @@ export class SplitInBatches extends VersionedNodeType { displayName: 'Split In Batches', name: 'splitInBatches', icon: 'fa:th-large', + iconColor: 'dark-green', group: ['organization'], description: 'Split data into batches and iterate over each batch', defaultVersion: 3, diff --git a/packages/nodes-base/nodes/SplitInBatches/v3/SplitInBatchesV3.node.ts b/packages/nodes-base/nodes/SplitInBatches/v3/SplitInBatchesV3.node.ts index 6e1e416ad3dfc..0581c3d1bc906 100644 --- a/packages/nodes-base/nodes/SplitInBatches/v3/SplitInBatchesV3.node.ts +++ b/packages/nodes-base/nodes/SplitInBatches/v3/SplitInBatchesV3.node.ts @@ -13,6 +13,7 @@ export class SplitInBatchesV3 implements INodeType { displayName: 'Loop Over Items (Split in Batches)', name: 'splitInBatches', icon: 'fa:sync', + iconColor: 'dark-green', group: ['organization'], version: 3, description: 'Split data into batches and iterate over each batch', diff --git a/packages/nodes-base/nodes/Switch/Switch.node.ts b/packages/nodes-base/nodes/Switch/Switch.node.ts index 9b6de4015f8f4..c54f5b55da624 100644 --- a/packages/nodes-base/nodes/Switch/Switch.node.ts +++ b/packages/nodes-base/nodes/Switch/Switch.node.ts @@ -11,6 +11,7 @@ export class Switch extends VersionedNodeType { displayName: 'Switch', name: 'switch', icon: 'fa:map-signs', + iconColor: 'light-blue', group: ['transform'], description: 'Route items depending on defined expression or rules', defaultVersion: 3, diff --git a/packages/nodes-base/nodes/WorkflowTrigger/WorkflowTrigger.node.ts b/packages/nodes-base/nodes/WorkflowTrigger/WorkflowTrigger.node.ts index a78e1f6b8ce80..d3ccad98bb7e1 100644 --- a/packages/nodes-base/nodes/WorkflowTrigger/WorkflowTrigger.node.ts +++ b/packages/nodes-base/nodes/WorkflowTrigger/WorkflowTrigger.node.ts @@ -13,6 +13,7 @@ export class WorkflowTrigger implements INodeType { displayName: 'Workflow Trigger', name: 'workflowTrigger', icon: 'fa:network-wired', + iconColor: 'orange-red', group: ['trigger'], version: 1, description: 'Triggers based on various lifecycle events, like when a workflow is activated', diff --git a/packages/workflow/src/Interfaces.ts b/packages/workflow/src/Interfaces.ts index ac7e4b7748835..77e4d871ad81d 100644 --- a/packages/workflow/src/Interfaces.ts +++ b/packages/workflow/src/Interfaces.ts @@ -1551,6 +1551,7 @@ export type NodeIconColor = | 'dark-blue' | 'orange' | 'orange-red' + | 'pink-red' | 'red' | 'light-green' | 'green'