Skip to main content

Divider

A Divider means a separation between tow components which has to orientation horizontal and vertical

img

Usage​

import React from 'react'
import { Divider } from 'qdm-component-library'

function App() {
  return <Divider />
}
export default App

Reference​

Props​

here all the list of Props you can use for Divider Component

label​

props for adding the Divider string by default it will be in none

import React from 'react'
import { Divider } from 'qdm-component-library'

function App() {
  return <Divider label="Hello" />
}
export default App

color​

props for adding the Divider color string by default it will be in #a7a7a7

import React from 'react'
import { Divider } from 'qdm-component-library'

function App() {
  return <Divider name="Divider" color="#fafafa" />
}
export default App

textWidth​

this props you can adjust space of the text on Divider

import React from 'react'
import { Divider } from 'qdm-component-library'

function App() {
  return <Divider label={'label'} textWidth={50} />
}
export default App

textColor​

props give addition props to change the text color

textColor defalut props black#

borderColor​

props give addition props to change the border color

borderWidth​

props give addition props to change the border width

import React from 'react'
import { Divider } from 'qdm-component-library'

function App() {
  return (
    <Divider
      label={'label'}
      textWidth={50}
      textColor={'red'}
      borderColor={'green'}
      borderWidth={2}
    />
  )
}
export default App

marginAll​

props for margin for all the four sides of the Body by default it none number marginAll defalut props none

marginLR​

props for margin for left and right sides of the Body by default it none number marginLR defalut props none

marginTB​

props for margin for top and bottom sides of the Body by default it none number marginTB defalut props none

inLineStyles​

props give addition props to the Divider element type Object