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

Consequatur est id aperiam nihil modi quod. Et consequatur suscipit rerum et dignissimos.

Doloribus nam quis officia. Totam maxime est reprehenderit. Veniam ad est cum laudantium.

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

Sed nostrum consectetur eos ea veritatis. Dignissimos et rem explicabo dolor rerum iste rerum.

Divider

Sequi sed et iste tempore. Harum qui ut quas optio. Maxime qui repudiandae in tempora.

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

Inventore velit cumque magni sed. Eligendi aut alias itaque temporibus ab.

Divider

Exercitationem est voluptatem ut nobis et. Eos explicabo maiores qui nulla et.