iot-web-ui/src/app/modules/overview/overall-ground/overall-ground.component.html

<div class="p-3"
  fxLayout="row" fxLayoutAlign="space-around center" fxLayoutGap="20px">
  <img class="map-image" src="assets/images/ground.png" fxFlex="70">
  <div fxLayout="column" fxLayoutGap="50px">
    <button [disabled]="!isConnected" mat-flat-button class="red-bg" type="button">ARM SYSTEM</button>
    <button [disabled]="!isConnected" mat-flat-button color="{{state5 ==='ON' ? 'primary' : 'warn' }}" (click)="toggleState1()">LIGHT {{ state5 ==  '' ? 'OFF' : state5}}</button>
    <button [disabled]="!isConnected" mat-flat-button color="{{state6 ==='ON' ? 'primary' : 'warn' }}"  (click)="toggleState2()" [class.on]="state6 === 'ON'">BELL {{ state6 ==  '' ? 'OFF' : state6}}</button>
  </div>
</div>