89 lines
2.6 KiB
Vue
89 lines
2.6 KiB
Vue
<template lang="pug">
|
|
v-app
|
|
nav-header
|
|
v-navigation-drawer.primary(dark, app, clipped, permanent)
|
|
v-list(dense)
|
|
v-list-tile.pt-2
|
|
v-list-tile-avatar: v-icon home
|
|
v-list-tile-title Home
|
|
v-divider.my-2
|
|
v-subheader.pl-4 Navigation
|
|
v-list-tile
|
|
v-list-tile-avatar: v-icon stars
|
|
v-list-tile-title The Universe
|
|
v-list-tile
|
|
v-list-tile-avatar: v-icon directions_boat
|
|
v-list-tile-title Ships
|
|
v-list-tile
|
|
v-list-tile-avatar: v-icon local_airport
|
|
v-list-tile-title Airports
|
|
|
|
v-content
|
|
v-toolbar(color='grey lighten-3', flat, dense)
|
|
v-breadcrumbs.pl-0(divider='/')
|
|
v-breadcrumbs-item Universe
|
|
v-breadcrumbs-item Galaxy
|
|
v-breadcrumbs-item Solar System
|
|
v-breadcrumbs-item Planet Earth
|
|
|
|
v-divider
|
|
v-layout(row)
|
|
v-flex(xs10)
|
|
v-toolbar(color='grey lighten-4', flat, :height='90')
|
|
div
|
|
.headline.grey--text.text--darken-3 {{title}}
|
|
.caption.grey--text.text--darken-1 {{description}}
|
|
.contents
|
|
slot(name='contents')
|
|
v-flex(xs2, fill-height)
|
|
v-toolbar(color='grey lighten-4', flat, :height='90')
|
|
div
|
|
.caption.grey--text.text--lighten-1 Last edited by
|
|
.body-2.grey--text.text--darken-3 John Doe
|
|
.caption.grey--text.text--darken-1 Monday at 12:34 PM
|
|
v-spacer
|
|
v-icon edit
|
|
v-list.grey.lighten-3(dense)
|
|
v-subheader.pl-4 Table of contents
|
|
v-list-tile
|
|
v-list-tile-avatar: v-icon chevron_right
|
|
v-list-tile-title Introduction
|
|
v-list-tile
|
|
v-list-tile-avatar: v-icon chevron_right
|
|
v-list-tile-title Cities
|
|
v-list-tile(inset)
|
|
v-list-tile-avatar: v-icon chevron_right
|
|
v-list-tile-title New York
|
|
v-divider.my-2
|
|
v-subheader.pl-4 Metadata
|
|
v-list-tile
|
|
v-list-tile-avatar: v-icon chevron_right
|
|
v-list-tile-title Test
|
|
v-list-tile
|
|
v-list-tile-avatar: v-icon chevron_right
|
|
v-list-tile-title Test
|
|
v-list-tile
|
|
v-list-tile-avatar: v-icon chevron_right
|
|
v-list-tile-title Test
|
|
nav-footer
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
title: {
|
|
type: String,
|
|
default: 'Untitled Page'
|
|
},
|
|
description: {
|
|
type: String,
|
|
default: ''
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
|
|
</style>
|