Added some kind of "base" template

This commit is contained in:
Óscar M. Lage 2024-11-14 18:47:39 +01:00
parent b6f847c5a9
commit 3ef0a1a27f
3 changed files with 91 additions and 5 deletions

View File

@ -0,0 +1,64 @@
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>bskydj - {% block title %}home{% endblock %}</title>
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet">
</head>
<body class="bg-gray-900 text-gray-200">
<!-- Nav -->
<header class="bg-gray-800 border-b border-gray-700 px-6 py-4 flex justify-between items-center">
<div class="flex items-center space-x-4">
<!--<img src="logo.svg" alt="Logo" class="h-8 w-8">-->
<span class="font-semibold text-lg text-white">bskydj</span>
</div>
<div class="space-x-6">
<a href="#" class="text-gray-400 hover:text-blue-400">Home</a>
<a href="#" class="text-gray-400 hover:text-blue-400">Notifications</a>
<a href="#" class="text-gray-400 hover:text-blue-400">Messages</a>
</div>
<div class="flex items-center space-x-4">
<input type="text" placeholder="Search..." class="bg-gray-700 border border-gray-600 rounded px-2 py-1 text-gray-200">
<a href="#" class="text-blue-400 hover:text-blue-300">Profile</a>
</div>
</header>
<div class="flex">
<!-- Left Sidebar -->
<aside class="w-1/5 bg-gray-800 border-r border-gray-700 p-6 hidden lg:block">
<nav class="space-y-6">
<a href="#" class="block text-gray-400 hover:text-blue-400 font-medium">Home</a>
<a href="#" class="block text-gray-400 hover:text-blue-400 font-medium">Notifications</a>
<a href="#" class="block text-gray-400 hover:text-blue-400 font-medium">Messages</a>
<a href="#" class="block text-gray-400 hover:text-blue-400 font-medium">Config</a>
</nav>
</aside>
<!-- Content -->
<main class="flex-1 bg-gray-900 p-6">
<div class="max-w-xl mx-auto space-y-6">
{% block content %}
{% endblock %}
</div>
</main>
<!-- Right Sidebar -->
<aside class="w-1/4 bg-gray-800 border-l border-gray-700 p-6 hidden lg:block">
<h2 class="font-semibold text-lg text-gray-200 mb-4">Hashtags</h2>
<ul class="space-y-4">
<li><a href="#" class="text-gray-400 hover:text-blue-400">#hashtag1</a></li>
<li><a href="#" class="text-gray-400 hover:text-blue-400">#hashtag2</a></li>
<li><a href="#" class="text-gray-400 hover:text-blue-400">#hashtag</a></li>
</ul>
</aside>
</div>
</body>
</html>

View File

@ -1,7 +1,27 @@
{% extends "core/base.html" %}
{% block title %}{{ user }} timeline{% endblock %}
{% block content %}
{% for publication in publications %}
<div class="post">
<p><strong>{{ publication.author_name }} ({{ publication.author_handle }})</strong> <span>{{ publication.published_at }}</span></p>
<p>{{ publication.content }}</p>
<a href="{{ publication.uri }}" target="_blank">View post</a>
<div class="bg-gray-800 p-4 rounded-lg shadow-md space-y-4">
<div class="flex items-center space-x-4">
<img src="{{ publication.author.avatar }}" alt="Avatar" class="h-10 w-10 rounded-full">
<div>
<p class="font-semibold text-white">{{ publication.author_name }}</p>
<p class="text-gray-400 text-sm">{{ publication.published_at }}</p>
</div>
</div>
<p class="text-gray-300">{{ publication.content }}</p>
<div class="flex justify-between text-gray-400 text-sm mt-2">
<button class="hover:text-blue-400">Me gusta</button>
<button class="hover:text-blue-400">Comentar</button>
<button class="hover:text-blue-400">Compartir</button>
</div>
</div>
{% empty %}
<p class="text-gray-500">No hay publicaciones para mostrar.</p>
{% endfor %}
{% endblock %}

View File

@ -52,7 +52,9 @@ def user_timeline(request, user_id):
publication.save()
publications = PublicationCache.objects.filter(user=user).order_by('-published_at')
return render(request, 'core/user_timeline.html', {'publications': publications})
return render(request, 'core/user_timeline.html',
{'publications':publications,
'user':user})
except User.DoesNotExist:
return JsonResponse({"error": "User not found"}, status=404)