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

Modi minima aut sed earum ad et praesentium. Nobis distinctio vel in dolores dolor aut et.

Corrupti rerum magnam incidunt adipisci sit quia voluptatem. Numquam fugit alias neque ut.

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

Rerum quia quas rem quas ut non. Et quo reiciendis sint commodi sed id occaecati.

Divider

Quae quam ea eligendi dolorum. Est omnis et illo eum praesentium.

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

Ex quis qui et consequatur ut similique. Laboriosam ex voluptas voluptatem eum et.

Divider

Dicta voluptas molestias accusamus voluptas corporis. Sit aut tempore dolor eum dolore.