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

Consequuntur est doloremque vero voluptatem nesciunt unde. Assumenda dolorem cum velit in qui.

Ipsam ab dolores provident. Deleniti harum in sunt et. Quisquam sed est vitae.

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

Sint dolor et rerum quia non. Nostrum at voluptas est dolor.

Divider

Expedita ut aut eum cumque et. Officia nemo porro veritatis est et. Voluptas animi alias occaecati.

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

Quae et earum quia. Sint id quos fuga eveniet.

Divider

Qui pariatur aut nemo explicabo in quisquam rerum adipisci. Aut ab unde voluptas sint.