Le Moyne Component Library

Program Meta 

<div class="program_meta">
    <div class="fs-row">
        <div class="fs-cell">
            <div class="program_meta_inner">
                <div class="program_meta_content">
                    <h2 class="program_meta_content_title">Degree</h2>
                    <p class="program_meta_text">Bachelor of Science (B.S.)</p>
                </div>
                <div class="program_meta_content">
                    <h2 class="program_meta_content_title">Department</h2>
                    <p class="program_meta_text">
                        Computer Science,
                        Political Science,
                        Anthropology,
                        Criminology,
                        Sociology
                    </p>
                </div>
                <div class="program_meta_content">
                    <ul class="program_meta_button">
                        <li class="program_meta_button_link_item">

                            <a href="#" class="program_meta_button_link">
                                <span class="program_meta_button_link_inner">
                                    <span class="program_meta_button_link_label">Program Finder</span>
                                    <span class="program_meta_button_link_icon" aria-hidden="true">

                                        <svg class="icon icon_caret_right">
                                            <use href="/images/icons.svg#caret_right" />
                                        </svg>

                                    </span>
                                </span>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
 
{#
	{% include "@component-program-meta" with {
		degree: 'Lorem, ipsum dolor.',
		departments: {
			links: [
				{
					title: 'Computer Science',
					url: '#',
				},
			],
		},
		links: [
			{
				title: 'Program Finder',
				url: '#',
			},
		],
	} %}
#}

<div class="program_meta">
	<div class="fs-row">
		<div class="fs-cell">
			<div class="program_meta_inner">
				{% if degree %}
				<div class="program_meta_content">
					<h2 class="program_meta_content_title">Degree</h2>
					<p class="program_meta_text">{{ degree }}</p>
				</div>
				{% endif %}
				{% if departments.links %}
				<div class="program_meta_content">
					<h2 class="program_meta_content_title">Department</h2>
					<p class="program_meta_text">
						{% for dept in departments.links %}
							{{ dept.title }}{{ not loop.last ? ', ' }}
						{% endfor %}
					</p>
				</div>
				{% endif %}
				<div class="program_meta_content">
					<ul class="program_meta_button">
						{% for link in links %}
							<li class="program_meta_button_link_item">
								{% include "@partial-link" with {
									class: 'program_meta_button',
									title: link.title,
									url: link.url,
									icon: 'caret_right',
								} %}
							</li>
						{% endfor %}
					</ul>
				</div>
			</div>
		</div>
	</div>
</div>

No notes defined.