Merge pull request #384 from bratberg/master

Add Vuetify.js example
This commit is contained in:
Sébastien Chopin 2017-03-15 15:18:15 +01:00 committed by GitHub
commit e102580b33
6 changed files with 73 additions and 0 deletions

View File

@ -0,0 +1,4 @@
# Using Vuetify.js with Nuxt.js
https://nuxtjs.org/examples/with-vuetify
https://vuetifyjs.com/

View File

@ -0,0 +1,6 @@
<template>
<div>
<nuxt/>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</div>
</template>

View File

@ -0,0 +1,7 @@
module.exports = {
build: {
vendor: ['vuetify']
},
plugins: ['~plugins/vuetify.js'],
css: ['vuetify/dist/vuetify.min.css']
}

View File

@ -0,0 +1,12 @@
{
"name": "with-vuetify",
"dependencies": {
"nuxt": "latest",
"vuetify": "^0.9.1"
},
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start"
}
}

View File

@ -0,0 +1,40 @@
<template>
<v-app top-toolbar left-fixed-sidebar>
<v-toolbar>
<v-toolbar-side-icon @click.native.stop="sidebar = !sidebar" />
<v-toolbar-logo>Toolbar</v-toolbar-logo>
</v-toolbar>
<main>
<v-sidebar left fixed drawer v-model="sidebar">
<v-list>
<v-list-item v-for="i in 3">
<v-list-tile>
<v-list-tile-title>Item {{ i }}</v-list-tile-title>
</v-list-tile>
</v-list-item>
</v-list>
</v-sidebar>
<v-content>
<v-container fluid>
<div class="title">Main Content</div>
</v-container>
</v-content>
</main>
</v-app>
</template>
<script>
export default {
data() {
return {
sidebar: false
}
}
}
</script>
<style>
.title {
padding-left: 20px;
}
</style>

View File

@ -0,0 +1,4 @@
import Vue from 'vue'
import Vuetify from 'vuetify'
Vue.use(Vuetify)