Divider

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

# Basics

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

{{ fake()->text(100) }}
<x-moonshine::divider />
{{ fake()->text(100) }}
Sunt quae error explicabo itaque harum. Et pariatur distinctio modi dicta est.
Voluptas aut voluptas delectus. Voluptatum ut eveniet praesentium qui illo ad.

# 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) }}
Non quibusdam cumque reprehenderit libero quidem. Veniam eos eos est.
Divider
Aliquam corporis fuga aut sequi iusto quidem quia. Autem architecto vel nobis nulla.

The centered parameter allows you to center the text

{{ fake()->text(100) }}
<x-moonshine::divider label="Divider" :centered="true" />
{{ fake()->text(100) }}
Inventore rem iusto minima adipisci voluptatum qui tempore. Maxime voluptas doloribus qui et.
Divider
Veritatis sunt distinctio voluptate eos veritatis. Enim voluptas placeat dolorum ut.