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) }}
Sit laboriosam est architecto itaque recusandae. Cum aut veritatis consequatur et quae veritatis.
Dolor voluptas corrupti vel dicta est optio ea. Sit nostrum est sequi rerum dolorum iusto officiis.

# 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) }}
Impedit deserunt eius nam illo quo. Cumque reiciendis at omnis corrupti. Et sit quas dolor.
Divider
Dolore ratione repellat totam. Et consequatur quia repellat ea.

The centered parameter allows you to center the text

{{ fake()->text(100) }}
<x-moonshine::divider label="Divider" :centered="true" />
{{ fake()->text(100) }}
Fugit exercitationem ea veritatis et velit ut. Ipsam dolorum ea quia.
Divider
Officia omnis totam ex. Doloribus eius quaerat est et explicabo totam qui blanditiis.