mirror of
https://github.com/slidevjs/slidev.git
synced 2026-09-14 20:46:32 +08:00
80c8d42485
Co-authored-by: Anthony Fu <github@antfu.me>
949 B
949 B
Writing Layouts
Please read first.
To create a custom layout, simply create a new Vue file in the layouts directory:
your-slidev/
├── ...
├── slides.md
└── layouts/
├── ...
└── MyLayout.vue
Layouts are Vue components, so you can use all the features of Vue in them.
In the layout component, use <slot/> (the default slot) for the slide content:
<template>
<div class="slidev-layout default">
<slot />
</div>
</template>
You can also have named slots for more complex layouts:
<template>
<div class="slidev-layout split">
<div class="left">
<slot name="left" />
</div>
<div class="right">
<slot name="right" />
</div>
</div>
</template>
And then use it with .