Change unique name layout

client/index.html

@@ -50,6 +50,7 @@
             </svg>
         </a>
     </header>
+    <div id="displayName" class="font-body2"></div>
     <!-- Peers -->
     <x-peers class="center"></x-peers>
     <x-no-peers>
@@ -61,7 +62,6 @@
         <svg class="icon logo">
             <use xlink:href="#wifi-tethering" />
         </svg>
-        <div id="displayName" class="font-body2">[ ... ]</div>
         <div>The easiest way to transfer data across devices.</div>
         <div class="font-body2">Allow me to be discovered by: Everyone in this network.</div>
     </footer>

client/scripts/ui.js

@@ -495,7 +495,7 @@ class Snapdrop {
 
         // set display name
         Events.on('displayName', e => {
-            $("displayName").textContent = "[ " + e.detail.message + " ]";
+            $("displayName").textContent = "You are known as " + e.detail.message;
         });
     }
 }