This commit is contained in:
Lars Behrends
2025-10-18 22:03:30 +02:00
parent f4c1cfc164
commit ca2d3a6960
45 changed files with 4827 additions and 326 deletions

View File

@@ -0,0 +1,76 @@
{% extends "layouts/app.twig" %}
{% block content %}
<div class="px-4 py-6 sm:px-0">
<div class="flex justify-between items-center mb-6">
<h1 class="text-3xl font-bold text-gray-900">Games</h1>
<div class="text-sm text-gray-500">
{{ games|length }} games from {{ games|reduce((carry, game) => carry + game.platform_count, 0) }} platforms
</div>
</div>
{% if games is empty %}
<div class="text-center py-12">
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.828 14.828a4 4 0 01-5.656 0M9 10h1m4 0h1m-7 8h12a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"/>
</svg>
<h3 class="mt-2 text-sm font-medium text-gray-900">No games found</h3>
<p class="mt-1 text-sm text-gray-500">Start syncing your gaming libraries to see your games here.</p>
</div>
{% else %}
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{% for game in games %}
<div class="bg-white overflow-hidden shadow rounded-lg">
<div class="p-6">
<div class="flex items-center">
<div class="flex-shrink-0">
{% if game.image_url %}
<img class="h-12 w-12 rounded-lg object-cover" src="{{ game.image_url }}" alt="{{ game.title }}">
{% else %}
<div class="h-12 w-12 rounded-lg bg-gray-200 flex items-center justify-center">
<svg class="h-6 w-6 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.828 14.828a4 4 0 01-5.656 0M9 10h1m4 0h1m-7 8h12a2 2 0 002-2V8a2 2 0 00-2-2H5a2 2 0 00-2 2v8a2 2 0 002 2z"/>
</svg>
</div>
{% endif %}
</div>
<div class="ml-4 flex-1">
<h3 class="text-lg font-medium text-gray-900 truncate">
<a href="{{ path_for('games.show', {'game_key': game.game_key}) }}" class="hover:text-indigo-600">
{{ game.title }}
</a>
</h3>
<p class="text-sm text-gray-500">
{{ game.platform_count }} platform{{ game.platform_count > 1 ? 's' : '' }}
{% if game.platforms %}
<span class="ml-2 inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800">
{{ game.platforms|join(', ') }}
</span>
{% endif %}
</p>
</div>
</div>
<div class="mt-4">
<div class="flex items-center justify-between text-sm text-gray-500">
<span>{{ game.total_playtime|format_duration }} played</span>
{% if game.max_completion > 0 %}
<span>{{ game.max_completion }}% complete</span>
{% endif %}
</div>
{% if game.genres %}
<div class="mt-2 flex flex-wrap gap-1">
{% for genre in game.genres %}
<span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-indigo-100 text-indigo-800">
{{ genre }}
</span>
{% endfor %}
</div>
{% endif %}
</div>
</div>
</div>
{% endfor %}
</div>
{% endif %}
</div>
{% endblock %}