View page:

@page 
@model RazorAspNet6Sample.Pages.SensorReadingsModel
 
@{
 }
    
 <style>
    .display-bdr-red{
        background-color:red;
    } 
    .display-bdr-amber{
        background-color:aquamarine;
    }
    .display-bdr-grey{
        background-color:grey;
    }
 </style>
 <div class="sensor-disp-container">
     @foreach (System.Data.DataRow dr in Model.Sensors.Rows)
     {
@*         @if ((dr["isOutOfTolerance"] is true) && (dr["isInAlert"] is true))
         {
            <div class="sensor-display display-bdr-red">A</div>
         }
         @if ((dr["isOutOfTolerance"] is true) && (dr["isInAlert"] is false))
         {
            <div class="sensor-display display-bdr-amber">B</div>
         }
         @if ((dr["isOutOfTolerance"] is false) && (dr["isInAlert"] is false))
         {
            <div class="sensor-display display-bdr-grey">C</div>
         }*@
        var currentcss = "";
        if ((dr["isOutOfTolerance"] is true) && (dr["isInAlert"] is true))
        {
            currentcss = "display-bdr-red";
        }
        else if ((dr["isOutOfTolerance"] is true) && (dr["isInAlert"] is false))
        {
            currentcss = "display-bdr-amber";
        }
        else if ((dr["isOutOfTolerance"] is false) && (dr["isInAlert"] is false))
        {
            currentcss = "display-bdr-grey";
        }
        <div class="sensor-display @currentcss"> 
             @*----------- Sensor information and status/edit buttons ----------*@
             <div class="sensor-information-top">
                 <div class="sensor-information-location">
                     <h5>@dr["LocationName"].ToString()</h5>
                 </div>
                 <div class="sensor-information-btns">
                     @if (dr["isActiveSensor"] is true)
                     {
                         <button type="button" class="btn btn-sm btn-outline-success">Enabled <i class="bi bi-check-circle"></i></button>
                     }
                     @if (dr["isActiveSensor"] is false)
                     {
                         <button type="button" class="btn btn-sm btn-outline-secondary">Disabled <i class="bi bi-x-circle"></i></button>
                     }
                     <a class="btn btn-sm btn-outline-primary"><i class="bi bi-pencil-square"></i></a>
                 </div>
             </div>
             <div class="sensor-information-bottom">
                 <h4>@dr["InstalledLocation"].ToString()</h4>
                 <p class="tolerance-ranges">Tolerance Range: @dr["LowerLimit"].ToString() to @dr["UpperLimit"].ToString()&#x2103;</p>
             </div>
             @*----------- Temperature readings display ----------*@
             <div class="temperature-information">
                 <div class="current-temp">
                     <h1>@dr["CurrentTemp"].ToString()</h1>
                     <h2>&#x2103</h2>
                 </div>
                 <div class="temp-change">
                     @if (Decimal.Parse(dr["CurrentTemp"].ToString()) != Decimal.Parse(dr["PreviousTemp"].ToString()))
                     {
                         @*<p>@dr["PreviousTemp"].ToString()&#x2103</p>*@
                         @if (Decimal.Parse(dr["TempChange"].ToString()) > 4)
                         {
                             <i class="bi bi-arrow-up arrow-red"></i>
                         }
                         @if ((Decimal.Parse(dr["TempChange"].ToString()) > 2) && (Decimal.Parse(dr["TempChange"].ToString()) <= 4))
                         {
                             <i class="bi bi-arrow-up arrow-amber"></i>
                         }
                         @if ((Decimal.Parse(dr["TempChange"].ToString()) > 0) && (Decimal.Parse(dr["TempChange"].ToString()) <= 2))
                         {
                             <i class="bi bi-arrow-up arrow-green"></i>
                         }
                         @if ((Decimal.Parse(dr["TempChange"].ToString()) > -2) && (Decimal.Parse(dr["TempChange"].ToString()) <= 0))
                         {
                             <i class="bi bi-arrow-down arrow-green"></i>
                         }
                         @if ((Decimal.Parse(dr["TempChange"].ToString()) > -4) && (Decimal.Parse(dr["TempChange"].ToString()) <= -2))
                         {
                             <i class="bi bi-arrow-down arrow-amber"></i>
                         }
                         @if (Decimal.Parse(dr["TempChange"].ToString()) <= -4)
                         {
                             <i class="bi bi-arrow-down arrow-red"></i>
                         }
                     }
                 </div>
             </div> 
        </div>
     } 
 </div>