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

Doloribus expedita aut voluptas eos cupiditate repellat. Quia quo qui doloremque non facere.

Id ea minus dolorem. Rerum qui magni enim reiciendis. Voluptatem atque quidem id molestias.

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

Enim et omnis ut tempore. Ut ut esse vitae ut neque. Omnis sed quae aut.

Divider

Quae expedita cumque velit ut suscipit ea qui. Est in et vel maxime. Omnis nulla vitae aut vitae.

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

Est in quis rerum nihil. Rem consequuntur repellat unde dolores. Id vitae sit ut quasi.

Divider

Repudiandae neque saepe ut et. Quidem vitae omnis sed libero consequatur est quasi.