Fixed a bug with dialog animations hiding buttons by failing to clean up

app/imports/ui/creature/slots/Slots.vue

@@ -131,16 +131,25 @@ export default {
           ],
         }
       }).map(slot => {
+        if (
+          !this.showHiddenSlots &&
+          slot.quantityExpected === 0 &&
+          slot.hideWhenFull
+        ){
+          slot.children = []
+        } else {
           slot.children = CreatureProperties.find({
             'parent.id': slot._id,
             removed: {$ne: true},
           }, {
             sort: { order: 1 },
           }).fetch();
+        }
         return slot;
       }).filter(slot => !( // Hide full and ignored slots
         !this.showHiddenSlots &&
         slot.hideWhenFull &&
+        slot.quantityExpected > 0 &&
         slot.totalFilled >= slot.quantityExpected ||
         slot.ignored
       ));

app/imports/ui/dialogStack/DialogStack.vue

@@ -1,11 +1,15 @@
 <template>
-  <v-layout class="dialog-stack" align-center justify-center>
+  <v-layout
+    class="dialog-stack"
+    align-center
+    justify-center
+  >
     <transition name="backdrop-fade">
       <div
+        v-if="dialogs.length"
         class="backdrop"
         @click="backdropClicked"
-				v-if="dialogs.length"
+      />
-			></div>
     </transition>
     <transition-group
       name="dialog-list"
@@ -17,15 +21,20 @@
       <v-card
         v-for="(dialog, index) in dialogs"
         :key="dialog._id"
+        :ref="index"
         class="dialog"
         :data-element-id="dialog.elementId"
         :data-index="index"
-				:ref="index"
         :style="getDialogStyle(index)"
         :elevation="6"
       >
         <transition name="slide">
-					<component :is="dialog.component" v-bind="dialog.data" @pop="popDialogStack($event)" class="dialog-component"></component>
+          <component
+            :is="dialog.component"
+            v-bind="dialog.data"
+            class="dialog-component"
+            @pop="popDialogStack($event)"
+          />
         </transition>
       </v-card>
     </transition-group>
@@ -33,9 +42,9 @@
 </template>
 
 <script>
-	import Vue from "vue";
+  import Vue from 'vue';
-	import anime from "animejs";
+  import anime from 'animejs';
-  import "/imports/ui/dialogStack/dialogStackWindowEvents.js";
+  import '/imports/ui/dialogStack/dialogStackWindowEvents.js';
   import mockElement from '/imports/ui/dialogStack/mockElement.js';
   import DialogComponentIndex from '/imports/ui/dialogStack/DialogComponentIndex.js';
 
@@ -49,9 +58,31 @@
         return this.$store.state.dialogStack.dialogs;
       },
     },
+    watch: {
+      dialogs(newDialogs) {
+        let el = document.documentElement;
+        if (newDialogs.length) {
+          this.top = el.scrollTop;
+          if (el.scrollHeight > el.clientHeight){
+            el.style.position = 'fixed';
+            el.style.top = `${-this.top}px`;
+            el.style.left = 0;
+            el.style.right = 0;
+            el.style.overflowY = 'scroll';
+          }
+        } else {
+          el.style.position = null;
+          el.style.top = null;
+          el.style.left = null;
+          el.style.right = null;
+          el.style.overflowY = null;
+          el.scrollTop = this.top;
+        }
+      }
+    },
     methods: {
       popDialogStack(result){
-        this.$store.dispatch("popDialogStack", result);
+        this.$store.dispatch('popDialogStack', result);
       },
       backdropClicked(event){
         if (event.target === event.currentTarget) this.popDialogStack();
@@ -95,8 +126,8 @@
         }
 
         // hide the source
-				source.style.transition = "none";
+        source.style.transition = 'none';
-				source.style.opacity = "0";
+        source.style.opacity = '0';
         this.hiddenElement = source;
 
         // Instantly mock the source
@@ -133,6 +164,7 @@
         let source = this.getTopElementByDataId(elementId);
         if (!source){
           console.warn(`Can't find source for ${elementId}`);
+          this.hiddenElement.style.opacity = null;
           done();
           return;
         }
@@ -147,8 +179,8 @@
         // hide the source and reveal the hidden element
         let originalSourceTransition = source.style.transition;
         if (this.hiddenElement !== source){
-					source.style.transition = "none";
+          source.style.transition = 'none';
-					source.style.opacity = "0";
+          source.style.opacity = '0';
           this.hiddenElement.style.opacity = null;
         }
         setTimeout(() => {
@@ -157,9 +189,9 @@
           target.style.transition = `opacity ${MOCK_DURATION / 4}ms, pointer-events 0s`
           requestAnimationFrame(() => {
             source.style.transition = originalSourceTransition;
-						target.style.opacity = "0";
+            target.style.opacity = '0';
-						target.style.pointerEvents = "none";
+            target.style.pointerEvents = 'none';
-						target.style.setProperty('box-shadow', "none", 'important');
+            target.style.setProperty('box-shadow', 'none', 'important');
             setTimeout(done, MOCK_DURATION / 4);
           });
         }, MOCK_DURATION);
@@ -167,28 +199,6 @@
       noScroll(e){
         e.preventDefault();
       }
-    },
-		watch: {
-			dialogs(newDialogs) {
-				let el = document.documentElement;
-        if (newDialogs.length) {
-					this.top = el.scrollTop;
-					if (el.scrollHeight > el.clientHeight){
-						el.style.position = 'fixed';
-						el.style.top = `${-this.top}px`;
-						el.style.left = 0;
-						el.style.right = 0;
-						el.style.overflowY = 'scroll';
-					}
-        } else {
-					el.style.position = null;
-					el.style.top = null;
-					el.style.left = null;
-					el.style.right = null;
-					el.style.overflowY = null;
-					el.scrollTop = this.top;
-        }
-      }
     }
   };
 </script>

app/imports/ui/layouts/Sidebar.vue

@@ -1,14 +1,5 @@
 <template>
   <div class="sidebar">
-    <v-alert
-      icon="priority_high"
-      type="error"
-      dismissible
-      :value="true"
-    >
-      This version of DiceCloud is in beta. Some data stored here may be destroyed by
-      future updates.
-    </v-alert>
     <v-layout
       v-if="!signedIn"
       row