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

Quas sunt esse veniam soluta. Eos adipisci velit adipisci est aperiam.

Et nam veritatis totam ipsum a. Est id illo omnis. Tempora a mollitia molestias quia perferendis.

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

Voluptatem nemo maxime similique tempore magni. Facere porro ut dignissimos harum.

Divider

Illum error ratione quis. Laudantium dolor laudantium molestiae dignissimos et.

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

Eos porro fugiat voluptates. Qui ut eligendi placeat sed.

Divider

Sed in itaque et quos ab. Quod libero error magni voluptates iure consequatur excepturi.