larva modules: fact-list-item.thumbnail
- Term Title
Term Content. Rich text is supported.
fact-list-item README
Renders a description term and detail block. These blocks comprise the content of a fact-list module. Usage is associated with pmc/term-content plugin. A thumbnail variant is available to display a fact list item containing a tag list with images.
fact-list-item Twig The markup file.
<div class="fact-list-item // {{ fact_list_item_classes }}">
{% if fact_list_item_dt_text %}
<dl class="fact-list-item-dl // {{ fact_list_item_dl_classes }}">
<dt class="fact-list-item-dt // {{ fact_list_item_dt_classes }}">
{{ fact_list_item_dt_text }}
</dt>
</dl>
{% endif %}
<dd class="fact-list-item-dd // {{ fact_list_item_dd_classes }}" {{ fact_list_item_dd_data_attributes }}>
{% if fact_list_item_dd_content %}
{% include "@project/components/c-dek/c-dek.twig" with fact_list_item_dd_content %}
{% endif %}
{% if fact_list_item_tag_list %}
<div class="fact-list-item-tags // {{ fact_list_item_tag_list_classes }}">
{% include "@project/modules/tag-list/tag-list.twig" with fact_list_item_tag_list %}
</div>
{% endif %}
</dd>
</div>
fact-list-item.thumbnail JSON The data object for this pattern.
{
"fact_list_item_classes": "lrv-a-cols2@tablet lrv-u-border-b-1 lrv-u-border-color-grey-light lrv-u-margin-b-1 lrv-u-padding-b-1 lrv-a-term-content-grid__fact-list-item",
"fact_list_item_dd_classes": "lrv-u-margin-l-00 lrv-a-term-content-grid__fact-list-dd",
"fact_list_item_dd_data_attributes": "itemprop=Thing itemtype=http://schema.org/Thing",
"fact_list_item_dd_content": {
"c_dek_classes": "lrv-u-margin-tb-00 lrv-u-display-block",
"c_dek_markup": "Term Content. Rich text is supported.",
"c_dek_text": ""
},
"fact_list_item_tag_list": {
"tag_list_classes": "lrv-a-cols2 lrv-a-cols1@tablet lrv-a-cols3@desktop lrv-a-grid lrv-a-unstyle-list",
"tag_list_term_item_classes": "lrv-u-margin-lr-auto lrv-u-width-150 lrv-u-max-width-100p",
"tag_list_term_classes": "lrv-u-align-items-center lrv-u-flex-direction-column lrv-u-flex-wrap-wrap lrv-u-flex",
"tag_list_terms": [
{
"c_span": {
"modifier_class": "",
"c_span_classes": "a-truncate-ellipsis lrv-u-color-brand-secondary-dark lrv-u-display-block lrv-u-font-family-basic lrv-u-font-size-13 lrv-u-text-align-center lrv-u-text-transform-uppercase",
"c_span_text": "Music",
"c_span_url": "#test-link-1",
"c_span_link_classes": "lrv-u-font-weight-bold lrv-u-color-black lrv-u-color-brand-primary:hover lrv-a-hover-effect"
},
"o_figure": {
"o_figure_classes": "lrv-u-margin-b-050",
"c_lazy_image": {
"c_lazy_image_classes": "lrv-u-margin-lr-auto",
"c_lazy_image_link_url": false,
"c_lazy_image_link_classes": "lrv-a-unstyle-link",
"c_lazy_image_crop_class": "lrv-a-crop-1x1",
"c_lazy_image_crop_style_attr": false,
"c_lazy_image_link_tab_index_attr": false,
"c_lazy_image_alt_attr": "Lazy loaded image",
"c_lazy_image_src_url": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg",
"c_lazy_image_placeholder_url": "https://source.unsplash.com/random/200x200/#0",
"c_lazy_image_srcset_attr": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_m.jpg 240w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_n.jpg 320w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba.jpg 500w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg 640w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_b.jpg 1024w",
"c_lazy_image_sizes_attr": "auto",
"c_lazy_image_img_classes": "lrv-u-background-color-grey-light lrv-u-border-radius-50p lrv-u-display-block lrv-u-height-auto",
"c_lazy_image_height_attr": "",
"c_lazy_image_width_attr": "",
"c_lazy_image_in_initial_viewport": false,
"c_lazy_image_decoding_attr": "async"
}
}
},
{
"c_span": {
"modifier_class": "",
"c_span_classes": "a-truncate-ellipsis lrv-u-color-brand-secondary-dark lrv-u-display-block lrv-u-font-family-basic lrv-u-font-size-13 lrv-u-text-align-center lrv-u-text-transform-uppercase",
"c_span_text": "Software Development",
"c_span_url": "#test-link-2",
"c_span_link_classes": "lrv-u-font-weight-bold lrv-u-color-black lrv-u-color-brand-primary:hover lrv-a-hover-effect"
},
"o_figure": {
"o_figure_classes": "lrv-u-margin-b-050",
"c_lazy_image": {
"c_lazy_image_classes": "lrv-u-margin-lr-auto",
"c_lazy_image_link_url": false,
"c_lazy_image_link_classes": "lrv-a-unstyle-link",
"c_lazy_image_crop_class": "lrv-a-crop-1x1",
"c_lazy_image_crop_style_attr": false,
"c_lazy_image_link_tab_index_attr": false,
"c_lazy_image_alt_attr": "Lazy loaded image",
"c_lazy_image_src_url": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg",
"c_lazy_image_placeholder_url": "https://source.unsplash.com/random/200x200/#1",
"c_lazy_image_srcset_attr": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_m.jpg 240w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_n.jpg 320w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba.jpg 500w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg 640w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_b.jpg 1024w",
"c_lazy_image_sizes_attr": "auto",
"c_lazy_image_img_classes": "lrv-u-background-color-grey-light lrv-u-border-radius-50p lrv-u-display-block lrv-u-height-auto",
"c_lazy_image_height_attr": "",
"c_lazy_image_width_attr": "",
"c_lazy_image_in_initial_viewport": false,
"c_lazy_image_decoding_attr": "async"
}
}
},
{
"c_span": {
"modifier_class": "",
"c_span_classes": "a-truncate-ellipsis lrv-u-color-brand-secondary-dark lrv-u-display-block lrv-u-font-family-basic lrv-u-font-size-13 lrv-u-text-align-center lrv-u-text-transform-uppercase",
"c_span_text": "Data Science",
"c_span_url": "#test-link-3",
"c_span_link_classes": "lrv-u-font-weight-bold lrv-u-color-black lrv-u-color-brand-primary:hover lrv-a-hover-effect"
},
"o_figure": {
"o_figure_classes": "lrv-u-margin-b-050",
"c_lazy_image": {
"c_lazy_image_classes": "lrv-u-margin-lr-auto",
"c_lazy_image_link_url": false,
"c_lazy_image_link_classes": "lrv-a-unstyle-link",
"c_lazy_image_crop_class": "lrv-a-crop-1x1",
"c_lazy_image_crop_style_attr": false,
"c_lazy_image_link_tab_index_attr": false,
"c_lazy_image_alt_attr": "Lazy loaded image",
"c_lazy_image_src_url": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg",
"c_lazy_image_placeholder_url": "https://source.unsplash.com/random/200x200/#2",
"c_lazy_image_srcset_attr": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_m.jpg 240w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_n.jpg 320w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba.jpg 500w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg 640w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_b.jpg 1024w",
"c_lazy_image_sizes_attr": "auto",
"c_lazy_image_img_classes": "lrv-u-background-color-grey-light lrv-u-border-radius-50p lrv-u-display-block lrv-u-height-auto",
"c_lazy_image_height_attr": "",
"c_lazy_image_width_attr": "",
"c_lazy_image_in_initial_viewport": false,
"c_lazy_image_decoding_attr": "async"
}
}
},
{
"c_span": {
"modifier_class": "",
"c_span_classes": "a-truncate-ellipsis lrv-u-color-brand-secondary-dark lrv-u-display-block lrv-u-font-family-basic lrv-u-font-size-13 lrv-u-text-align-center lrv-u-text-transform-uppercase",
"c_span_text": "Sustainable Agriculture",
"c_span_url": "#test-link-4",
"c_span_link_classes": "lrv-u-font-weight-bold lrv-u-color-black lrv-u-color-brand-primary:hover lrv-a-hover-effect"
},
"o_figure": {
"o_figure_classes": "lrv-u-margin-b-050",
"c_lazy_image": {
"c_lazy_image_classes": "lrv-u-margin-lr-auto",
"c_lazy_image_link_url": false,
"c_lazy_image_link_classes": "lrv-a-unstyle-link",
"c_lazy_image_crop_class": "lrv-a-crop-1x1",
"c_lazy_image_crop_style_attr": false,
"c_lazy_image_link_tab_index_attr": false,
"c_lazy_image_alt_attr": "Lazy loaded image",
"c_lazy_image_src_url": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg",
"c_lazy_image_placeholder_url": "https://source.unsplash.com/random/200x200/#3",
"c_lazy_image_srcset_attr": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_m.jpg 240w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_n.jpg 320w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba.jpg 500w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg 640w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_b.jpg 1024w",
"c_lazy_image_sizes_attr": "auto",
"c_lazy_image_img_classes": "lrv-u-background-color-grey-light lrv-u-border-radius-50p lrv-u-display-block lrv-u-height-auto",
"c_lazy_image_height_attr": "",
"c_lazy_image_width_attr": "",
"c_lazy_image_in_initial_viewport": false,
"c_lazy_image_decoding_attr": "async"
}
}
},
{
"c_span": {
"modifier_class": "",
"c_span_classes": "a-truncate-ellipsis lrv-u-color-brand-secondary-dark lrv-u-display-block lrv-u-font-family-basic lrv-u-font-size-13 lrv-u-text-align-center lrv-u-text-transform-uppercase",
"c_span_text": "Art",
"c_span_url": "#test-link-5",
"c_span_link_classes": "lrv-u-font-weight-bold lrv-u-color-black lrv-u-color-brand-primary:hover lrv-a-hover-effect"
},
"o_figure": {
"o_figure_classes": "lrv-u-margin-b-050",
"c_lazy_image": {
"c_lazy_image_classes": "lrv-u-margin-lr-auto",
"c_lazy_image_link_url": false,
"c_lazy_image_link_classes": "lrv-a-unstyle-link",
"c_lazy_image_crop_class": "lrv-a-crop-1x1",
"c_lazy_image_crop_style_attr": false,
"c_lazy_image_link_tab_index_attr": false,
"c_lazy_image_alt_attr": "Lazy loaded image",
"c_lazy_image_src_url": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg",
"c_lazy_image_placeholder_url": "https://source.unsplash.com/random/200x200/#4",
"c_lazy_image_srcset_attr": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_m.jpg 240w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_n.jpg 320w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba.jpg 500w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg 640w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_b.jpg 1024w",
"c_lazy_image_sizes_attr": "auto",
"c_lazy_image_img_classes": "lrv-u-background-color-grey-light lrv-u-border-radius-50p lrv-u-display-block lrv-u-height-auto",
"c_lazy_image_height_attr": "",
"c_lazy_image_width_attr": "",
"c_lazy_image_in_initial_viewport": false,
"c_lazy_image_decoding_attr": "async"
}
}
},
{
"c_span": {
"modifier_class": "",
"c_span_classes": "a-truncate-ellipsis lrv-u-color-brand-secondary-dark lrv-u-display-block lrv-u-font-family-basic lrv-u-font-size-13 lrv-u-text-align-center lrv-u-text-transform-uppercase",
"c_span_text": "Digital Marketing Strategies",
"c_span_url": "#test-link-6",
"c_span_link_classes": "lrv-u-font-weight-bold lrv-u-color-black lrv-u-color-brand-primary:hover lrv-a-hover-effect"
},
"o_figure": {
"o_figure_classes": "lrv-u-margin-b-050",
"c_lazy_image": {
"c_lazy_image_classes": "lrv-u-margin-lr-auto",
"c_lazy_image_link_url": false,
"c_lazy_image_link_classes": "lrv-a-unstyle-link",
"c_lazy_image_crop_class": "lrv-a-crop-1x1",
"c_lazy_image_crop_style_attr": false,
"c_lazy_image_link_tab_index_attr": false,
"c_lazy_image_alt_attr": "Lazy loaded image",
"c_lazy_image_src_url": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg",
"c_lazy_image_placeholder_url": "https://source.unsplash.com/random/200x200/#5",
"c_lazy_image_srcset_attr": "https://farm5.staticflickr.com/4078/5441060528_31db7838ba_m.jpg 240w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_n.jpg 320w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba.jpg 500w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_z.jpg 640w,https://farm5.staticflickr.com/4078/5441060528_31db7838ba_b.jpg 1024w",
"c_lazy_image_sizes_attr": "auto",
"c_lazy_image_img_classes": "lrv-u-background-color-grey-light lrv-u-border-radius-50p lrv-u-display-block lrv-u-height-auto",
"c_lazy_image_height_attr": "",
"c_lazy_image_width_attr": "",
"c_lazy_image_in_initial_viewport": false,
"c_lazy_image_decoding_attr": "async"
}
}
}
]
},
"fact_list_item_dd_terms_classes": "",
"fact_list_item_dt_classes": "lrv-u-font-weight-bold lrv-a-term-content-grid__fact-list-dt",
"fact_list_item_dt_text": "Term Title"
}