JavaScript import
import SkeletonText from 'progressive-web-sdk/dist/components/skeleton-text'
SCSS import
@import 'node_modules/progressive-web-sdk/dist/components/skeleton-text/base';
Props table
Name & Description | Type | Default |
---|
className Adds values to the class attribute of the root element. | string | none |
lineClassName Adds values to the class attribute of the text line elements. | string | none |
lines Specifies the number of lines in the skeleton. | number | 1 |
sizeSpecifies the font-size (effectively the height) of the skeleton elements,
in any valid dimension type. | string | none |
style Specifies any inline styles to be applied to the skeleton. | object | {} |
type Specifies the element type to be constructed. | string | 'span' |
width Specifies the width of the skeleton elements' children. | string | none |
Basic example
With five lines of heading text
<SkeletonText type="h2" lines={5} width="50%" />
With 3 Lines of text with custom line height
<SkeletonText lines={3} width="50%" style={{lineHeight: '2em'}} />