{% load static %}

<header class="header">
  <nav class="navbar" role="navigation" aria-label="main navigation">
    <div class="navbar-brand">
      <a class="navbar-item" href="{% url 'home' %}">
        <img src="{% static 'images/logo-name.svg' %}" alt="Stencila" width="112" height="28">
      </a>
      <div class="navbar-burger">
        <span></span>
        <span></span>
        <span></span>
      </div>
    </div>
    <div class="navbar-menu">
      <div class="navbar-start">
        <a class="navbar-item" href="{% url 'gallery' %}">Gallery</a>
        {% if user.is_authenticated %}
        <a class="navbar-item" href="{% url 'list-projects' user=user %}">Projects</a>
        {% endif %}
      </div>
      <div class="navbar-end">
        {% if user.is_anonymous %}
          <a class="navbar-item" href="{% url 'user_signin' %}">Sign in</a>
          <a class="navbar-item" href="{% url 'user_signup' %}">Sign up</a>
        {% else %}
          {{ user.username }}
          <a class="navbar-item" href="{% url 'user_join' %}">Join</a>
          <a class="navbar-item" href="{% url 'user_settings' %}">Settings</a>
          <a class="navbar-item" href="{% url 'user_signout' %}">Sign out</a>
        {% endif %}
      </div>
    </div>
  </nav>
</header>

{% load static %}

<header class="header">
  <nav class="navbar" role="navigation" aria-label="main navigation">
    <div class="navbar-brand">
      <a class="navbar-item" href="{% url 'home' %}">
        <img src="{% static 'images/logo-name.svg' %}" alt="Stencila" width="112" height="28">
      </a>
      <div class="navbar-burger">
        <span></span>
        <span></span>
        <span></span>
      </div>
    </div>
    <div class="navbar-menu">
      <div class="navbar-start">
        <a class="navbar-item" href="{% url 'gallery' %}">Gallery</a>
        {% if user.is_authenticated %}
        <a class="navbar-item" href="{% url 'list-projects' user=user %}">Projects</a>
        {% endif %}
      </div>
      <div class="navbar-end">
        {% if user.is_anonymous %}
          <a class="navbar-item" href="{% url 'user_signin' %}">Sign in</a>
          <a class="navbar-item" href="{% url 'user_signup' %}">Sign up</a>
        {% else %}
          <div class="navbar-item">{{ user.username }}</div>
          <a class="navbar-item" href="{% url 'user_join' %}">Join</a>
          <a class="navbar-item" href="{% url 'user_settings' %}">Settings</a>
          <a class="navbar-item" href="{% url 'user_signout' %}">Sign out</a>
        {% endif %}
      </div>
    </div>
  </nav>
</header>

Fix spacing of logged-in username
Fix spacing of logged-in username
