Canvia estil de la playlist i suggerir temes coocurrents

This commit is contained in:
marc
2025-10-25 00:21:05 +02:00
parent 1909af9107
commit 98c009ba53
7 changed files with 96 additions and 1175 deletions

File diff suppressed because one or more lines are too long

View File

@@ -31,7 +31,7 @@
</div>
{% if logged_in or playlist.sets %}
<div class="text-left">
<h4 class="pt-4 text-xl text-beige mt-2">Temes tocats</h4>
<h4 class="py-4 text-xl text-beige mt-2">Temes tocats</h4>
{% include "fragments/sessio/playlist.html" %}
</div>
{% endif %}

View File

@@ -1,14 +1,18 @@
<li class="flex flex-row grow items-center
border border-beige rounded
m-4 rounded-lg bg-white
px-2 py-1 my-1"
id="set-entry-{{ set_id }}"
hx-get="/api/sessio/{{ session_id }}/set/{{ set_id }}"
hx-target="#set-entry-{{ set_id }}"
hx-swap="outerHTML"
hx-trigger="reload-set-{{ set_id }}">
<div class="flex-1 flex flex-col items-center">
<div class="flex-1"></div>
<div class="flex flex-col
items-start
py-2 mx-2
w-full max-w-[655px]">
{% if logged_in %}
<button class="text-beige mt-2"
<button class="text-beige w-full"
hx-delete="/api/sessio/{{ session_id }}/set/{{ set_id }}"
hx-target="#set-entry-{{ set_id }}"
hx-swap="outerHTML">
@@ -17,7 +21,7 @@
</button>
{% endif %}
<ol id="set-entry-{{ set_id }}-list"
class="flex flex-col items-center">
class="flex flex-col items-start w-full">
{% for tema_entry in set_entry.temes %}
{% if new_entry %}
{% include "fragments/sessio/tema_editor.html" %}
@@ -27,7 +31,7 @@
{% endfor %}
</ol>
{% if logged_in %}
<button class="text-beige mt-2"
<button class="text-beige mt-2 w-full"
hx-post="/api/sessio/{{ session_id }}/set/{{ set_id }}"
hx-target="#set-entry-{{ set_id }}-list"
hx-swap="beforeend transition:true">
@@ -36,10 +40,15 @@
</button>
{% endif %}
</div>
<div class="ml-auto">
<div class="flex-1">
<a title="Mostra els temes"
class="text-beige"
href="/sessio/{{ session_id }}/set/{{ set_id }}">
{% if set_entry.temes | length > 1 or not set_entry.temes[0] %}
href="/sessio/{{ session_id }}/set/{{ set_id }}"
{% else %}
href="/tema/{{ set_entry.temes[0].tema_id }}"
{% endif %}
>
<i class="fa fa-chevron-right" aria-hidden="true"></i>
</a>
</div>

View File

@@ -1,5 +1,5 @@
<li id="tune-entry-{{ tema_entry.id }}"
class="flex flex-col items-center my-1">
class="flex flex-col items-center my-1 w-full">
<div class="flex flex-row">
<input
name="query"
@@ -10,8 +10,8 @@
{% endif %}
placeholder="Busca un tema..."
class="border border-beige focus:outline-none
rounded text-center
bg-brown p-1 m-1"
rounded text-center text-black
p-1 m-1"
hx-get="/api/sessio/{{ session_id }}/set/{{ set_id }}/tema/{{ tema_entry.id }}/busca"
hx-trigger="revealed, keyup delay:500ms changed"
hx-target="#tune-entry-{{ tema_entry.id }}-search-results"

View File

@@ -1,29 +1,42 @@
<li id="tune-entry-{{ tema_entry.id }}"
class="flex flex-row my-1">
<div class="mx-1 text-center">
{% if tema_entry.tema is none %}
class="flex flex-col w-full">
<div class="flex flex-row my-1 w-full">
<div class="flex-1 min-w-0 text-black font-bold">
{% if tema_entry.tema %}
<a href="/tema/{{ tema_entry.tema_id }}"
class="break-words block">
{{ tema_entry.tema.title }}
</a>
{% else %}
<i class="fa fa-question" aria-hidden="true"></i>
<i>(Desconegut)</i>
{% else %}
<a href="/sessio/{{ session_id }}/set/{{ set_id }}">
{{ tema_entry.tema.title }}
</a>
{% endif %}
</div>
{% if logged_in %}
<div class="flex-none flex flex-row shrink-0">
<button title="Edita el tema"
class="text-beige mx-1"
hx-get="/api/sessio/{{ session_id }}/set/{{ set_id }}/tema/{{ tema_entry.id }}/editor"
hx-target="#tune-entry-{{ tema_entry.id }}"
hx-swap="outerHTML">
<i class="fa fa-pencil" aria-hidden="true"></i>
</button>
<button title="Esborra el tema"
class="text-beige mx-1"
hx-delete="/api/sessio/{{ session_id }}/set/{{ set_id }}/tema/{{ tema_entry.id }}"
hx-target="#tune-entry-{{ tema_entry.id }}"
hx-swap="outerHTML">
<i class="fa fa-times" aria-hidden="true"></i>
</button>
</div>
{% endif %}
</div>
{% if logged_in %}
<button title="Edita el tema"
class="text-beige mx-1"
hx-get="/api/sessio/{{ session_id }}/set/{{ set_id }}/tema/{{ tema_entry.id }}/editor"
hx-target="#tune-entry-{{ tema_entry.id }}"
hx-swap="outerHTML">
<i class="fa fa-pencil" aria-hidden="true"></i>
</button>
<button title="Esborra el tema"
class="text-beige mx-1"
hx-delete="/api/sessio/{{ session_id }}/set/{{ set_id }}/tema/{{ tema_entry.id }}"
hx-target="#tune-entry-{{ tema_entry.id }}"
hx-swap="outerHTML">
<i class="fa fa-times" aria-hidden="true"></i>
</button>
<div class="my-1 w-full">
{% if tema_entry.tema and tema_entry.tema.main_score() and tema_entry.tema.main_score().preview_url %}
<a href="/tema/{{ tema_entry.tema.id }}">
<img class="px-4 pb-2"
src="{{ tema_entry.tema.main_score().preview_url }}" />
</a>
{% endif %}
</div>
</li>