title: Blazor - Change Color of text based on condition
body: <p>I have this five ratings:</p>
  <pre><code>    if (model.CIIattainedrequired2021 &gt; model.d4)
      {
          model.CIIrating2021 = &quot;E&quot;;
      }
      if (model.CIIattainedrequired2021 &lt; model.d4)
      {
          model.CIIrating2021 = &quot;D&quot;;
      }
      if (model.CIIattainedrequired2021 &lt; model.d3)
      {
          model.CIIrating2021 = &quot;C&quot;;
      }
      if (model.CIIattainedrequired2021 &lt; model.d2)
      {
          model.CIIrating2021 = &quot;B&quot;;
      }
      if (model.CIIattainedrequired2021 &lt; model.d1)
      {
          model.CIIrating2021 = &quot;A&quot;;
      }
  </code></pre>
  <p>I display them in tables:</p>
  <pre><code>    &lt;td class=&quot;text-center px-2 py-1 mx-0 text-xs&quot;&gt;
      &lt;p&gt;@model.CIIrating2019&lt;/p&gt;
  &lt;/td&gt;&lt;td class=&quot;text-center px-2 py-1 mx-0 text-xs&quot;&gt;
      &lt;p&gt;@model.CIIrating2020&lt;/p&gt;
  &lt;/td&gt;&lt;td class=&quot;text-center px-2 py-1 mx-0 text-xs&quot;&gt;
      &lt;p&gt;@model.CIIrating2021&lt;/p&gt;
  &lt;/td&gt;&lt;td class=&quot;text-center px-2 py-1 mx-0 text-xs&quot;&gt;
      &lt;p&gt;@model.CIIrating2022&lt;/p&gt;
  &lt;/td&gt;&lt;td class=&quot;text-center px-2 py-1 mx-0 text-xs&quot;&gt;
      &lt;p&gt;@model.CIIrating2023&lt;/p&gt;
  &lt;/td&gt;&lt;td class=&quot;text-center px-2 py-1 mx-0 text-xs&quot;&gt;
      &lt;p&gt;@model.CIIrating2024&lt;/p&gt;
  &lt;/td&gt;&lt;td class=&quot;text-center px-2 py-1 mx-0 text-xs&quot;&gt;
      &lt;p&gt;@model.CIIrating2025&lt;/p&gt;
  &lt;/td&gt;&lt;td class=&quot;text-center px-2 py-1 mx-0 text-xs&quot;&gt;
      &lt;p&gt;@model.CIIrating2026&lt;/p&gt;
  </code></pre>
  <p>And depending on the answer i would like to show the text in different colors as follow:</p>
  <p>A-GREEN
  B-LIGHTGREEN
  C-YELLOW
  D-ORANGE
  E-RED</p>