This component is used within the @uol-widget-list-featured pattern to display important information in an numbered or unnumbered list.
If you are providing a text editor to allow your editors to populate the list content, you should ensure that only the following html is allowed:
<strong><em><sup><sub><a>The content should not allow the inclusion of or output of paragraph tags <p>, line breaks <b> or any other markup not in the above list.
The maximum character limit of of 400 (not including markup tags) should be enforced on content for each item.
<{{ 'ol' if type==='ordered' else 'ul role=list' }} class="uol-list-featured">
{% for item in items %}
<li class="uol-list-featured__item {{ 'uol-list-featured__item--ordered' if type==='ordered' }}" {{ 'role=listitem' if type!=='ordered' }}>{{ item.content | safe }}</li>
{% endfor %}
</{{ 'ol' if type==='ordered' else 'ul' }}>
<ul role=list class="uol-list-featured">
<li class="uol-list-featured__item " role=listitem>Ensure that its research environment delivers high quality outputs to academia and the financial sectors. We strive for research excellence.</li>
<li class="uol-list-featured__item " role=listitem>Promote and encourage a lively and successful doctoral community. While the number of staff focusing on banking research at Leeds is already large by UK standards, the outputs of IBI will be leveraged via close working partnerships with its doctoral students.</li>
<li class="uol-list-featured__item " role=listitem>To address key issues facing the global banking industry.</li>
<li class="uol-list-featured__item " role=listitem>Develop and support existing academic staff to achieve their potential and appoint high achievers. IBI has a clear strategy of combining experienced and early career academics, creating a stream of research papers and reports from complementary and overlapping interests and expertise.</li>
<li class="uol-list-featured__item " role=listitem>Success will be achieved by a series of ‘milestone outputs’ from the individual and collective efforts of the team: discussion papers introducing novel research ideas and findings, journal publications with ABS 4* and 4 ratings, industry-relevant reports, and the progression of graduate students and staff members.</li>
</ul>
.uol-list-featured {
list-style-type: none;
margin: 0;
padding: 0;
max-width: 52rem;
}
.uol-list-featured__item {
@include font-size-responsive(1.125rem, 1.125rem, 1.25rem);
@include line-height-responsive(1.556, 1.6);
position: relative;
margin-bottom: $spacing-4;
padding: $spacing-2 0 $spacing-2 $spacing-6;
@include media(">=uol-media-l") {
margin-bottom: $spacing-5;
}
@include media(">=uol-media-xl") {
margin-bottom: $spacing-6;
}
&::after {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
height: 100%;
width: $spacing-4;
background-color: $color-grey--faded;
z-index: -1;
}
a {
@include link_focus(2px);
padding: 0 1px;
margin: 0 -1px;
&:hover {
text-decoration-color: $color-brand--bright;
text-decoration-thickness: 3px;
text-underline-offset: 2px;
transition: all 0s;
}
.no-csspositionsticky & {
&:hover {
text-decoration: none;
border-bottom: 3px solid $color-brand--bright;
}
}
}
}
.uol-list-featured__item--ordered {
padding: $spacing-4 0 $spacing-4 ($spacing-5 + $spacing-6);
counter-increment: list-number;
font-variant-numeric: lining-nums;
&::before {
font-size: 1.75rem;
content: counter(list-number) ".";
position: absolute;
left: $spacing-4;
font-family: $font-family-serif;
color: $color-black;
top: $spacing-4;
line-height: 1;
font-weight: $font-weight-bold--serif;
@include media(">=uol-media-m") {
font-size: 2rem;
top: 50%;
transform: translateY(-50%);
}
@include media(">=uol-media-l") {
font-size: 2.1875rem;
}
}
&::after {
width: ($spacing-4 + $spacing-3);
}
}
{
"type": "unordered",
"items": [
{
"content": "Ensure that its research environment delivers high quality outputs to academia and the financial sectors. We strive for research excellence."
},
{
"content": "Promote and encourage a lively and successful doctoral community. While the number of staff focusing on banking research at Leeds is already large by UK standards, the outputs of IBI will be leveraged via close working partnerships with its doctoral students."
},
{
"content": "To address key issues facing the global banking industry."
},
{
"content": "Develop and support existing academic staff to achieve their potential and appoint high achievers. IBI has a clear strategy of combining experienced and early career academics, creating a stream of research papers and reports from complementary and overlapping interests and expertise."
},
{
"content": "Success will be achieved by a series of ‘milestone outputs’ from the individual and collective efforts of the team: discussion papers introducing novel research ideas and findings, journal publications with ABS 4* and 4 ratings, industry-relevant reports, and the progression of graduate students and staff members."
}
]
}