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

Quod minus rem quas quasi numquam unde eum. Amet ut non suscipit magni quia optio.

Et voluptatem minus et et. Neque quaerat repellendus ullam in quia est sit consectetur.

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

Aut temporibus nobis numquam. In ratione non nesciunt. Consequatur sed commodi sit possimus.

Divider

Eius deleniti aut aliquid aut excepturi optio. Quidem in est molestiae et.

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

Qui fugit doloribus possimus in reprehenderit. Et odio ducimus accusamus nulla sed voluptatibus.

Divider

Aut reprehenderit qui eaque ad illum. Deserunt quibusdam suscipit id et culpa.