Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2025-02-06 21:10:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add sidebar to example

Browse Source
This commit is contained in:
Espen Bratberg 2017-03-15 13:01:52 +01:00
parent 18ec7507ad
commit 1ef13c7535
2 changed files with 29 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
examples/with-vuetify/layouts/default.vue Normal file
View File

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

26
examples/with-vuetify/pages/index.vue
View File

@ -1,9 +1,19 @@
<template> <template>
<v-app top-toolbar footer> <v-app top-toolbar left-fixed-sidebar>
<v-toolbar> <v-toolbar>
<v-toolbar-title>Toolbar</v-toolbar-title> <v-toolbar-side-icon @click.native.stop="sidebar = !sidebar" />
<v-toolbar-logo>Toolbar</v-toolbar-logo>
</v-toolbar> </v-toolbar>
<main> <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-content>
<v-container fluid> <v-container fluid>
<div class="title">Main Content</div> <div class="title">Main Content</div>
@ -13,8 +23,18 @@
</v-app> </v-app>
</template> </template>
<script>
export default {
data() {
return {
sidebar: false
}
}
}
</script>
<style> <style>
.title { .title {
padding-left: 14px; padding-left: 20px;
} }
</style> </style>