Application content

The application content component is the main <main> region of the application. It accepts a layout prop that controls the maximum width and spacing of the content. The selected layout is also published back into the FluxApplication injection, so other components such as Application top can adjust their tab bar width to match.

The available layouts are default, dashboard, full, medium and narrow.

Props

layout?: FluxApplicationLayout
The layout mode used to constrain the width and padding of the content area.
Default: default

Slots

default
The content of the application.

Snippet

FluxApplicationContent.vue

<template>
    <FluxApplicationContent layout="default">
        <!-- Your application content here. -->
    </FluxApplicationContent>
</template>

<script
    setup
    lang="ts">
    import { FluxApplicationContent } from '@flux-ui/application';
</script>