Panel

Panels are a compositional container component that allows you to wrap and theme groups of content.

npm version

npm install @vrembem/panel
@import "@vrembem/panel/index";

panel

Panel header

Aliquam vitae sapien vehicula, viverra massa non, gravida lacus. Nam facilisis dictum felis, quis lacinia elit rhoncus eget. Donec id pellentesque lorem.

Item One
Item Two
Item Three
<div class="panel">
  <div class="panel__section">
    <h3 class="panel__title">...</h3>
    ...
  </div>
</div>

<div class="panel">
  <div class="panel__section">
    ...
  </div>
  <div class="panel__section">
    ...
  </div>
  <div class="panel__section">
    ...
  </div>
</div>

panel__header + panel__footer

Panel header

Aliquam vitae sapien vehicula, viverra massa non, gravida lacus. Nam facilisis dictum felis, quis lacinia elit rhoncus eget. Donec id pellentesque lorem.

<div class="panel">
  <div class="panel__header">
    <h3 class="panel__title">...</h3>
  </div>
  <div class="panel__section">
    ...
  </div>
  <div class="panel__footer">
    ...
  </div>
</div>