diff --git a/src/ui/inspector/Elements.vue b/src/ui/inspector/Elements.vue
index 7acea28c27..49a3554f60 100644
--- a/src/ui/inspector/Elements.vue
+++ b/src/ui/inspector/Elements.vue
@@ -5,15 +5,18 @@
@input="applySearch"
@clear="applySearch">
-
+
- -
-
+
-
+
+ v-if="elements.length > 1 && isEditing">
@@ -44,6 +47,9 @@
&__elements {
flex: 1 1 auto;
overflow: auto;
+ &.is-dragging {
+ li { opacity: 0.2; }
+ }
}
&__grippy {
@@ -55,7 +61,7 @@
}
}
- .js-last-place{
+ .js-last-place {
height: 10px;
}
@@ -74,7 +80,8 @@ export default {
elements: [],
isEditing: this.openmct.editor.isEditing(),
parentObject: undefined,
- currentSearch: ''
+ currentSearch: '',
+ isDragging: false
}
},
mounted() {
@@ -154,12 +161,19 @@ export default {
this.composition.reorder(this.moveFromIndex, moveToIndex);
},
moveFrom(index){
+ this.isDragging = true;
this.moveFromIndex = index;
+ document.addEventListener('dragend', this.hideDragStyling);
+ },
+ hideDragStyling() {
+ this.isDragging = false;
+ document.removeEventListener('dragend', this.hideDragStyling);
}
},
destroyed() {
this.openmct.editor.off('isEditing', this.setEditState);
this.openmct.selection.off('change', this.showSelection);
+
if (this.mutationUnobserver) {
this.mutationUnobserver();
}