bugfixes

src/components/Player.vue

@@ -51,7 +51,7 @@
         <font-awesome-icon icon="hand-paper" class="vote" title="Hand UP" />
       </div>
       <div class="overlay" @click="vote()">
-        <font-awesome-icon icon="times" class="vote" title="Hand DOWN" />
+        <font-awesome-icon icon="xmark" class="vote" title="Hand DOWN" />
       </div>
       <div class="overlay" @click="cancel()">
         <font-awesome-icon icon="times-circle" class="cancel" title="Cancel" />
@@ -548,7 +548,7 @@ export default {
     &.fa-hand * {
       fill: url(#demon);
     }
-    &.fa-times * {
+    &.fa-xmark * {
       fill: url(#townsfolk);
     }
   }
@@ -563,7 +563,7 @@ export default {
 // you voted yes | a locked vote yes | a locked vote no
 #townsquare.vote .player.you.vote-yes .overlay svg.vote.fa-hand,
 #townsquare.vote .player.vote-lock.vote-yes .overlay svg.vote.fa-hand,
-#townsquare.vote .player.vote-lock:not(.vote-yes) .overlay svg.vote.fa-times {
+#townsquare.vote .player.vote-lock:not(.vote-yes) .overlay svg.vote.fa-xmark {
   opacity: 1;
   transform: scale(1);
 }

src/components/Token.vue

@@ -75,7 +75,9 @@ export default {
   },
   methods: {
     nameToFontSize(name) {
-      return name && name.length > 10 ? "90%" : "110%";
+      if (name && name.length > 14) return "80%";
+      if (name && name.length > 10) return "90%";
+      return "110%";
     },
     setRole() {
       this.$emit("set-role");

src/components/Vote.vue

@@ -104,6 +104,11 @@
         <span>2</span>
         <span>1</span>
         <span>GO</span>
+        <audio
+          :autoplay="!grimoire.isMuted"
+          src="/countdown.mp3"
+          :muted="grimoire.isMuted"
+        ></audio>
       </div>
     </transition>
   </div>
@@ -111,7 +116,6 @@
 
 <script>
 import { mapGetters, mapState } from "vuex";
-import bongs from "../assets/sounds/countdown.mp3";
 
 export default {
   computed: {
@@ -189,10 +193,6 @@ export default {
     countdown() {
       this.$store.commit("session/lockVote", 0);
       this.$store.commit("session/setVoteInProgress", true);
-      if (!this.grimoire.isMuted) {
-        var sound = new Audio(bongs);
-        sound.play();
-      }
       this.voteTimer = setInterval(() => {
         this.start();
       }, 4000);

src/main.js

@@ -39,7 +39,6 @@ const faIcons = [
   "Skull",
   "Square",
   "TheaterMasks",
-  "Times",
   "TimesCircle",
   "TrashAlt",
   "Undo",
@@ -53,6 +52,8 @@ const faIcons = [
   "VoteYea",
   "WindowMaximize",
   "WindowMinimize",
+  "Times",
+  "Xmark",
 ];
 const fabIcons = ["Github", "Discord"];
 library.add(