ngx-admin/src/app/pages/dashboard/dashboard.component.html

<ngx-status-cards></ngx-status-cards>

<div class="row">
  <div class="col-lg-3">
    <nga-card size="xmedium">
      <nga-tabset fullWidth>
        <nga-tab tabTitle="Temperature">
          <ngx-temperature-dragger [arcThickness]="15" [knobRadius]="15" [(value)]="currentValue" [bottomAngle]="90"
                               disableArcColor="#2c2961"
                               [fillColors]="['#2ec6ff', '#31ffad', '#7bff24', '#fff024', '#ff6c00']">
          </ngx-temperature-dragger>
        </nga-tab>
        <nga-tab tabTitle="Humidity">
          <span>Content #2</span>
        </nga-tab>
      </nga-tabset>
    </nga-card>
  </div>

  <div class="col-lg-9">
    <nga-card size="xmedium">
      <nga-card-header>
        Electricity
      </nga-card-header>
    </nga-card>
  </div>
</div>

<div class="row">
  <div class="col-lg-9">
    <nga-card size="xmedium">
      <nga-card-header>
        Room Management
      </nga-card-header>
      <nga-card-body>
      </nga-card-body>
    </nga-card>
  </div>

  <div class="col-lg-3">
    <nga-card size="xmedium" class="contacts">
      <nga-tabset fullWidth>
        <nga-tab tabTitle="Contacts">
          <span>Content #1</span>
        </nga-tab>
        <nga-tab tabTitle="Recent">
          <span>Content #2</span>
        </nga-tab>
      </nga-tabset>
    </nga-card>
  </div>
</div>