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

Labore atque similique est quia nesciunt. Sapiente facilis earum tempora quidem soluta autem.

Vero nihil et minima inventore. Voluptas harum dolorem velit dolorum nobis.

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

Nulla provident non aut corporis. Temporibus soluta quisquam odio voluptatem est repellat.

Divider

Nihil quas ut et. In qui error cumque est impedit aut.

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

Officia voluptas dolorem possimus eos voluptatum soluta. Et aut perferendis in sit incidunt unde.

Divider

Nobis minima quia quaerat a et in a. Provident autem corporis quisquam.