fix(editor): Fix secondary icon for environments on sidebar menu item (#8407)

packages/design-system/src/components/N8nMenuItem/MenuItem.vue

@@ -63,13 +63,16 @@
 					<span :class="$style.label">{{ item.label }}</span>
 					<N8nTooltip
 						v-if="item.secondaryIcon"
-						:class="$style.secondaryIcon"
 						:placement="item.secondaryIcon?.tooltip?.placement || 'right'"
 						:content="item.secondaryIcon?.tooltip?.content"
 						:disabled="compact || !item.secondaryIcon?.tooltip?.content"
 						:show-after="tooltipDelay"
 					>
-						<N8nIcon :icon="item.secondaryIcon.name" :size="item.secondaryIcon.size || 'small'" />
+						<N8nIcon
+							:class="$style.secondaryIcon"
+							:icon="item.secondaryIcon.name"
+							:size="item.secondaryIcon.size || 'small'"
+						/>
 					</N8nTooltip>
 				</ElMenuItem>
 			</ConditionalRouterLink>
@@ -274,6 +277,7 @@ export default defineComponent({
 	align-items: center;
 	justify-content: flex-end;
 	flex: 1;
+	margin-left: 20px;
 }
 
 .label {

packages/design-system/src/components/N8nTooltip/Tooltip.vue

@@ -3,7 +3,7 @@
 		<slot />
 		<template #content>
 			<slot name="content">
-				{{ content }}
+				<div v-html="content"></div>
 			</slot>
 			<div
 				v-if="buttons.length"

packages/editor-ui/src/plugins/i18n/locales/en.json

@@ -739,7 +739,7 @@
 	"mainSidebar.showMessage.stopExecution.title": "Execution stopped",
 	"mainSidebar.templates": "Templates",
 	"mainSidebar.workflows": "Workflows",
-	"mainSidebar.workflows.readOnlyEnv.tooltip": "Protected mode is active, so no workflows changes are allowed. Change this in Settings, under 'Source Control'",
+	"mainSidebar.workflows.readOnlyEnv.tooltip": "Protected instances prevent editing workflows (recommended for production environments). <a target=\"_blank\" href=\"https://docs.n8n.io/source-control-environments/\">More info</a>",
 	"mainSidebar.executions": "All executions",
 	"mainSidebar.workersView": "Workers",
 	"menuActions.duplicate": "Duplicate",