Example Feature
Hey there this is a feature widget for featuring things.
Learn more
New web
Web pattern library, style and technical reference
Content Components
Landing Page - Feature Widgets
This style can be applied using the Landing Page - Feature Widgets paint layout (asset #362602). Create a folder containing link assets, the asset should be linked to the relevant asset, the title is the name of the link asset, the description is specified in the dcterms.description metadata field. The paint layout will automatically adapt to fit up to four feature widgets. An optional title can be included when nesting the content, this will display as an underlined H2.
Setup
| Asset type | Folder containing link assets |
|---|---|
| Paint layout | #362602 - Landing Page - Feature Widgets |
Available Variables
| Variable Name | Type | Example | Default |
|---|---|---|---|
| title optional |
text | More information | - none - |
Example
More information
Code Example
<h2 class="underlined">More information</h2>
<div class="grid-content grid-4-column">
<div class="grid-block">
<a href="#" class="uon-feature-block">
<img src="//placehold.it/400x400" alt="Example Feature">
<div class="content">
<h3>Example Feature</h3>
<p>Hey there this is a feature widget for featuring things.</p>
<p><span class="more-link">Learn more</span></p>
</div>
</a>
</div>
...
</div>