# \[Solved\] Dynamically change block styles/themes from within a workflow?

**URL:** <https://forums.losant.com/t/solved-dynamically-change-block-styles-themes-from-within-a-workflow/971>\
**Category:** Help\
**Created:** [June 5, 2018, 3:39pm UTC](https://forums.losant.com/t/solved-dynamically-change-block-styles-themes-from-within-a-workflow/971 "2018-06-05T15:39:17Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Derek\_Roberson](https://avatars.discourse-cdn.com/v4/letter/d/b5e925/32.png) [@Derek\_Roberson](https://forums.losant.com/u/Derek_Roberson)\
**Post date:** [June 5, 2018, 3:39pm UTC](https://forums.losant.com/t/solved-dynamically-change-block-styles-themes-from-within-a-workflow/971/1 "2018-06-05T15:39:18Z")

</div>

Hello,

Forgive me as I am naive when it comes to HTML and CSS. I am asking this question from a “can it be done in Losant” standpoint to get me started. I would like to be able to dynamically change the cell color in Device State Table from a workflow.

So for example if I had a table displaying the outside temperature I would want the cell color to be green if the temperature were below or equal to 85 degrees Fahrenheit and red if above 85 degrees Fahrenheit.

I know that markdown isn’t capable of doing this and the only way I see this being done is through Experience Views unless there is something I am missing? Can this be done dynamically as described above?

Thanks,

Derek

---

<div class="post-metadata">

**Author:** ![Brandon\_Cannaday](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.losant.com/brandon_cannaday/32/14_2.png) [@Brandon\_Cannaday](https://forums.losant.com/u/Brandon_Cannaday)\
**Post date:** [June 5, 2018, 3:50pm UTC](https://forums.losant.com/t/solved-dynamically-change-block-styles-themes-from-within-a-workflow/971/2 "2018-06-05T15:50:29Z")

</div>

The first step is to put the temperature on the payload using the workflow. How you get the data on the payload is up to you and where the data is coming from. If it’s from a device, a [Gauge Query Node](https://docs.losant.com/workflows/data/gauge-query/) can get the most recent data point. If it’s from a weather API, you might use the [HTTP Node](https://docs.losant.com/workflows/data/http/).

For the rest of this example, I’ll assume the outside temperature is on the payload at `working.outsideTemp`.

Then, in the Experience Page, you can use a template to check the temperature and render the appropriate background color based on the value:

```auto
<table>
  <tr>
    <td>Temperature</td>
    <td style="background-color:{{#lte pageData.working.outsideTemp 85}}#00FF00{{else}}#FF0000{{/lte}};">{{pageData.outsideTemp}}</td>
  </tr>
</table>

```

The `#lte` handlebar helper checks if a value is “less than or equal to”. You can see a list of our helpers in [our documentation](https://docs.losant.com/workflows/accessing-payload-data/).

---

<div class="post-metadata">

**Author:** ![Derek\_Roberson](https://avatars.discourse-cdn.com/v4/letter/d/b5e925/32.png) [@Derek\_Roberson](https://forums.losant.com/u/Derek_Roberson)\
**Post date:** [June 5, 2018, 4:04pm UTC](https://forums.losant.com/t/solved-dynamically-change-block-styles-themes-from-within-a-workflow/971/3 "2018-06-05T16:04:34Z")

</div>

Brandon,

Thanks for the info! This should be enough to get me started.

Derek