custom-spells-modal.component.html 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. <div class="dimensions">
  2. <div class="content">
  3. <div class="title">{{ "spellbook.manage" | translate }}</div>
  4. <div class="spell-list">
  5. @for (spell of spells; let index = $index; track spell) {
  6. <div
  7. matRipple
  8. class="spell"
  9. [ngClass]="{ selected: indexList.includes(index) }"
  10. (click)="toggleSpellSelection(index)"
  11. >
  12. <div class="spell-name">
  13. @if (translate.getDefaultLang() == "de") {
  14. {{ spell.german }}
  15. } @else {
  16. {{ spell.english }}
  17. }
  18. </div>
  19. <div class="spell-level">
  20. {{ "spellbook.favorites.levels." + spell.level | translate }}
  21. </div>
  22. <div class="spell-school">
  23. {{ "schools." + spell.school | translate }}
  24. </div>
  25. </div>
  26. } @empty {
  27. <div class="empty-list">{{ "spellbook.empty" | translate }}</div>
  28. }
  29. </div>
  30. </div>
  31. <div class="button-container">
  32. <button
  33. [class]="indexList.length === 0 ? 'disabled' : ''"
  34. (click)="indexList.length !== 0 ? delete() : ''"
  35. >
  36. {{ "spellbook.delete" | translate }}
  37. </button>
  38. </div>
  39. </div>