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) }}
Est quos eius alias assumenda voluptas doloribus laudantium. Quos reprehenderit autem dolor.
Ullam eius aut dicta tempore numquam. Fuga tempora quia molestiae ad.

# 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) }}
Ut qui recusandae sit iusto quisquam aut. A eaque voluptatibus aliquid dolorum eos.
Divider
Dolor occaecati autem eos non nemo. Et et possimus sequi corporis et reiciendis qui.

The centered parameter allows you to center the text

{{ fake()->text(100) }}
<x-moonshine::divider label="Divider" :centered="true" />
{{ fake()->text(100) }}
Reprehenderit rem provident eum quasi. Saepe id similique mollitia cumque cumque est.
Divider
Eum nihil molestiae quae quia ut sit qui. Placeat earum pariatur quas asperiores vel tempora.