{% extends 'base.html' %}

{% block content %}
    <div class="row">
        <div class="col">
            <h1 class="text-center">{% block title %} {{ practice['name'] }} {% endblock %}</h1>
        </div>
    </div>
    {% if current_user.is_authenticated %}
    <div class="row text-center py-3">
        <a href="{{ url_for('practice.edit_practice', practice_id=practice['id']) }}">
            <span class="badge bg-dark">Edit</span>
        </a>
    </div>
    {% endif %}
    <div class="row">
        <div class="col">
            <table class="table table-hover">
                <tbody>
                    <tr>
                        <th>
                            Created:
                        </th>
                        <td>
                            {{ practice['created'].strftime("%Y-%m-%d %H:%M") }} UTC
                        </td>
                    </tr>
                    <tr>
                        <th>
                            Description:
                        </th>
                        <td>
                            {{ practice['description'] }}
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    {% if resources %}
    <div class="row">
        <div class="col">
            <h2 class="text-center">Linked resources:</h2>
        </div>
    </div>
    <div class="row">
    {% for resource in resources %}
        <div class="col-md-4 col-sm-6 py-3">
        {% if resource['type'] == 'tool' %}
        <div class="card text-dark bg-info mb-3">
            <div class="card-body">
                <a href="{{ url_for('tool.show_tool', tool_id=resource['id']) }}">
                    <h3 class="card-title text-center text-dark">{{ resource['name'] }}</h3>
                </a>
                <p class="card-text">
                    {{ resource['description']|truncate(100) }}
                </p>
            </div>
        </div>
        {% endif %}
        </div>
    {% endfor %}
    </div>
    {% endif %}
{% endblock %}