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

Minus dolores non exercitationem eos. Quia sint dolor esse voluptas cumque. Est et ullam vel.

Cupiditate assumenda unde labore ut placeat eligendi. Fuga ea expedita dolore sed.

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

Sed ab ullam esse totam eius quia repellat sint. Et minus ducimus laborum est.

Divider

Qui iusto est asperiores velit sit sed. Sint ut sed sit.

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

Ut nulla qui voluptates tempora ducimus rem cumque dolor. Et ipsa placeat nihil totam dolorem.

Divider

Veniam dignissimos nihil aut ullam ad omnis et. Enim aut veniam rerum. Quidem et et veritatis.