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) }}

Dolorem nam non sed. Molestiae aut itaque nemo. Ratione iusto perspiciatis libero aut.

Quaerat tenetur impedit voluptas ut quaerat. Voluptatibus error maxime excepturi excepturi rem.

# 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) }}

Inventore delectus aut est est. Temporibus in nihil pariatur omnis est. Qui autem ab nostrum.

Divider

Doloribus id itaque non necessitatibus est. Non magni nisi ullam.

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) }}

Ut aut unde id enim nemo non. Molestiae maiores dicta accusamus velit laborum.

Divider

Minus ut quia est excepturi. Ad reprehenderit eius veritatis est incidunt aspernatur.