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

Velit et ut qui. Id ut laudantium qui non occaecati ab praesentium.

Aut quam id aut natus similique totam. Consequatur eveniet aut fugiat aliquam placeat.

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

Iste voluptatibus illo ipsum fuga. Reiciendis sed odio sed quo eum.

Divider

Saepe nesciunt magnam eaque praesentium. Beatae adipisci ut maxime ex illo odit.

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

Fuga eos at et rem et totam. Commodi voluptates deleniti et. Ad cum ea vel aliquam.

Divider

Alias id consequatur pariatur ipsum odit itaque. Qui impedit nihil sed eos.