NDOJ/templates/chat/user_online_status.html

<div onclick="hide_right_panel()" class="back-button">
  <i class="fa fa-arrow-left"></i>
</div>
{% if other_user %}
  <div class="status-container" style="height: 3em; width: 3em;">
    <img src="{{ gravatar(other_user, 135) }}" class="info-pic">
    <svg style="position:absolute; height:100%; width: 100%; transform: rotate(180deg);" >
      <circle class="info-circle"
        fill="{{'green' if other_online else 'red'}}"/>
    </svg>
  </div>
{% else %}
  <div class="status-container" style="height: 3em;">
    <img src="{{ static('icons/logo.svg') }}" class="info-pic" style="border-radius: 0px;">
  </div>
{% endif %}
<span class="info-name username">
  {% if other_user %}
    {{link_user(other_user)}}
  {% else%}
    {{ _('Lobby') }}
  {% endif %}
</span>
<span class="spacer"></span>
{% if other_user and not other_online %}
  <span class="active-span">{{ relative_time(other_user.last_access, abs=_('Last online on {time}'), rel=_('Online {time}'), format=_('g:i a d/m/Y')) }}</span>
{% endif %}

{% if other_user %}
  <div style="margin-right: 0.3em; position: relative;">
    <div class="control-button small user-setting-button">
      <i class="fa fa-ellipsis-h"></i>
    </div>
    <div class="setting-content">
      <a href="{{url('toggle_ignore', other_user.id)}}" class=" {{'green' if is_ignored else 'red'}}">
        {% if is_ignored %}
          {{_('Unignore')}}
        {% else %}
          {{_('Ignore')}}
        {% endif %}
      </a>
    </div>
  </div>
{% else %}
  <span class="active-span">{{online_count}} {{_('users are online')}}</span>
{% endif %}