mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-23 14:15:13 +00:00
Add example for custom-layout
This commit is contained in:
parent
b870a7206e
commit
afd7eb86e6
21
examples/custom-layout/layouts/dark.vue
Normal file
21
examples/custom-layout/layouts/dark.vue
Normal file
@ -0,0 +1,21 @@
|
|||||||
|
<template>
|
||||||
|
<div class="dark">
|
||||||
|
<nuxt/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.dark {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
min-height: 100%;
|
||||||
|
background: black;
|
||||||
|
color: white;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
.dark a {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
</style>
|
@ -1,8 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<nuxt-container>
|
<div>
|
||||||
<img src="logo.png"/>
|
<img src="logo.png"/>
|
||||||
<nuxt/>
|
<nuxt/>
|
||||||
</nuxt-container>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
9
examples/custom-layout/layouts/error.vue
Normal file
9
examples/custom-layout/layouts/error.vue
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
<template>
|
||||||
|
<h1>Custom error page</h1>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: ['error']
|
||||||
|
}
|
||||||
|
</script>
|
@ -7,6 +7,7 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
|
layout: 'dark',
|
||||||
data ({ req }) {
|
data ({ req }) {
|
||||||
return {
|
return {
|
||||||
name: req ? 'server' : 'client'
|
name: req ? 'server' : 'client'
|
Before Width: | Height: | Size: 2.0 KiB After Width: | Height: | Size: 2.0 KiB |
Loading…
Reference in New Issue
Block a user