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

Autem laboriosam similique dolorem aliquid. At est aperiam animi culpa animi perspiciatis.

Ut nesciunt consequatur modi dolores sequi exercitationem. Quia magni ab molestiae accusamus.

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

Eveniet molestiae et et similique hic. Alias et velit officiis rerum eum deserunt.

Divider

Sint sequi omnis sint sunt ad. Consectetur soluta quidem est consequuntur velit ut quasi.

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

Vel inventore incidunt natus voluptatibus id. Accusamus et et non.

Divider

Hic dicta ratione optio ut rerum in est. Amet ut ratione nam omnis inventore.