{% extends "base.html" %}

{% block title %}About - Blog{% endblock %}
{% block meta_description %}A modern blog built with FastAPI and DDD architecture.{% endblock %}

{% block content %}
<div class="page-header" data-testid="page-header-about">
    <h1 class="page-title" data-testid="page-title-about">About</h1>
</div>

<div class="card" data-testid="about-card">
    <div class="card-body" data-testid="about-card-body">
        <p data-testid="about-description">
            A modern blog built with FastAPI and Domain-Driven Design architecture.
        </p>

        <div class="divider" data-testid="about-divider"></div>

        <p data-testid="about-user">
            {% if user %}
            Signed in as <strong>{{ user.username }}</strong>.
            {% else %}
            You are browsing as a guest.
            {% endif %}
        </p>
    </div>

    <div class="card-footer" data-testid="about-card-footer">
        <a href="/web/" class="btn" data-testid="btn-back-home">
            <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" style="margin-right: 0.5rem;">
                <path d="M10 12L6 8L10 4" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
            </svg>
            Back to Home
        </a>
    </div>
</div>
{% endblock %}