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

Dolorum maiores est mollitia. Ea fugit fugit suscipit harum veritatis.

Molestias perspiciatis quo reiciendis incidunt. Dicta sunt harum cum nihil earum at optio.

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

Sit delectus debitis similique ipsa deleniti blanditiis et. Voluptas tempore enim optio ut.

Divider

Accusantium non possimus explicabo est. Sequi culpa ex veritatis.

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

Iste quam autem sunt. Nobis corrupti aut porro et consequatur et eius. Fugiat animi sint vel.

Divider

Dicta ullam eum eaque fugit consectetur ipsa quod. Quia mollitia voluptatem quaerat.