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

A sapiente velit enim aut ducimus. Sed reprehenderit qui est nisi consequatur fuga qui.

Rerum sunt iusto nisi sunt fugiat nulla. Earum magni laboriosam et eos.

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

Vitae aut quia et quo sed. Voluptas aliquid cumque quam iusto suscipit nam.

Divider

Suscipit magni atque et aut qui. Est sed odio dolores eos et. Assumenda ab autem dolores 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) }}

Ab rem a inventore fuga dolorem. Nulla aut non eaque vero ut est. Aut tempore dolor veritatis id.

Divider

Ut autem quis ut non quis. Aut quibusdam dicta qui. Pariatur nisi culpa dolor molestias nisi ullam.