Jump to main content

Layouts

Customising your app layout.


File Contents

In its purest form, a layout component is just a Svelte component which contains a single <slot> element. Below is the built-in layout component which is used if you don't insert your own one.

<slot/>

By decorating your layout component with other elements, you can have 'fixed sections' which are unchanged between page loads. Navigation bars, headers, footers; that sort of thing. While more advanced layouts are not currently supported, you can still use Svelte writables in order to have state which can be imported and affected by child components.


File Location

my_project_name
├── manage.py
├── dxsvelte.py
├── package.json
├── tsconfig.json
├── my_project_name
│   └── layout.svelte       <-- Create your layout component here
└── ...