Divider

New

Π ΠΎΠ·Π΄Ρ–Π»ΡŽΠ²Π°Ρ‡ ΠΊΠΎΠ½Ρ‚Π΅Π½Ρ‚Ρƒ Π· тСкстом, Π³ΠΎΡ€ΠΈΠ·ΠΎΠ½Ρ‚Π°Π»ΡŒΠ½ΠΈΠΉ/Π²Π΅Ρ€Ρ‚ΠΈΠΊΠ°Π»ΡŒΠ½ΠΈΠΉ.

Import

import { Divider } from '@brutal-ui/react';

Horizontal

Content above

Content below

<p>Content above</p>
<Divider />
<p>Content below</p>

With Label

OR
CONTINUE WITH
<Divider label='OR' />
<Divider label='CONTINUE WITH' />

Vertical

Left Section
Middle Section
Right Section
<div className='flex items-center'>
  <div>Left</div>
  <Divider orientation='vertical' />
  <div>Right</div>
</div>

Thickness

<Divider thickness='thin' />
<Divider thickness='medium' />
<Divider thickness='thick' />

Props

PropTypeDefaultDescription
orientationstring"horizontal"horizontal | vertical
labelstring-Optional label
thicknessstring"medium"thin | medium | thick