1234567891011121314151617181920212223242526272829303132333435363738394041 |
- <div class="life-box" (click)="openDetailsPanel()">
- <div class="life-box-name">Trefferpunkte</div>
- <div class="life-box-bar">
- <div
- class="life-box-bar-current"
- [style.width.%]="currentHitPointsPercentage"
- ></div>
- <div
- class="life-box-bar-temporary"
- [style.width.%]="temporaryHitPointsPercentage"
- ></div>
- <div
- class="life-box-bar-missing"
- [style.width.%]="missingHitPointsPercentage"
- ></div>
- <div class="life-box-bar-label">
- {{ currentHitPoints }}/{{ maxHitPoints
- }}{{ temporaryHitPoints > 0 ? " (+" + temporaryHitPoints + ")" : "" }}
- </div>
- </div>
- <div class="life-box-buttons">
- <button
- class="life-button add"
- (click)="$event.stopPropagation(); addHitPoints()"
- >
- <img src="assets/icons/UIIcons/heal.svg" alt="heal" />
- </button>
- <button
- class="life-button temp"
- (click)="$event.stopPropagation(); addTemporaryHitPoints()"
- >
- <img src="assets/icons/UIIcons/temporary.svg" alt="temporary" />
- </button>
- <button
- class="life-button remove"
- (click)="$event.stopPropagation(); removeHitPoints()"
- >
- <img src="assets/icons/UIIcons/damage.svg" alt="damage" />
- </button>
- </div>
- </div>
|