diff --git a/app/assets/stylesheets/alchemy/node-select.scss b/app/assets/stylesheets/alchemy/node-select.scss
index 464c54b6c9..97a20649fd 100644
--- a/app/assets/stylesheets/alchemy/node-select.scss
+++ b/app/assets/stylesheets/alchemy/node-select.scss
@@ -10,15 +10,23 @@
align-items: center;
height: 21px;
- .icon {
+ > alchemy-icon {
margin: 0 8px 0 4px;
+ }
+ .icon {
.select2-highlighted & {
fill: $white;
}
}
}
+.node-select--node-display_name,
+.node-select--node-ancestors {
+ display: inline-flex;
+ align-items: center;
+}
+
.node-select--node-name {
font-weight: bold;
}
diff --git a/app/javascript/alchemy_admin/components/node_select.js b/app/javascript/alchemy_admin/components/node_select.js
index 98276050d4..fbf307c838 100644
--- a/app/javascript/alchemy_admin/components/node_select.js
+++ b/app/javascript/alchemy_admin/components/node_select.js
@@ -23,12 +23,14 @@ class NodeSelect extends RemoteSelect {
*/
_renderListEntry(node) {
const ancestors = node.ancestors.map((a) => a.name)
+ const seperator = `