Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | 103x 274x 103x 274x 274x 274x 274x 274x 103x 274x 274x 103x 103x 274x 274x 274x 255x 103x | <div
class="status-item rounded-2 focus-inside d-flex align-items-center"
[class.text-disabled]="!value()"
[class.blink]="blink() && value()"
[attr.tabindex]="clickable() ? '0' : ''"
[attr.aria-disabled]="!value()"
>
<div
#bg
role="none"
class="bg"
[class]="background()"
[class.custom-color]="color()"
[class.contrast-fix]="contrastFix()"
[class.d-none]="!value()"
[style.background-color]="blink() && color() ? color() : null"
></div>
@let icon = statusIcon();
@if (!icon) {
<div
class="color-bar me-3 mt-1 mb-1"
[style.background-color]="value() && color() ? color() : null"
></div>
} @else {
<span class="indicator icon me-4 icon-stack">
<si-icon [class]="value() ? icon.color : 'indicator-disabled'" [icon]="icon.icon" />
<si-icon [class]="value() ? icon.stackedColor : 'text-inverse'" [icon]="icon.stacked" />
</span>
}
<div class="overflow-hidden status-item-content">
@if (value() !== undefined) {
<div class="item-value si-body-sbold text-truncate">{{ value().toString() | translate }}</div>
}
@if (!valueOnly()) {
<div class="item-title text-truncate">{{ heading() | translate }}</div>
}
</div>
</div>
|