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

Vero maiores aliquid est velit placeat illum quia. Ut quam non vel architecto eum ad.

Qui possimus fugiat fugiat aut. Alias vitae qui commodi. Nulla et porro quia.

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

Quam atque perferendis inventore harum sint. Sed ut unde nam cum harum illo quis.

Divider

Commodi in in sunt delectus minus assumenda. Eos qui omnis reiciendis sint enim.

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

Et ut nihil optio et. Omnis dolore et et.

Divider

Enim aut nostrum ut vel minima assumenda. Itaque corporis explicabo dolor voluptatem maxime.