Add network status component.

- Tracks status uof user's network connection.
This commit is contained in:
Spencer Ofwiti
2021-04-06 10:32:52 +03:00
parent 4006369793
commit a50bc2f50a
7 changed files with 80 additions and 27 deletions

View File

@@ -0,0 +1,13 @@
<nav class="navbar navbar-dark bg-dark">
<h1 class="navbar-brand">
<div *ngIf="noInternetConnection; then offlineBlock else onlineBlock"></div>
<ng-template #offlineBlock>
<strong style="color: red;">OFFLINE </strong>
<img width="20rem" src="assets/images/no-wifi.svg" alt="Internet Disconnected">
</ng-template>
<ng-template #onlineBlock>
<strong style="color: lawngreen;">ONLINE </strong>
<img width="20rem" src="assets/images/wifi.svg" alt="Internet Connected">
</ng-template>
</h1>
</nav>