Merge pull request #2252 from gangsthub/dev

Update vuetify.js example for correct colors palette definition

examples/with-vuetify/assets/app.styl

@@ -1,14 +1,27 @@
 // Specify overrides (theme and/or base variables etc.)
 // See https://vuetifyjs.com/quick-start
+// And for themes customizing: https://vuetifyjs.com/style/theme
+
+// Color Palette: https://vuetifyjs.com/style/colors
+
+// Although, since version https://github.com/vuetifyjs/vuetify/releases/tag/v0.17.0, colors are no
+// longer defined **explicitly** in the stylus files.
+// you can use `import colors from 'vuetify/es5/util/colors'` in the vuetify instance, under `plugins`
+// if you only want to define your color palette.
+
+// you have to define the same palette colors just if you want to use them inside your own stylus files.
+
+@require '~vuetify/src/stylus/settings/_colors'
+
 $theme := {
-  primary: #9c27b0
-  accent: #ce93d8
-  secondary: #424242
-  info: #0D47A1
-  warning: #ffb300
-  error: #B71C1C
-  success: #2E7D32
+  primary:     $red.darken-2
+  accent:      $red.accent-2
+  secondary:   $grey.lighten-1
+  info:        $blue.lighten-1
+  warning:     $amber.darken-2
+  error:       $red.accent-4
+  success:     $green.lighten-2
 }
 
 // Import Vuetify styling
-@require '~vuetify/src/stylus/main.styl'
+@require '~vuetify/src/stylus/main'

examples/with-vuetify/plugins/vuetify.js

@@ -1,4 +1,19 @@
 import Vue from 'vue'
 import Vuetify from 'vuetify'
+import colors from 'vuetify/es5/util/colors'
 
-Vue.use(Vuetify)
+// You can also specify those components you are going to use for "a la carte" build:
+// https://github.com/vuetifyjs/nuxt/blob/master/template/plugins/vuetify.js
+// https://github.com/vuetifyjs/a-la-carte/blob/master/template/src/main.js
+
+Vue.use(Vuetify, {
+  theme: {
+    primary: '#121212', // a color that is not in the material colors palette
+    accent: colors.grey.darken3,
+    secondary: colors.amber.darken3,
+    info: colors.teal.lighten1,
+    warning: colors.amber,
+    error: colors.deepOrange.accent4,
+    success: colors.green.accent3
+  }
+})