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 fileUsage
Usage example
We’re here to help
Get in touch with our support team for help or more information.
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.
How it works
Learn about how Funding Circle brings investors and borrowers together.
We’re here to help
Do you have more questions? Get in touch with our support team for help or more information.
Need help? Give us a call.
Loan calculator
Use our loan calculator to see how much your business loan could cost.
How it works
Learn about how Funding Circle brings investors and borrowers together etc etc etc etc etc etc etc etc.
<!-- 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>