DRBU Component Library

Double Image 

<!-- Topic Row -->
<div class="double_image">
    <div class="fs-row">
        <div class="fs-cell">
            <div class="double_image_inner">
                <div class="double_image_figures">
                    <figure class="double_image_figure" aria-hidden="true">

                        <img class="double_image_image" srcset="https://images.fastspot.com/framework/980x552/1 980w, https://images.fastspot.com/framework/740x416/1 740w, https://images.fastspot.com/framework/500x282/1 500w" src="https://images.fastspot.com/framework/500x282/1" alt="" loading="lazy" width="500" height="282">
                    </figure>
                    <figure class="double_image_figure" aria-hidden="true">

                        <img class="double_image_image" srcset="https://images.fastspot.com/framework/740x740/2 740w, https://images.fastspot.com/framework/500x500/2 500w" src="https://images.fastspot.com/framework/500x500/2" alt="" loading="lazy" width="500" height="500">
                    </figure>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- END: Topic Row -->
 
{#
	{% include '@component-topic-row' with {
		title: 'Title',
		description: 'Description',
		items: [
			{
				title: 'Item Title',
				image: '1',
				description: 'Item Description',
				links: [
					{
						title: 'Link Title',
						url: '#',
						icon: 'arrow_right'
					}
				]
			}
		]
	} %}
#}

<!-- Topic Row -->
<div class="double_image">
	<div class="fs-row">
		<div class="fs-cell">
			<div class="double_image_inner">
				<div class="double_image_figures">
					<figure class="double_image_figure" aria-hidden="true">
						{% include '@partial-image' with {
							class: 'double_image',
							alt: '',
							image: 1,
							loading: 'lazy',
							sources: [
								img.wide.med,
								img.wide.sml,
								img.wide.xsml,
							]
						} %}
					</figure>
					<figure class="double_image_figure" aria-hidden="true">
						{% include '@partial-image' with {
							class: 'double_image',
							alt: '',
							image: 2,
							loading: 'lazy',
							sources: [
								img.square.sml,
								img.square.xsml,
							]
						} %}
					</figure>
				</div>
			</div>
		</div>
	</div>
</div>
<!-- END: Topic Row -->

No notes defined.