styling

src/App.vue

@@ -21,11 +21,13 @@
     <RolesModal />
     <ReferenceModal />
     <Gradients />
+    <span id="version">v{{ version }}</span>
   </div>
 </template>
 
 <script>
 import { mapState } from "vuex";
+import { version } from "../package.json";
 import TownSquare from "./components/TownSquare";
 import TownInfo from "./components/TownInfo";
 import Menu from "./components/Menu";
@@ -52,6 +54,11 @@ export default {
     ...mapState(["grimoire", "session"]),
     ...mapState("players", ["players"])
   },
+  data() {
+    return {
+      version
+    };
+  },
   methods: {
     takeScreenshot(dimensions) {
       this.$refs.menu.takeScreenshot(dimensions);
@@ -224,6 +231,14 @@ ul {
   justify-content: center;
 }
 
+#version {
+  position: absolute;
+  right: 10px;
+  bottom: 10px;
+  font-size: 60%;
+  opacity: 0.5;
+}
+
 .blur-enter-active,
 .blur-leave-active {
   transition: all 250ms;

src/components/Player.vue

@@ -343,7 +343,7 @@ export default {
       opacity: 0;
       transform: perspective(400px) scale(1.5);
       transform-origin: top center;
-      transition: all 200ms ease-in-out;
+      transition: all 200ms;
       pointer-events: none;
     }
 
@@ -363,6 +363,10 @@ export default {
     top: 0;
     transform: perspective(400px) scale(1);
   }
+
+  #townsquare:not(.spectator) &.dead .shroud:hover:before {
+    opacity: 1;
+  }
 }
 
 /****** Life token *******/