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) }}
Sequi qui hic at. Dolorem occaecati esse autem ut et. Eius tempora modi dolore deleniti atque.
Et sit quia consequatur ullam cum. Unde sunt perferendis quia quis excepturi aut.

# 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) }}
Maxime est nihil culpa enim quasi et id. Aut deserunt quasi quis in modi illum.
Divider
Quia aut temporibus animi mollitia. Corrupti deserunt qui eos rerum nemo aperiam recusandae.

The centered parameter allows you to center the text

{{ fake()->text(100) }}
<x-moonshine::divider label="Divider" :centered="true" />
{{ fake()->text(100) }}
Enim et in tempore. In eos necessitatibus ut dolorum sunt dolor. Et tempora officia fuga.
Divider
Distinctio magni et repellat delectus tempore sed accusamus. Non eos aut amet rerum.