[Vuejs]-Conditionally color material icon in VueJS method?

0👍

Not that will be that common of a question, but I figured it out with a <q-icon />, rather than the bound :icon attribute:

<q-icon class="q-pa-sm" name="fiber_manual_record" :class="fiberIcon(fiberPhase.fiber_status)"/>

I then was able to return classes and set to stylus variables:

.live
  color $positive
.pending
  color $negative
.provisioning
  color $warning

For an end result of this:

enter image description here

Leave a comment