Layout

Info Box

An info box displays contextual information.
View source
Some contextual information.
1
import {InfoBox} from '@coveord/plasma-react';
2


3
export default () => <InfoBox>Some contextual information.</InfoBox>;

Props

This component has no props.

Examples

Warning InfoBox
Be aware that this is a warning.
1
import {InfoBox} from '@coveord/plasma-react';
2


3
export default () => <InfoBox className="mod-warning">Be aware that this is a warning.</InfoBox>;
With collapsible content
Some contextual information

Some information about the current component.

Or some other piece of information

1
import {InfoBox, CollapsibleConnected} from '@coveord/plasma-react';
2


3
export default () => (
4
    <InfoBox className="py0">
5
        <CollapsibleConnected
6
            headerClasses="py2"
7
            id="info-box-collapsible"
8
            headerContent={<h6>Some contextual information</h6>}
9
            expandedOnMount
10
        >
11
            <div className="pb2">
12
                <p>Some information about the current component.</p>
13
                <p className="mt2">Or some other piece of information</p>
14
            </div>
15
        </CollapsibleConnected>
16
    </InfoBox>
17
);

No guidelines exist for InfoBox yet.

Create guidelines