{% extends 'base.html.twig' %}

{% block title %}Technology{% endblock %}

{% block body %}
    <main class="relative h-screen w-screen flex flex-col justify-between items-center overflow-hidden">
        <section class="relative w-full h-full flex flex-col justify-between z-10">
            <div class="relative flex flex-col w-full h-full">
                {% include 'admin/header.html.twig' with {'title': 'Technology', 'button_link': path('app_technology_index')} %}
                <div class="h-full overflow-auto flex-grow">
                    <table class="min-w-full divide-y divide-gray-200">
                        <tbody class="bg-white divide-y divide-gray-200">
                            <tr>
                                <th class="px-8 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider w-10">Id</th>
                                <td class="px-8 py-4 whitespace-normal break-words">{{ technology.id ? technology.id : 'NULL' }}</td>
                            </tr>
                            <tr>
                                <th class="px-8 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider w-10">Name</th>
                                <td class="px-8 py-4 whitespace-normal break-words">{{ technology.name ? technology.name : 'NULL'}}</td>
                            </tr>
                            <tr>
                                <th class="px-8 py-4 text-left text-xs font-medium text-gray-500 uppercase tracking-wider w-10">Logo</th>
                                <td class="px-8 py-4 whitespace-normal break-words">{{ technology.logo ? technology.logo : 'NULL' }}</td>
                            </tr>
                        </tbody>
                    </table>
                </div>
                <div class="flex flex-row justify-end gap-2 px-8 py-4 border border-gray-300 flex-shrink-0">
                    <a href="{{ path('app_technology_edit', {'id': technology.id}) }}" class="py-2 px-4 border border-gray-300 shadow text-sm font-medium rounded-lg text-gray-500 bg-white hover:text-white hover:bg-black focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-white transition-all duration-300">Edit</a>
                    {{ include('admin/technology/_delete_form.html.twig') }}
                </div>
            </div>
        </section>
    </main>
{% endblock %}