[Vuejs]-How to create an exchange-like progress bar behind data-table elements? [Vue/Vuetify]

by

0👍

I made it using a background property on the template elements:

<tr :style="{'background-image': 'linear-gradient(to left, rgba(255, 59, 105, 0.25), rgba(255, 59, 105, 0.25) '+item.percentage+'%, rgba(0, 0, 0, 0) '+item.percentage+'%)'}">
  <td class="text-start items-ask">{{item.ask}}</td>
  <td class="text-center items-quantity">{{item.quantity}}</td>
</tr>

Thank you folks!

Leave a comment