{% extends "base.html" %}

{% load static %}

{% block main %}
  <div class="flex flex-col justify-center gap-3 tracking-wide text-center mt-12">
    <h1 class="text-4xl font-bold">Strife</h1>
    <h3 class="text-lg mb-3">A fun chat platform</h3>
    <div class="flex justify-center gap-3">
      {% if user.is_authenticated %}
        <div class="flex flex-col justify-center">
          <p>
            Welcome, <strong>{{ user.display_name }}</strong>!
          </p>
        </div>
        <a href="{% url 'home:dashboard' %}"
           class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded">Launch Strife</a>
        <a href="{% url 'users:logout' %}"
           class="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded">Log Out</a>
      {% else %}
        <a href="{% url 'users:login' %}"
           class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">Log In</a>
        <a href="{% url 'users:register' %}"
           class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded">Register</a>
      {% endif %}
    </div>
  </div>
{% endblock main %}