@chantelle/text-container

0.1.4 • Public • Published

TextContainer

Use

TextContainer controls the spacing between children elements in a standardized way.

Installation

yarn add @chantelle/text-container

Usage

First, include the CSS in your HTML:

<link rel="stylesheet" href="node_modules/@chantelle/text-container/dist/styles.css">

Note: you can import the CSS directly into your project if your bundler supports it:

 import '@chantelle/text-container/dist/styles.css';

React Component

import { TextContainer } from '@chantelle/text-container';

ReactDOM.render(
  <TextContainer>
    <Heading>Headline</Heading>
    <p>Lorem ipsum dolor sit amet...</p>
    <p>Lorem ipsum dolor sit amet...</p>
    <p>Lorem ipsum dolor sit amet...</p>
    <p>Lorem ipsum dolor sit amet...</p>
  </TextContainer>,
  container
);

CSS API

To use the TextContainer component, add the .pl-textContainer to any element to apply the styles.

<div class="pl-textContainer"></div>
<div class="pl-textContainer pl-textContainer--loose"></div>

Readme

Keywords

none

Package Sidebar

Install

npm i @chantelle/text-container

Weekly Downloads

7

Version

0.1.4

License

MIT

Unpacked Size

5.34 kB

Total Files

7

Last publish

Collaborators

  • ctsd
  • blackakula