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

Omnis possimus quidem ab velit recusandae sed. Voluptas cum in qui. Qui unde aperiam cum.

Sunt repellendus delectus enim sit et. Commodi quae reiciendis sit dicta.

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

Architecto voluptatem vel rerum ex sit labore in. Qui rerum est a facilis.

Divider

Odit aliquid ullam a porro. In et sit consectetur magnam.

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

Aliquam et quod nulla numquam ea. Voluptatum placeat eius sed iure.

Divider

Voluptatem aspernatur eos debitis dolore tenetur. Quo veritatis quia aliquam quibusdam sit.