!|nofox +layout|
astro
---
import LayoutContainer from "@nofox/layout/astro"
---
<LayoutContainer definition="!|astro +main footer| +">
<main>Main</main>
<header data-layout-child="astro">Header</header>
<footer>Footer</footer>
</LayoutContainer>
react
import LayoutContainer from "@nofox/layout/react"
export default () => (
<LayoutContainer definition="!|react +main footer| +">
<main>Main</main>
<header data-layout-child="react">Header</header>
<footer>Footer</footer>
</LayoutContainer>
)
solid
import LayoutContainer from "@nofox/layout/solid"
export default () => (
<LayoutContainer definition="!|solid +main footer| +">
<main>Main</main>
<header data-layout-child="solid">Header</header>
<footer>Footer</footer>
</LayoutContainer>
)
svelte
<script lang="ts">
import LayoutContainer from "@nofox/layout/svelte"
</script>
<LayoutContainer definition="!|svelte +main footer| +">
<main>Main</main>
<header data-layout-child="svelte">Header</header>
<footer>Footer</footer>
</LayoutContainer>
vue
<script setup lang="ts">
import LayoutContainer from "@nofox/layout/vue"
</script>
<template>
<LayoutContainer definition="!|vue +main footer| +">
<main>Main</main>
<header data-layout-child="vue">Header</header>
<footer>Footer</footer>
</LayoutContainer>
</template>
