✨ Add parameter hints for node parameters N8N-2841 (#2704)

* 🔨 base functionality done

* :fix: changes accordingly to review

* :fix: replaced div with n8n-text

* :fix: return wrong deleted color variable

* add mock examples for testing

* add slack node test param

* 🔨 changed font size of hint, added top margin

* 🔨 updated comments and function name

* 🔨 updated parameterHint to hint

* 🔨 updated text color, set compact to true, changed inputLabelHint to hint

* 🔨 updated components styles

* 🔨 replaced mini with xsmall

* :fix: fixed line height

* :fix: changed line height to 1.25

* :hummer: removed mock data

* 🔨 changed xsmall line-height

* ⚡ update to merge hint

Co-authored-by: Mutasem <mutdmour@gmail.com>

packages/editor-ui/src/components/ParameterInputFull.vue

@@ -16,6 +16,7 @@
 			@focus="focused = true"
 			@blur="focused = false"
 			inputSize="small" />
+		<input-hint :class="$style.hint" :hint="$locale.nodeText().hint(parameter, path)" />
 	</n8n-input-label>
 </template>
 
@@ -27,12 +28,14 @@ import {
 } from '@/Interface';
 
 import ParameterInput from '@/components/ParameterInput.vue';
+import InputHint from './ParameterInputHint.vue';
 
 export default Vue
 	.extend({
 		name: 'ParameterInputFull',
 		components: {
 			ParameterInput,
+			InputHint,
 		},
 		data() {
 			return {
@@ -64,3 +67,9 @@ export default Vue
 		},
 	});
 </script>
+
+<style lang="scss" module>
+	.hint {
+		margin-top: var(--spacing-4xs);
+	}
+</style>