Panel

const Panel = require('gitbook-styleguide/lib/Panel');

Example

Title

Body of the panel
<Panel>
<Panel.Heading title="Title" />
<Panel.Body>
Body of the panel
</Panel.Body>
</Panel>

Styles

Title

Body of the panel
<Panel style="danger">
<Panel.Heading title="Title" />
<Panel.Body>
Body of the panel
</Panel.Body>
</Panel>

With a table

Title

TitleUpdated
PHP1 month ago
JS1 month ago
<Panel>
<Panel.Heading title="Title" />
<Table>
<thead>
<tr>
<th>Title</th>
<th>Updated</th>
</tr>
</thead>
<tbody>
<tr>
<td>PHP</td>
<td>1 month ago</td>
</tr>
<tr>
<td>JS</td>
<td>1 month ago</td>
</tr>
</tbody>
</Table>
</Panel>

With a list group

<Panel>
<Panel.Heading title="Title" />
<ListGroup>
<ListGroup.Item active={true}>Account</ListGroup.Item>
<ListGroup.Item>Profile</ListGroup.Item>
<ListGroup.Item>Notifications</ListGroup.Item>
</ListGroup>
</Panel>