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

Ea excepturi nihil hic consectetur laboriosam. Quo pariatur vitae a aut velit tenetur laboriosam.

Itaque tempore accusamus autem voluptatem. Blanditiis ut quia fugiat tenetur impedit quibusdam.

# Text separator

You can use text as a separator. To do 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) }}

Saepe architecto laborum ut corporis cum sint eaque. Dolor necessitatibus culpa et.

Divider

Qui vitae qui aut doloremque quos odio laborum quia. Amet ut consequuntur impedit.

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

Rerum accusamus nam delectus animi sunt. Voluptatem eum quis eum nisi est ullam aut.

Divider

Molestiae aspernatur id nam pariatur. Iusto voluptatem quae illum sequi.