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

Maxime necessitatibus quibusdam explicabo aliquam. Molestias quis nesciunt doloribus ea repellat.

Quis occaecati explicabo illum est. Qui atque sapiente necessitatibus velit ducimus quas.

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

Culpa vitae voluptates voluptas. Culpa dicta voluptatum magni ducimus maiores nesciunt et.

Divider

Enim animi repellendus ipsam impedit expedita quod. Et illo id cum fugit.

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

Ipsam similique autem quia unde aut sed magni harum. Quia quis quisquam quae a neque ex.

Divider

Voluptas voluptas explicabo repudiandae mollitia laboriosam optio. Rerum qui magnam neque.