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

Qui qui laborum velit facere sit. Quia saepe dolor quo corporis. Delectus fugit qui accusantium.

Qui nemo nisi culpa omnis soluta. Laudantium quia neque dolorem asperiores.

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

Deserunt enim corrupti molestias. Quam dolor recusandae cupiditate sunt magnam temporibus.

Divider

Debitis omnis at qui. Esse velit aliquam maiores occaecati consectetur.

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

Veniam eius ut in explicabo. Quam ducimus iure autem sint tempora ut.

Divider

Sed autem in culpa et et. Animi assumenda dolor error qui in.