title: Apply conditional CSS to Vue
body: <p>I'm struggling to apply a conditional Vue statement to change the CSS style based on the text value. I have tried following other tutorials with no luck as I'm a beginner with Vue.</p>
  
  <p>If for example I want the class to be is-success when <code>{{s.specialType}} == "food"</code> AND is-danger when <code>{{s.specialType}} == "drink"</code> how would I do it.</p>
  
  <p>I would appreciate any help. Thanks</p>
  
  <pre><code>&lt;div v-for="s in spc.specials" class="column is-one-third"&gt;
      &lt;div class="field"&gt;
          &lt;span class="tag is-success is-capitalized"&gt;{{s.specialType}}&lt;/span&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>