Some UI improvements

templates/chat/chat.html

@@ -582,13 +582,8 @@
 
     <div id="chat-container">
       <div id="chat-online" class="chat-right-panel sidebox">
-        <h3 style="display:flex">
-          {{_('Online Users')}}
-          <a href="#" id="refresh-button" title="{{_('Refresh')}}">
-            <img src="/reload.png"
-              width="100%"
-            >
-          </a>
+        <h3>
+          <i class="fa fa-users"></i>{{_('Online Users')}}
         </h3>
         <div id="chat-online-content">
           <div id="search-container">
@@ -606,7 +601,7 @@
         </div>
       </div>
       <div id="chat-area" class="chat-left-panel" style="width:100%">
-        <div id="chat-info" style="height: 8%">
+        <div id="chat-info" style="height: 10%">
           {% include 'chat/user_online_status.html' %}
         </div>
         <div id="chat-box">

templates/chat/chat_css.html

@@ -4,7 +4,7 @@
   }
 
   #content {
-    margin: 2.5em 1em 0 0;
+    padding-top: 0;
   }
 
   ::-webkit-scrollbar {
@@ -92,7 +92,6 @@
   }
   .sidebox h3 {
     border-radius: 0;
-    margin: -1px -5.5px 0 -5.8px;
   }
   .body-block {
     border-radius: 4px;

templates/chat/user_online_status.html

@@ -1,7 +1,7 @@
 {% if other_user %}
   <div class="status-container" style="height: 100%">
     <img src="{{ gravatar(other_user.user, 135) }}" class="info-pic">
-    <svg style="position:absolute; height:100%; width: 110%">
+    <svg style="position:absolute; height:100%; width: 100%">
       <circle class="info-circle"
         fill="{{'green' if other_online else 'red'}}"/>
     </svg>
@@ -9,9 +9,9 @@
 {% endif %}
 <span class="info-name username">
   {% if other_user %}
-    <a href="{{url('user_page', other_user)}}">{{other_user.user.username}}</a>
+    {{link_user(other_user)}}
   {% else%}
-    <a href="#" style="margin-left: 3em">{{ _('Lobby') }}</a>
+    {{ _('Lobby') }}
   {% endif %}
 </span>
 <span class="spacer"></span>