Warning: include(1.x/nav-section.php): failed to open stream: No such file or directory in /ip/iucommsg/wwws/_php/nav-section.php on line 2

Warning: include(): Failed opening '1.x/nav-section.php' for inclusion (include_path='.:/ip/iucommsg/wwws:/ip/pagriet/lib:/ip/iucommsg/wwws/_includes:/ip/iucommsg/wwws/_shared-sections:/ip/iucommsg/wwws/_php') in /ip/iucommsg/wwws/_php/nav-section.php on line 2

Panel

Panel example

Panel Heading (h2)

This is the panel text

Show/hide markup
<div class="panel">
    <h2 class="title">Panel Heading (h2)</h2>
    <p>This is the panel text</p>
</div>

Panel with optional button

Panel Heading (h2)

This is the panel text

Call to action
Show/hide markup
<div class="panel">
    <h2 class="title">Panel Heading (h2)</h2>
    <p>This is the panel text</p>
    <a href="#" class="button">Call to action</a>
</div>

Panels in a grid

Panel Heading (h2)

This is the panel text

Second Heading (h2)

This is text for panel two

Show/hide markup
<div class="grid halves">
    <div class="grid-item">
        <div class="panel">
            <h2 class="title">Panel Heading (h2)</h2>
            <p>This is the panel text</p>
        </div>
        

    </div>

    <div class="grid-item">
        <div class="panel">
            <h2 class="title">Second Heading (h2)</h2>
            <p>This is text for panel two</p>
        </div>
        

    </div>

</div>

Interactive Panels

Interactive panels enable you to have both a headline and either a subhead or a sentence or two of content. However, only a header is required. The entire panel is clickable and can link to internal or external pages.

Interactive panel example

Show/hide markup
<div class="panel--interactive">
    <a href="#">
    <h2 class="title">Panel Heading (h2)</h2>
    <p>This is the panel-button text</p>
    </a>
</div>