CODEWITHSUNDEEP
javascriptcssvuetify.jsnuxt.js
user10090131
user10090131

Reputation:

Unable to change vuetify button outline color

I am using Vuetify in my Nuxt app. I have a button which i want to customize, with the help of a class i try to change the border color but seems like it doesn't work.

What I am missing below ??

<template>
  <div>
    <v-card class="py-5">      
      <v-btn depressed outlined class="fb-btn grey--text">
        Sign with Facebook
      </v-btn>
    </v-card>
  </div>
</template>
<style scoped>
  .fb-btn .v-btn--outlined {
    border: thin solid #CCCCCC;
  }
</style>

Upvotes: 1

Views: 8380

Answers (1)

Carol Skelly
Carol Skelly

Reputation: 362390

The CSS selector would be:

  .fb-btn.v-btn--outlined {
    border: thin solid #CCCCCC;
  }

Demo

Upvotes: 1

Related Questions