Page Closer

Use to provide a final set of prompts to the user if they haven't taken any other action on the page.

Description

This component sits just before the footer. It should provide links to popular pages or articles, and give the user contact information so that they may easily follow up on any queries they have.

There are two variants. The first is a 3 column layout, the other is a 4 column layout. An article component can sit in the last column of either variant (the article component itself is not built yet).

Activate Sass component

In order to have the styling of this component available, you need to include it in your project. After including the Radius library in your main ./index.scss file, add this snippet:

@include radius-component-page-closer;

Link to Abstract/Sketch file

Download Sketch / Abstract file

Usage

Usage example

We’re here to help

Get in touch with our support team for help or more information.

0800 048 2467

Need help? Give us a call.

Loan calculator

Use our loan calculator to see how much your business loan could cost etc etc etc etc etc etc etc.

Use the loan calculator

How it works

Learn about how Funding Circle brings investors and borrowers together.

See how it works


We’re here to help

Do you have more questions? Get in touch with our support team for help or more information.

0800 048 2467

Need help? Give us a call.

Loan calculator

Use our loan calculator to see how much your business loan could cost.

Use the loan calculator

How it works

Learn about how Funding Circle brings investors and borrowers together etc etc etc etc etc etc etc etc.

See how it works 
<!-- 3 column -->
<section class="page-closer page-closer--3-col">
  <div class="page-closer__inner">
    <div class="page-closer__grid">
      <div class="page-closer__contact"></div>
      <div class="page-closer__links">
        <div class="page-closer__nav-suggestion">
          <div class="text-block text-block--xsmall">
            <!-- text block content -->
          </div>
          <a class="cta-link page-closer__link--bottom" href="#"></a>
        </div>
        <div class="page-closer__nav-suggestion">
          <div class="text-block text-block--xsmall">
            <!-- text block content -->
          </div>
          <a class="cta-link page-closer__link--bottom" href="#"></a>
        </div>
      </div>
    </div>
  </div>
</section>

<!-- 4 column -->
<section class="page-closer">
  <div class="page-closer__inner">
    <div class="page-closer__grid">
      <div class="page-closer__contact"></div>
      <div class="page-closer__links">
        <div class="page-closer__nav-suggestion">
          <div class="text-block text-block--xsmall">
            <!-- text block content -->
          </div>
          <a class="cta-link page-closer__link--bottom" href="#"></a>
        </div>
        <div class="page-closer__nav-suggestion">
          <div class="text-block text-block--xsmall">
            <!-- text block content -->
          </div>
          <a class="cta-link page-closer__link--bottom" href="#"></a>
        </div>
        <div class="page-closer__nav-suggestion"></div>
      </div>
    </div>
  </div>
</section>