Change border-color vuetify v-card when click button

user_5396535 0
Viewed 9678

I want to change the border color of the v-card from vuetify with the limited-products id to red when the user clicks the showError button you can see in the image below, and when the user clicks the removeError button, the border color of the v-card with the limited-products id becomes white. In my codepen, What's wrong with my code? enter image description here

vuetify.js vue.js css html
2 Answers

You can wrap the v-card in v-sheet like this:

<v-sheet outlined color="red" rounded>
    <v-card outlined elevation="0">
        ...
    </v-card>
</v-sheet>
user_11662850

Looks like you just missing border width.

Edit the border-color to border like so and your code works fine.

<v-card id="limited-products" :style="isShowError ? 'border: 1px solid red;' : 'border: 1px solid white;'">
user_98554480
Related