journal-character.component.html 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475
  1. <div class="header">
  2. <div class="header-data">
  3. <input type="number" />
  4. <div class="horizontal-ruler"></div>
  5. Stufe
  6. </div>
  7. <div class="name">Tel´Var</div>
  8. <div class="header-data">
  9. <input type="number" />
  10. <div class="horizontal-ruler"></div>
  11. Erfahrungspunkte
  12. </div>
  13. </div>
  14. <div class="character-body">
  15. <div class="d-flex">
  16. <div
  17. ngbNav
  18. #nav="ngbNav"
  19. [(activeId)]="activeTab"
  20. class="flex-column navigation-bar"
  21. orientation="vertical"
  22. >
  23. <ng-container ngbNavItem="general">
  24. <button ngbNavLink>Allgemeines</button>
  25. <ng-template ngbNavContent>
  26. <general></general>
  27. </ng-template>
  28. </ng-container>
  29. <ng-container ngbNavItem="species">
  30. <button ngbNavLink>Volk</button>
  31. <ng-template ngbNavContent>
  32. <!-- <species></species> -->
  33. species works!
  34. </ng-template>
  35. </ng-container>
  36. <ng-container ngbNavItem="class">
  37. <button ngbNavLink>Klasse</button>
  38. <ng-template ngbNavContent>
  39. <!-- <class></class> -->
  40. class works!
  41. </ng-template>
  42. </ng-container>
  43. <ng-container ngbNavItem="subclass">
  44. <button ngbNavLink>Unterklasse</button>
  45. <ng-template ngbNavContent>
  46. <!-- <class></class> -->
  47. subclass works!
  48. </ng-template>
  49. </ng-container>
  50. <ng-container ngbNavItem="combined">
  51. <button ngbNavLink>Kombinierte Ansicht</button>
  52. <ng-template ngbNavContent>
  53. <!-- <class></class> -->
  54. combined works!
  55. </ng-template>
  56. </ng-container>
  57. <ng-container ngbNavItem="background">
  58. <button ngbNavLink>Hintergrund</button>
  59. <ng-template ngbNavContent>
  60. <!-- <class></class> -->
  61. background works!
  62. </ng-template>
  63. </ng-container>
  64. <ng-container ngbNavItem="stroy">
  65. <button ngbNavLink>Geschichte</button>
  66. <ng-template ngbNavContent>
  67. <!-- <class></class> -->
  68. story works!
  69. </ng-template>
  70. </ng-container>
  71. </div>
  72. <div [ngbNavOutlet]="nav" class="outlet"></div>
  73. </div>
  74. </div>