larva modules: profile-blurb.card

Available Variants

card prototype
Lazy loaded image

Debra and Leon Black

New York

Investment Banking

Massa tincidunt dui ut ornare lectus sit. Dolor purus non enim praesent elementum facilisis leo. Aliquet eget sit amet tellus cras adipiscing enim eu.

View Profile Sign Up
profile-blurb README

This needs docs!
Create a README.md in the pattern's directory and add details about using this pattern in markdown.

profile-blurb Twig The markup file.
<div class="profile-blurb // {{ profile_blurb_classes }} ">

	<div class="{{ profile_blurb_image_classes }}">
		{% if c_lazy_image %}
			{% include "@larva/components/c-lazy-image/c-lazy-image.twig" with c_lazy_image %}
		{% endif %}
	</div>

	<div class="{{ profile_blurb_detail_classes }}">
		{% if c_title %}
			{% include "@larva/components/c-title/c-title.twig" with c_title %}
		{% endif %}

		{% if c_tagline %}
			{% include "@larva/components/c-tagline/c-tagline.twig" with c_tagline %}
		{% endif %}

		{% if c_tagline_second %}
			{% include "@larva/components/c-tagline/c-tagline.twig" with c_tagline_second %}
		{% endif %}

		{% if c_dek %}
			{% include "@larva/components/c-dek/c-dek.twig" with c_dek %}
		{% endif %}

		{% if o_social_list %}
			{% include "@larva/objects/o-social-list/o-social-list.twig" with o_social_list %}
		{% endif %}

		{% if c_button %}
			<div class="{{ profile_blurb_c_button_classes }}">
				{% include "@larva/components/c-button/c-button.twig" with c_button %}
			</div>
		{% endif %}
	</div>

</div>
profile-blurb.card JSON The data object for this pattern.
{
	"profile_blurb_classes": false,
	"profile_blurb_image_classes": false,
	"profile_blurb_detail_classes": "lrv-u-margin-t-050",
	"profile_blurb_c_button_classes": "",
	"c_button": {
		"c_button_classes": "lrv-a-unstyle-button lrv-u-cursor-pointer lrv-u-display-inline-block lrv-u-margin-t-1 lrv-u-text-transform-uppercase lrv-u-font-size-14 lrv-u-background-color-black lrv-u-padding-lr-2 lrv-u-padding-tb-050 lrv-u-color-white lrv-u-color-grey-light:hover",
		"c_button_ga_tracking": {},
		"c_button_inner_classes": "lrv-u-padding-lr-1@tablet",
		"c_button_rel_attr": "",
		"c_button_screen_reader_text": "Sign Up",
		"c_button_target_attr": "",
		"c_button_text": "View Profile",
		"c_button_type_attr": "submit",
		"c_button_url": "#"
	},
	"c_lazy_image": {
		"c_lazy_image_classes": false,
		"c_lazy_image_link_url": false,
		"c_lazy_image_link_classes": "lrv-a-unstyle-link",
		"c_lazy_image_crop_class": "lrv-a-crop-4x3",
		"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": "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==",
		"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"
	},
	"c_title": {
		"c_title_classes": "lrv-u-font-family-primary lrv-u-text-transform-uppercase lrv-u-font-size-16 lrv-u-color-black",
		"c_title_tag_text": "",
		"c_title_id_attr": "title-of-a-story",
		"c_title_text": "Debra and Leon Black",
		"c_title_markup": "",
		"c_title_link_classes": "lrv-u-color-black",
		"c_title_url": false
	},
	"c_tagline": {
		"c_tagline_classes": "lrv-u-margin-tb-00 lrv-u-font-family-primary lrv-u-font-size-14@mobile-max lrv-u-font-size-16 lrv-u-font-size-18@desktop-xl",
		"c_tagline_text": "New York"
	},
	"c_tagline_second": {
		"c_tagline_classes": "lrv-u-margin-tb-00 lrv-u-font-size-14@mobile-max lrv-u-font-size-16 lrv-u-font-size-18@desktop-xl lrv-u-font-family-primary lrv-u-display-block",
		"c_tagline_text": "Investment Banking"
	},
	"c_dek": {
		"c_dek_classes": "lrv-u-margin-tb-050 lrv-u-font-size-16 lrv-u-font-style-italic",
		"c_dek_markup": "",
		"c_dek_text": "Massa tincidunt dui ut ornare lectus sit. Dolor purus non enim praesent elementum facilisis leo. Aliquet eget sit amet tellus cras adipiscing enim eu. "
	},
	"o_social_list": false,
	"profile_blurb_c_button": "lrv-u-text-align-center"
}