Arches: CardioSmart

Arches:CardioSmart

Multi Product Brand Style System by the American College of Cardiology

Source: dist/css/cardiosmart_boot.css, line 8183

10.1.2 Author & Article Tag Block

information about the article, author and taxonomy. Meta Data of an article may include: Author, Photo/Avatar of Author, Date Published, Tags & Topics of the Article, And last edited. (Secondary Level Item)

<aside class="bg_white bg_white-0 br_1 br_shade-3 br_solid m-b_4 p_3">
	<img src="https://i.pravatar.cc/300?img=25 alt="Author Name" class="br_round max-w_10 m_auto m-t_3 br_shade-4 br_2 br_solid shadow_overlap-light block">
	<section data-attr="author" class="font_0 m-x_4 lh_1 br-t_1 br_solid br_primary-3 m-t_4 p-t_3 font_copy">
		<span data-attr="author-name" class="block font_1 font_display font_bold"><a class="c_primary-2 font_bold link"
		>Wendy Vasquez</a
	></span>
		<span data-attr="associated" class="block font_n1">George Mason, Medical</span>
		<span data-attr="address-city-state" class="block font_n1">Washington, DC</span>
	</section>
	<section data-attr="article" class="font_n1 m-x_4 font_ui">
		<ul data-attr="taxonomy" class="flex_wrap flex flex_row ul_none">
			<li data-attr="topic " class="flex_shrink p-r_2 font_bold c_accent-n1 uppercase">
				tags
			</li>
			<li data-attr="topic " class="flex_shrink p-x_2">
				<a class="link c_shade-n2">AFIB</a>
			</li>
			<li data-attr="topic" class="flex_shrink p-x_2">
				<a class="link c_shade-n2">Endocarditis</a>
			</li>
			<li data-attr="tag" class="flex_shrink p-x_2">
				<a class="link c_shade-n2">Living With</a>
			</li>
			<li data-attr="tag" class="flex_shrink p-x_2">
				<a class="link c_shade-n2">New Science</a>
			</li>
		</ul>
	</section>
</aside>
Copy Code