Divider

You're browsing the documentation for an old version of MoonShine. Consider upgrading your project to MoonShine 2.x.

# Basics

The moonshine::divider component allows you to create a stylized content divider

{{ fake()->text(100) }}
<x-moonshine::divider />
{{ fake()->text(100) }}
Qui libero incidunt voluptas. Et hic deserunt placeat adipisci fugit voluptas nam.
Totam adipisci omnis laudantium excepturi. Sed omnis harum tenetur ullam.

# 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) }}
Aut eius autem earum ut. Nam nulla earum illum. Eius id consequatur sed omnis.
Divider
Iure qui quia ad laudantium. Maiores qui rerum quasi distinctio quos iure dignissimos.

The centered parameter allows you to center the text

{{ fake()->text(100) }}
<x-moonshine::divider label="Divider" :centered="true" />
{{ fake()->text(100) }}
Totam quia inventore et. Iste autem nisi in vel qui aut. Sunt et fugit vero assumenda.
Divider
Adipisci aspernatur dolores et ut. Ullam asperiores modi nesciunt quis corporis earum ut.