larva modules: `term-content-top`

Available Variants

heading-tags prototype

Lazy loaded image — Caption text. Photo credit text.

Kitchen Appliances

We’ve spent hundreds of hours researching appliances, interviewing experts, poring over owner reviews, and testing appliances both large and small—many over the course of several years—to find the best appliances for your kitchen and home. From dishwashers and refrigerators to vacuums and steam cleaners, our experts pick out the right appliances for all kinds of living situations, to help keep your chores short and sweet.

Fact List

Term Content. Rich text is supported.

Music,

Software Development,

Data Science,

Sustainable Agriculture,

Art,

Digital Marketing Strategies

term-content-top README

Renders a styled term content area. Usage is associated with pmc/term-content plugin. A heading-tags variable is available to render an alternate layout that features a tag list with thumbnails.

term-content-top Twig The markup file.

<div class="term-content-top // {{ term_content_top_classes }}">
	{% if o_figure %}
		{% include "@project/objects/o-figure/o-figure.twig" with o_figure %}
	{% endif %}
	<div class="term-content-detail // {{ term_content_secondary_classes }}">
		{% if article_title %}
			{% include "@project/modules/article-title/article-title.twig" with article_title %}
		{% endif %}
		{% if fact_list_menu %}
			{% include "@project/modules/fact-list-menu/fact-list-menu.twig" with fact_list_menu %}
		{% endif %}
		{% if article_excerpt %}
			{% include "@project/modules/article-excerpt/article-excerpt.twig" with article_excerpt %}
		{% endif %}
	</div>
	{% if tag_list %}
		{% include "@project/modules/tag-list/tag-list.twig" with tag_list %}
	{% endif %}
	{% if fact_list %}
		{% include "@project/modules/fact-list/fact-list.twig" with fact_list %}
	{% endif %}
</div>

term-content-top JSON The data object for this pattern.

{
	"article_excerpt": {
		"article_excerpt_classes": "",
		"article_excerpt_markup": "We’ve spent hundreds of hours researching appliances, interviewing experts, poring over owner reviews, and testing appliances both large and small—many over the course of several years—to find the best appliances for your kitchen and home. From dishwashers and refrigerators to vacuums and steam cleaners, our experts pick out the right appliances for all kinds of living situations, to help keep your chores short and sweet."
	},
	"article_title": {
		"article_title_classes": "lrv-u-font-family-primary lrv-u-font-size-32 lrv-u-font-size-46@tablet lrv-u-line-height-small lrv-u-margin-b-00 lrv-u-padding-tb-075@tablet",
		"article_title_markup": "Kitchen Appliances",
		"c_tagline": {
			"c_tagline_classes": "lrv-u-font-family-secondary lrv-u-font-size-18@mobile-max lrv-u-font-size-28 lrv-u-margin-b-1 lrv-u-margin-t-00",
			"c_tagline_text": "The best products for your kitchen"
		}
	},
	"fact_list_menu": {
		"fact_list_menu_classes": "lrv-u-margin-t-1",
		"fact_list_menu_ul_classes": "lrv-a-unstyle-list lrv-u-border-b-1 lrv-u-border-t-1 lrv-u-display-inline-flex lrv-u-flex-wrap-wrap lrv-u-padding-tb-075 lrv-a-term-content-grid__fact-list-menu",
		"fact_list_menu_li_classes": "a-font-secondary lrv-u-text-transform-uppercase",
		"fact_list_menu_items": [
			{
				"modifier_class": "",
				"c_link_classes": "lrv-u-color-black",
				"c_link_text": "Wikipedia",
				"c_link_url": "#test-link-1",
				"c_link_rel_attr": false,
				"c_link_aria_label_attr": false,
				"c_link_target_attr": false
			},
			{
				"modifier_class": "",
				"c_link_classes": "lrv-u-color-black",
				"c_link_text": "IMDB",
				"c_link_url": "#test-link-2",
				"c_link_rel_attr": false,
				"c_link_aria_label_attr": false,
				"c_link_target_attr": false
			},
			{
				"modifier_class": "",
				"c_link_classes": "lrv-u-color-black",
				"c_link_text": "Amazon",
				"c_link_url": "#test-link-3",
				"c_link_rel_attr": false,
				"c_link_aria_label_attr": false,
				"c_link_target_attr": false
			},
			{
				"modifier_class": "",
				"c_link_classes": "lrv-u-color-black",
				"c_link_text": "Google",
				"c_link_url": "#test-link-4",
				"c_link_rel_attr": false,
				"c_link_aria_label_attr": false,
				"c_link_target_attr": false
			}
		]
	},
	"fact_list": {
		"c_title": {
			"c_title_classes": "",
			"c_title_tag_text": "",
			"c_title_id_attr": "fact-list",
			"c_title_text": "Fact List",
			"c_title_markup": "",
			"c_title_link_classes": "",
			"c_title_url": ""
		},
		"fact_list_classes": "lrv-u-font-family-secondary lrv-u-margin-t-1 lrv-a-term-content-grid__tertiary",
		"fact_list_data_attributes": "itemscope itemprop=Thing itemtype=http://schema.org/Thing",
		"fact_list_dl_classes": "lrv-u-border-t-1 lrv-u-padding-t-1 lrv-u-margin-t-00 lrv-a-term-content-grid__fact-list",
		"fact_list_items": [
			{
				"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-unstyle-list lrv-u-display-inline-flex lrv-u-flex-wrap-wrap lrv-u-flex-direction-row",
					"tag_list_term_item_classes": "lrv-u-margin-r-025",
					"tag_list_term_classes": "",
					"tag_list_terms": [
						{
							"c_span": {
								"modifier_class": "",
								"c_span_classes": "",
								"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"
							}
						},
						{
							"c_span": {
								"modifier_class": "",
								"c_span_classes": "",
								"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"
							}
						},
						{
							"c_span": {
								"modifier_class": "",
								"c_span_classes": "",
								"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"
							}
						},
						{
							"c_span": {
								"modifier_class": "",
								"c_span_classes": "",
								"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"
							}
						},
						{
							"c_span": {
								"modifier_class": "",
								"c_span_classes": "",
								"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"
							}
						},
						{
							"c_span": {
								"modifier_class": "",
								"c_span_classes": "",
								"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"
							}
						}
					]
				},
				"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"
			}
		],
		"fact_list_title_classes": "lrv-u-margin-b-050 lrv-u-font-size-20"
	},
	"o_figure": {
		"c_figcaption": {
			"c_figcaption_classes": "lrv-u-flex lrv-u-flex-direction-column lrv-u-margin-t-050 lrv-u-padding-b-1",
			"c_figcaption_caption_markup": "Caption text.",
			"c_figcaption_caption_classes": "lrv-u-font-size-12 lrv-u-font-size-14@tablet",
			"c_figcaption_credit_text": "Photo credit text.",
			"c_figcaption_credit_text_markup": "",
			"c_figcaption_credit_classes": "lrv-u-color-grey-dark lrv-u-font-family-basic lrv-u-font-size-10 lrv-u-font-size-12@mobile-max lrv-u-line-height-large",
			"c_figcaption_inner": false,
			"c_figcaption_inner_classes": ""
		},
		"c_lazy_image": {
			"c_lazy_image_classes": "",
			"c_lazy_image_link_url": false,
			"c_lazy_image_link_classes": "lrv-a-unstyle-link",
			"c_lazy_image_crop_class": "lrv-a-crop-16x9",
			"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/500x500",
			"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-lightest lrv-u-width-100p 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"
		},
		"o_figure_link_tabindex_attr": "",
		"o_figure_link_target_attr": "_self",
		"o_figure_link_url": false,
		"o_figure_classes": "lrv-u-font-family-secondary lrv-u-margin-b-00 lrv-u-width-100p lrv-a-term-content-grid__primary",
		"o_figure_link_classes": "lrv-a-unstyle-link ",
		"o_figure_figcaption_outer": false,
		"o_figure_figcaption_outer_classes": ""
	},
	"term_content_top_classes": "lrv-u-margin-t-1 lrv-a-term-content-grid",
	"term_content_secondary_classes": "lrv-a-term-content-grid__secondary"
}