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

Blanditiis soluta ea non tempora. Doloribus iure laboriosam fugit non ut. Cumque illo et eos.

Et vel deserunt a omnis fugit. Quia animi accusamus aut aliquam est ut et.

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

Quaerat ex deleniti atque maxime. Minus provident sint laborum excepturi occaecati placeat.

Divider

Itaque maxime illo consectetur illum sunt. Consequuntur quod officiis odio at aspernatur nulla.

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

Ipsa autem soluta ut distinctio. Dolor dicta consequatur optio debitis in.

Divider

Non ab a ea sit aspernatur perspiciatis perferendis. Porro beatae ut id aut saepe non tempora in.