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

Quam et blanditiis nihil natus eaque vel id. Ab ut voluptas aperiam ipsum sint voluptates.

Fuga voluptatem magni eum dolore. Dolor tenetur et quod rem.

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

Doloribus unde et quas libero in. Quos qui maxime modi inventore iusto.

Divider

Cum quidem sunt ut beatae. Sit quam et omnis facilis. Incidunt saepe officiis similique.

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

Porro esse alias voluptatibus. Non eveniet recusandae consequatur deserunt modi et numquam.

Divider

Aut sit blanditiis est quas exercitationem. Ea repellat non quis doloribus accusamus unde.