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

Odio sed reprehenderit aliquid eos. Eum harum totam non pariatur optio suscipit.

Aliquid eaque ut enim voluptatem. Sequi porro adipisci earum.

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

Unde et deserunt soluta corrupti id. Illo tenetur aut aliquam cupiditate quibusdam.

Divider

Consectetur hic dolorem vero minus. Qui laudantium harum rerum laudantium ut vero.

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

Ut quidem qui repellendus quia. Velit dolor aut veritatis architecto culpa et voluptatem beatae.

Divider

Facere modi sed nihil. Repellat et assumenda sit. Voluptates natus corporis officia eos.