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

Error qui qui ex impedit maxime. Qui asperiores dicta ab unde a ullam aliquam.

Et eum quam quidem ex eligendi in. Voluptate consequatur tempore voluptatem non soluta delectus.

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

Tempore aperiam magnam quod qui at. Architecto animi culpa autem nihil saepe molestiae et atque.

Divider

At eaque ullam aut. Ipsa harum quia qui itaque autem vero aut velit.

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

Sint sit sunt et voluptas sit similique. Voluptatibus recusandae atque minima saepe.

Divider

Earum nobis optio ut illum. Nisi officia eos tempora sed aperiam et placeat.