Updated badge styling & show if OK

This commit is contained in:
shamoon 2024-02-12 11:19:30 -08:00
parent 4f4a7aee14
commit 4a5bfee4ae
2 changed files with 12 additions and 4 deletions

View File

@ -153,6 +153,7 @@ import {
doorOpen, doorOpen,
download, download,
envelope, envelope,
exclamationCircleFill,
exclamationTriangle, exclamationTriangle,
exclamationTriangleFill, exclamationTriangleFill,
eye, eye,
@ -242,6 +243,7 @@ const icons = {
doorOpen, doorOpen,
download, download,
envelope, envelope,
exclamationCircleFill,
exclamationTriangle, exclamationTriangle,
exclamationTriangleFill, exclamationTriangleFill,
eye, eye,

View File

@ -11,14 +11,20 @@
[disabled]="!systemStatus" [disabled]="!systemStatus"
*pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Admin }"> *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Admin }">
@if (!systemStatus) { @if (!systemStatus) {
<div class="spinner-border spinner-border-sm me-1" role="status"></div> <div class="spinner-border spinner-border-sm me-1 h-75" role="status"></div>
} @else { } @else {
<i-bs class="me-1" name="card-checklist"></i-bs> <i-bs class="me-2" name="card-checklist"></i-bs>
@if (systemStatusHasErrors) { @if (systemStatusHasErrors) {
<span class="badge bg-danger position-absolute top-0 start-100 translate-middle rounded-pill py-1 px-2">!</span> <span class="badge bg-body position-absolute top-0 start-100 translate-middle rounded-pill p-0">
<i-bs name="exclamation-circle-fill" class="text-danger" width="1.75em" height="1.75em"></i-bs>
</span>
} @else {
<span class="badge bg-body position-absolute top-0 start-100 translate-middle rounded-pill p-0">
<i-bs name="check-circle-fill" class="text-success" width="1.75em" height="1.75em"></i-bs>
</span>
} }
} }
&nbsp;<ng-container i18n>System Status</ng-container> <ng-container i18n>System Status</ng-container>
</button> </button>
<a *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Admin }" class="btn btn-sm btn-primary ms-3" href="admin/" target="_blank"> <a *pngxIfPermissions="{ action: PermissionAction.View, type: PermissionType.Admin }" class="btn btn-sm btn-primary ms-3" href="admin/" target="_blank">
<ng-container i18n>Open Django Admin</ng-container> <ng-container i18n>Open Django Admin</ng-container>