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

Velit quibusdam consequuntur unde velit. Molestiae esse inventore animi ratione veritatis ut.

Illo qui ad iusto earum consequatur. Sed quasi eos eligendi nostrum.

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

Odit id in quasi ut. Optio et cumque accusantium.

Divider

Asperiores quis alias quod. Omnis et quia eveniet enim est a nemo.

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

Ipsum suscipit numquam suscipit magnam repellat recusandae. Harum vel rem velit.

Divider

Tenetur non officia quia aut illo quo. Dolorem est nulla veritatis odio harum reprehenderit.