mdx-deck/examples/layouts/deck.mdx

import {
  Invert,
  Split,
  SplitRight,
  Horizontal,
  FullScreenCode,
} from '@mdx-deck/layouts'

# Hello!

---

<Invert>

## Invert Layout

</Invert>

---

<Split>

![](https://source.unsplash.com/random/768x2048?brooklyn)

## Split Layout

</Split>

---

<SplitRight>

![](https://source.unsplash.com/random/768x2048?brooklyn)

## SplitRight Layout

</SplitRight>

---

<Horizontal>

## Horizontal Layout

![](https://source.unsplash.com/random/768x2048?brooklyn)

![](https://source.unsplash.com/random/768x2048?brooklyn)

</Horizontal>

---

<FullScreenCode>

```jsx
<Button>FullScreenCode Layout</Button>
```

</FullScreenCode>