Yu-Gi-Oh! Deck Building and Card Inventory Management web interface written in Common Lisp, utilizing HTMX.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

34 lines
1.3KB

  1. <h2 class="subtitle"
  2. onclick="toggle_hidden('{{ class }}-deck-list')"
  3. style="cursor:pointer;">
  4. {{ title }}
  5. </h2>
  6. <div class="columns droppable is-mobile is-gapless is-multiline is-visible{% if class %} {{ class }}-deck-list{% endif %}" id="{{ class }}-deck-list"
  7. style="min-height:3rem">
  8. {% for card in deck-list %}
  9. <div class="column draggable"
  10. id="{{ class }}-{{ forloop.counter0 }}"
  11. hx-include="[name='search-form']"
  12. hx-post="/builder/remove?index={{ forloop.counter0 }}&deck={{ class }}"
  13. hx-target="#current-deck-list"
  14. hx-trigger="remove-card"
  15. oncontextmenu="htmx.trigger('#{{ class }}-{{ forloop.counter0 }}', 'remove-card', {}); return false;"
  16. style="flex:none;width:10%"
  17. data-class="{{ class }}"
  18. data-index="{{ forloop.counter0 }}"
  19. data-passcode="{{ card.passcode }}">
  20. <div class="card">
  21. <div class="card-image">
  22. <div class="image is-2by3">
  23. <a target="_blank" href="/cards/by-passcode/{{ card.passcode }}">
  24. <img class="zoom"
  25. src="/public/ygoprodeck/{{ card.passcode }}.jpg"
  26. alt="Card Image for Yu-Gi-Oh! #{{ card.passcode }} - {{ card.name }}">
  27. </a>
  28. </div>
  29. </div>
  30. </div>
  31. </div>
  32. {% endfor %}
  33. </div>