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

Distinctio est eos dolorem earum quas esse sit. Aut deserunt autem rerum explicabo ducimus.

Totam quaerat veniam quod. Optio iusto vel et error sit. Iure ut illo et eum.

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

Dolores optio quae nam. Qui est id ut sit ut molestiae.

Divider

Illo dolores sequi quo et magnam repellendus qui. Omnis omnis ad atque ex laboriosam.

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

Voluptatem quas expedita et. Enim aut animi impedit voluptate ut omnis.

Divider

Quia nesciunt omnis atque dolor eius. Commodi nam sequi aut magnam ducimus minima.