<Layout> component

Vulmix allows you to create multiple layouts for your application.

Creating a layout

Let's say that you want to create a layout for the "about" page. Simply create an about.vue file inside the layouts folder:

Inside layouts/about.vue, create your HTML layout around a <slot /> tag:

<template>  <MyNavbar />  <slot />  <MyFooter /></template>

Using the <Layout> component

In the pages/about.vue, wrap the content inside a <Layout> component, passing the layout name as a prop:

<template>  <Layout name="about">    That's my About page  </Layout></template>

Your page will inherit all the layouts/about.vue components and styles.