覆盖vuetify没有！重要

Question

我想申请自定义的CSS，并覆盖某些默认Vuetify颜色。例如，成功按钮就可轻松覆盖：

.success-button {
  background-color: $sb--color-success !important;
}

但是，有没有办法做同样不使用!important？我都尝试：

body .success-button {
    background-color: $sb--color-success;
}

button .success-button {
  background-color: $sb--color-success;
}

如何做没有!important？

Answer 1

您可以尝试沿着这行的东西

// src/index.js

// Libraries
import Vue from 'vue'
import Vuetify from 'vuetify'

    // Helpers
    import colors from 'vuetify/es5/util/colors'

    Vue.use(Vuetify, {
      theme: {
        primary: colors.red.darken1, // #E53935
        secondary: colors.red.lighten4, // #FFCDD2
        accent: colors.indigo.base // #3F51B5
      }
    })

或者是这样的

 <h1 class="subheading grey--text">DASHBOARD</h1>