Divider
A thin horizontal line used to separate sections and group content, with optional text to display in the middle.
Showcase
This is some introduction to something
This is the 1st section. Have fun
This ends our test
Source
<p>This is some introduction to something</p>
<Divider text="Section 1" />
<p>This is the 1st section. Have fun</p>
<Divider text="Conclusion" />
<p>This ends our test</p>
<Divider />Properties #
Functional Properties
Name | Default | Type | Description |
|---|---|---|---|
text | null | string | Adds a text to the middle of the line. |
... | any | Everything else will be passed to the underlying <hr> element. |
SCSS Variables #
Name | Description | Default |
|---|---|---|
$light-contrast | The color of the horizontal rule | #DDDDDD |
$background | The background color of the text. | #FFFFFF |