Divider

You're browsing the documentation for an old version of MoonShine. Consider upgrading your project to MoonShine 2.x.

Sections
- Basics
- Text divider

# Basics

The moonshine::divider component allows you to create a stylized content divider

{{ fake()->text(100) }}
<x-moonshine::divider /> 
{{ fake()->text(100) }}

{{ fake()->text(100) }}
<x-moonshine::divider />
{{ fake()->text(100) }}

Laboriosam officiis illum natus repellat ea ut. In aperiam minus sed et.

Optio aut veritatis eum voluptas perspiciatis. At et dolor nostrum voluptate doloremque.

# Text divider

You can use text as a separator, for this you need to specify the text in the label parameter

{{ fake()->text(100) }}
<x-moonshine::divider label="Divider" /> 
{{ fake()->text(100) }}

{{ fake()->text(100) }}
<x-moonshine::divider label="Divider" />
{{ fake()->text(100) }}

Et est nam dignissimos iste dicta quos sed ea. Ab harum non saepe in magnam aspernatur est.

Divider

Adipisci error odio molestiae atque quis. Cumque natus et in ex. Omnis nobis non ratione.

The centered parameter allows you to center the text

{{ fake()->text(100) }}
<x-moonshine::divider label="Divider" :centered="true" /> 
{{ fake()->text(100) }}

{{ fake()->text(100) }}
<x-moonshine::divider label="Divider" :centered="true" />
{{ fake()->text(100) }}

Debitis est dolor qui quo itaque sed iure. Sunt vel eaque aut cupiditate autem sed.

Divider

Quisquam impedit itaque aut est sit. Tempore est rerum quos consequatur.