@penskemediacorp/larva-patterns 1.9.0-alpha.0 → 1.10.0

package/modules/heading/heading.h4.js

@@ -0,0 +1,7 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const heading = clonedeep( require( './heading.prototype' ) );
+
+heading.heading_level_text = '4';
+
+module.exports = heading;

package/modules/heading/heading.h5.js

@@ -0,0 +1,7 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const heading = clonedeep( require( './heading.prototype' ) );
+
+heading.heading_level_text = '5';
+
+module.exports = heading;

package/modules/heading/heading.h6.js

@@ -0,0 +1,7 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const heading = clonedeep( require( './heading.prototype' ) );
+
+heading.heading_level_text = '6';
+
+module.exports = heading;

package/modules/heading/heading.prototype.js

@@ -0,0 +1,9 @@
+module.exports = {
+	heading_level_text: '3',
+	heading_classes: '',
+	heading_color_class: '',
+	heading_text_align_class: '',
+	heading_typography_class: 'lrv-a-font-primary-m',
+	heading_background_color_class: '',
+	heading_markup: 'Heading Text'
+};

package/modules/heading/heading.twig

@@ -0,0 +1,3 @@
+{% if heading_markup %}
+	<h{{ heading_level_text }} class="heading larva // {{ heading_classes }} {{ heading_typography_class }} {{ heading_color_class }} {{ heading_background_color_class }} {{ heading_text_align_class }}">{{ heading_markup }}</h{{ heading_level_text }}>
+{% endif %}

package/modules/hero-image-story/hero-image-story.prototype.js

@@ -0,0 +1,41 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const o_figure = clonedeep( require( '../../objects/o-figure/o-figure.prototype.js' ) );
+const story = clonedeep( require( '../story/story.center-vertical' ) );
+const article_kicker_prototype = clonedeep( require( '../article-kicker/article-kicker.prototype' ) );
+
+o_figure.c_figcaption.c_figcaption_caption_markup = 'test';
+o_figure.c_lazy_image.c_lazy_image_placeholder_url = 'https://picsum.photos/1000/1000';
+o_figure.c_lazy_image.c_lazy_image_classes = 'lrv-a-wrapper-100vw@mobile-max';
+o_figure.c_lazy_image.c_lazy_image_crop_class = 'lrv-a-crop-3x2';
+o_figure.o_figure_classes = 'lrv-a-glue-parent@tablet';
+o_figure.c_figcaption.c_figcaption_classes = 'lrv-u-color-white lrv-a-glue@tablet lrv-a-glue-parent@mobile-max lrv-u-flex lrv-u-flex-direction-column lrv-a-glue--b-0 lrv-a-glue--l-0 lrv-u-width-20p lrv-u-width-100p@mobile-max lrv-u-align-items-center';
+o_figure.c_figcaption.c_figcaption_credit_classes = 'lrv-a-font-primary-xl lrv-u-padding-tb-125@mobile-max lrv-u-border-b-1@mobile-max lrv-u-text-align-center@tablet lrv-u-text-transform-uppercase lrv-u-font-family-secondary';
+o_figure.c_figcaption.c_figcaption_credit_text = 'Prince Dead At 57';
+o_figure.c_figcaption.c_figcaption_caption_classes = 'u-background-white@mobile-max lrv-a-glue@mobile-max lrv-a-glue--b-unset@mobile-max lrv-a-glue--t-0 lrv-a-glue--l-0 lrv-u-transform-translateY-n50p lrv-u-font-family-secondary lrv-u-font-size-20 u-line-height-18 u-letter-spacing-012 lrv-u-border-t-5 lrv-u-border-b-1 lrv-u-padding-tb-050 lrv-u-padding-lr-125';
+o_figure.c_figcaption.c_figcaption_caption_markup = '1958 – 2021';
+
+//story.c_lazy_image = false;
+story.c_dek = false;
+story.c_timestamp = false;
+story.c_link_bottom = false;
+story.c_span = false;
+story.article_kicker = clonedeep( article_kicker_prototype );
+story.story_grid_primary_classes = 'lrv-a-hidden@tablet lrv-u-margin-b-150@mobile-max';
+story.story_classes = 'lrv-a-grid-item lrv-u-padding-t-125@mobile-max lrv-u-border-l-00@mobile-max';
+story.c_title.c_title_classes = 'lrv-a-font-primary-xs';
+story.story_links_classes = 'lrv-u-justify-content-center@tablet lrv-u-margin-b-00';
+story.story_grid_secondary_classes = 'lrv-a-span2 lrv-u-color-brand-primary:hover lrv-u-padding-lr-1 lrv-u-padding-lr-2@desktop-xl lrv-u-text-align-center@tablet';
+story.c_tagline_author_wrapper_classes = 'lrv-u-text-transform-uppercase lrv-u-font-size-12 lrv-u-line-height-copy u-letter-spacing-011';
+story.story_nav_layout_classes = 'lrv-u-flex lrv-u-align-items-center lrv-a-space-children-horizontal lrv-a-space-children--2 lrv-u-margin-t-075';
+story.story_nav_classes = 'lrv-u-font-size-12 lrv-u-font-family-body lrv-u-justify-content-center@tablet';
+module.exports = {	
+	wrapper_classes: 'lrv-u-padding-lr-150@mobile-max',
+	stories_outer_classes: 'lrv-a-grid lrv-a-cols3@tablet lrv-a-children-border-horizontal lrv-a-children-border-vertical@mobile-max lrv-u-padding-tb-150 lrv-u-padding-tb-00@mobile-max',
+	o_figure,
+	stories: [
+		story,
+		story,
+		story,
+	],
+};

package/modules/hero-image-story/hero-image-story.twig

@@ -0,0 +1,8 @@
+<div class="hero-image-story-module // {{ wrapper_classes }}">
+	{% include "@larva/objects/o-figure/o-figure.twig" with o_figure %}
+	<div class="stories-outer {{ stories_outer_classes }}">
+		{% for item in stories %}
+			{% include "@larva/modules/story/story.twig" with item %}
+		{% endfor %}
+	</div>
+</div>

package/modules/injected-related-content/injected-related-content.prototype.js

@@ -0,0 +1,61 @@
+const clonedeep = require('lodash.clonedeep');
+
+const c_title_prototype = require('../../components/c-title/c-title.prototype');
+const c_heading = clonedeep(c_title_prototype);
+
+c_heading.c_title_text = 'Related';
+c_heading.c_title_classes = 'lrv-a-font-primary-xxxs lrv-u-font-weight-bold lrv-u-color-black lrv-u-text-transform-uppercase lrv-u-border-b-1 lrv-u-padding-b-050 ';
+c_heading.c_title_url = false;
+
+const c_title = clonedeep(c_title_prototype);
+
+c_title.c_title_text = 'Chronixx Says Some Dancehall Lyrics Are ‘Embarrassing’, Artists Should Stop Calling Him For Features';
+c_title.c_title_classes = 'lrv-a-font-primary-xs lrv-u-color-black lrv-u-padding-t-125';
+c_title.c_title_link_classes = 'lrv-a-font-primary-xs lrv-u-color-black lrv-a-truncate-ellipsis-4line@mobile-max lrv-a-truncate-ellipsis-5line@tablet-desktop-only lrv-a-truncate-ellipsis-3line@desktop-xl';
+c_title.c_title_url = '#';
+
+const c_lazy_image_prototype = require('../../components/c-lazy-image/c-lazy-image.prototype.js');
+const c_lazy_image = clonedeep(c_lazy_image_prototype);
+
+c_lazy_image.c_lazy_image_classes = 'lrv-a-floated-right@tablet lrv-u-width-154@desktop-xl lrv-u-width-177@tablet-and-desktop-only lrv-u-margin-l-125 lrv-u-margin-t-150@mobile-max lrv-u-margin-l-00@mobile-max';
+c_lazy_image.c_lazy_image_crop_class = 'lrv-a-crop-1x1@tablet';
+
+const o_card_prototype = require('../../objects/o-card/o-card.prototype');
+const o_card_first = clonedeep(o_card_prototype);
+
+o_card_first.o_card_classes = '';
+o_card_first.c_title.c_title_text = 'Chronixx Draws Inspiration From These Capleton Lyrics';
+o_card_first.c_title.c_title_classes = 'lrv-a-font-primary-xxxs lrv-u-color-black lrv-u-border-b-1 lrv-u-border-t-1@desktop-xl-max lrv-u-padding-b-1 lrv-u-padding-t-00@desktop-xl lrv-u-padding-t-1 ';
+o_card_first.c_title.c_title_link_classes = 'lrv-a-font-primary-xxxs lrv-u-color-black lrv-a-truncate-ellipsis-3line@desktop-xl lrv-a-truncate-ellipsis-1line@tablet-desktop-only lrv-a-truncate-ellipsis-2line@mobile-max';
+o_card_first.c_title.c_title_url = '#';
+o_card_first.c_lazy_image = false;
+o_card_first.c_span = false;
+o_card_first.c_timestamp = false;
+o_card_first.o_card_tag_text = 'div';
+
+const o_card_last = clonedeep(o_card_prototype);
+
+o_card_last.o_card_classes = '';
+o_card_last.c_title.c_title_text = 'Chronixx calls for change in new video “Safe N Sound”';
+o_card_last.c_title.c_title_classes = 'lrv-a-font-primary-xxxs lrv-u-color-black lrv-u-padding-b-00@desktop-xl lrv-u-padding-b-1 lrv-u-padding-t-1';
+o_card_last.c_title.c_title_link_classes = 'lrv-a-font-primary-xxxs lrv-u-color-black lrv-a-truncate-ellipsis-3line@desktop-xl lrv-a-truncate-ellipsis-1line@tablet-desktop-only lrv-a-truncate-ellipsis-2line@mobile-max';
+o_card_last.c_title.c_title_url = '#';
+o_card_last.c_lazy_image = false;
+o_card_last.c_span = false;
+o_card_last.c_timestamp = false;
+o_card_last.o_card_tag_text = 'div';
+
+module.exports = {
+    injected_related_content_classes: 'lrv-u-border-t-1 lrv-u-padding-t-025',
+    injected_related_content_inner_classes: 'lrv-u-flex lrv-u-flex-direction-column@desktop-xl-max lrv-u-border-b-1 lrv-u-border-t-1 lrv-u-padding-b-150@desktop-xl lrv-u-padding-t-150',
+    injected_related_content_primary_classes: 'lrv-u-padding-b-1@mobile-max lrv-u-padding-b-150 lrv-u-padding-b-00@desktop-xl lrv-u-width-64p@desktop-xl',
+    injected_related_content_heading_classes: 'lrv-u-padding-b-00@desktop-xl lrv-u-display-inline-block',
+    injected_related_content_secondary_classes: 'lrv-u-padding-l-125@desktop-xl lrv-u-width-36p@desktop-xl lrv-u-flex lrv-u-flex-direction-column lrv-u-justify-content-center',
+    c_heading,
+    c_title,
+    c_lazy_image,
+    o_card_items: [
+        o_card_first,
+        o_card_last
+    ]
+};

package/modules/injected-related-content/injected-related-content.twig

@@ -0,0 +1,23 @@
+<div class="injected-related-content // {{injected_related_content_classes}}" >
+	<div class="injected-related-content-inner // {{injected_related_content_inner_classes}}">
+		<div class="injected-related-content-primary // {{injected_related_content_primary_classes}}">
+			<div class="injected-related-content-heading // {{injected_related_content_heading_classes}}">
+				{% include "@larva/components/c-title/c-title.twig" with c_heading %}
+			</div>
+			{% if c_lazy_image %}
+				{% include "@larva/components/c-lazy-image/c-lazy-image.twig" with c_lazy_image %}
+			{% endif %}
+
+			{% if c_title %}
+				{% include "@larva/components/c-title/c-title.twig" with c_title %}
+			{% endif %}
+
+		</div>
+		<div class="injected-related-content-secondary // {{injected_related_content_secondary_classes}}">
+			{% for item in o_card_items %}
+				{% include "@larva/objects/o-card/o-card.twig" with item %}
+			{% endfor %}
+		</div>
+	</div>
+</div>
+

package/modules/linked-gallery/linked-gallery.prototype.js

@@ -0,0 +1,56 @@
+const clonedeep = require('lodash.clonedeep');
+
+const c_lazy_image   = clonedeep( require( '@penskemediacorp/larva-patterns/components/c-lazy-image/c-lazy-image.prototype' ) );
+const article_kicker = clonedeep( require( '@penskemediacorp/larva-patterns/modules/article-kicker/article-kicker.prototype' ) );
+const c_title        = clonedeep( require( '@penskemediacorp/larva-patterns/components/c-title/c-title.prototype' ) );
+const c_svg          = clonedeep( require( '@penskemediacorp/larva-patterns/components/c-svg/c-svg.prototype' ) );
+
+c_lazy_image.c_lazy_image_crop_class = 'lrv-a-crop-3x2';
+c_lazy_image.c_lazy_image_img_classes += ' lrv-u-filter-grayscale-100';
+
+const linked_gallery_item = { c_lazy_image, article_kicker, c_svg };
+
+const linked_gallery_item_1 = clonedeep( linked_gallery_item );
+const linked_gallery_item_2 = clonedeep( linked_gallery_item );
+const linked_gallery_item_3 = clonedeep( linked_gallery_item );
+
+
+article_kicker.article_kicker_url = '#';
+article_kicker.article_kicker_link_classes = 'lrv-a-unstyle-link lrv-u-padding-b-050 lrv-u-border-b-1'
+article_kicker.article_kicker_classes = 'lrv-u-text-align-center lrv-a-font-basic-xs lrv-u-margin-t-1@desktop lrv-u-text-transform-uppercase';
+article_kicker.article_kicker_text = 'Photo Portfolio';
+
+c_title.c_title_url  = '';
+c_title.c_title_text = 'The work of brad elterman';
+c_title.c_title_classes = 'lrv-a-font-secondary-xl lrv-u-text-align-center lrv-u-margin-t-2@desktop lrv-u-margin-t-2@mobile-max lrv-u-text-transform-uppercase lrv-a-unstyle-inner-links';
+
+const linked_gallery_items = [ linked_gallery_item_1, linked_gallery_item_2, linked_gallery_item_3 ];
+
+for ( let i = 0; i < linked_gallery_items.length; i++ ) {
+	if ( 0 === i ) {
+		linked_gallery_items[i]['c_lazy_image']['c_lazy_image_classes'] = 'lrv-u-margin-r-2@desktop lrv-u-padding-r-2@desktop ';
+		linked_gallery_items[i]['linked_gallery_thumbnail_classes'] = 'lrv-u-display-none@mobile-max';
+		linked_gallery_items[i]['c_svg'] = false;
+	}
+	
+	if ( 1 === i ) {
+		linked_gallery_items[i]['c_svg']['c_svg_classes'] = 'lrv-a-glue lrv-a-glue--r-0 lrv-u-display-none@desktop';
+		linked_gallery_items[i]['linked_gallery_thumbnail_classes'] = 'lrv-u-position-absolute@desktop lrv-u-width-38p@desktop lrv-u-top-n33@desktop lrv-a-glue@tablet lrv-u-transform-translateX-n50p@desktop lrv-u-left-50p@desktop lrv-u-text-align-center';
+	}
+	
+	if ( 2 === i ) {
+		linked_gallery_items[i]['c_lazy_image']['c_lazy_image_classes'] = 'lrv-u-margin-l-2@desktop lrv-u-padding-l-2@desktop';
+		linked_gallery_items[i]['linked_gallery_thumbnail_classes'] = 'lrv-u-display-none@mobile-max';
+		linked_gallery_items[i]['c_svg']['c_svg_classes'] = 'lrv-a-glue lrv-a-glue--r-0';
+	}	
+}	
+
+module.exports = {
+	linked_gallery_classes: 'lrv-u-border-t-1 lrv-u-border-b-1',
+	linked_gallery_container_classes: 'lrv-u-border-t-1 lrv-u-margin-t-025 lrv-u-padding-tb-2@desktop lrv-u-padding-lr-125@desktop lrv-u-padding-lr-050@mobile-max lrv-u-padding-tb-125@mobile-max',
+	linked_gallery_thumbnails_classes: 'lrv-a-grid lrv-a-cols2@desktop lrv-u-position-relative lrv-u-margin-t-2@desktop',
+	linked_gallery_items,
+	linked_gallery_url: '#',
+	article_kicker,
+	c_title,
+};

package/modules/linked-gallery/linked-gallery.twig

@@ -0,0 +1,21 @@
+<div class="linked-gallery // {{ linked_gallery_classes }}">
+	<div class="{{ linked_gallery_container_classes }}">
+		<a href="{{ linked_gallery_url }}" class="linked-gallery-thumbnails // {{ linked_gallery_thumbnails_classes }} ">
+			{% for item in linked_gallery_items %}
+				<div class="linked-gallery-thumbnail // {{ item['linked_gallery_thumbnail_classes'] }}">		
+					{% if item['c_lazy_image'] %}
+						{% include "@larva/components/c-lazy-image/c-lazy-image.twig" with item['c_lazy_image'] %}
+					{% endif %}
+
+					{% if item['c_svg'] %}
+						{% include "@larva/components/c-svg/c-svg.twig" with item['c_svg'] %}
+					{% endif %}
+				</div>
+			{% endfor %}
+		</a>
+		{% if article_kicker %}
+			{% include "@larva/modules/article-kicker/article-kicker.twig" with article_kicker %}
+		{% endif %}		
+		{% include "@larva/components/c-title/c-title.twig" with c_title %}
+	</div>
+</div>

package/modules/list/list.ordered.js

@@ -0,0 +1,7 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const list = clonedeep( require( './list.prototype' ) );
+
+list.list_type_name = 'o';
+
+module.exports = list;

package/modules/list/list.prototype.js

@@ -0,0 +1,57 @@
+module.exports = {
+	list_classes: 'a-font-body-m',
+	list_markup: 'Paragraph Text.',
+	list_type_name: 'u',
+	list_items: [ 
+		{
+			list_markup: 'item_one', 
+		},
+		{
+			list_markup: 'item_two', 
+		},
+		{
+			list_classes: 'a-font-body-m',
+			list_markup: 'Paragraph Text with sub items woo.',
+			list_type_name: 'u',
+			list_item_classes: '',
+			list_items: [
+				{
+					list_markup: 'sub_item_one', 
+				},
+				{
+					list_markup: 'sub_item_two', 
+				},
+				{
+					list_classes: 'a-font-body-m',
+					list_markup: 'Paragraph Text.',
+					list_type_name: 'u',
+					list_item_classes: '',
+					list_items: [
+						{
+							list_markup: 'sub_sub_item_one', 
+						},
+						{
+							list_markup: 'sub_sub_item_two', 
+						},
+						{
+							list_classes: 'a-font-body-m',
+							list_markup: 'Paragraph Text.',
+							list_type_name: 'u',
+							list_item_classes: '',
+							list_items: [
+								{
+									list_markup: 'sub_sub_sub_item_one', 
+								},
+								{
+									list_markup: 'sub_sub_sub_item_two', 
+								},
+							]
+						}
+						
+					]
+				}
+			]
+		}
+	],
+	list_item_classes: ''
+};

package/modules/list/list.twig

@@ -0,0 +1,11 @@
+<{{ list_type_name }}l class="list larva // {{ list_classes }}">
+	{% for item in list_items %}
+		<li class="list__item larva // {{ list_item_classes }}">
+			{{ item['list_markup'] }}
+
+			{% if item['list_items'] %}
+				{% include "@larva/modules/list/list.twig" with item %}
+			{% endif %}
+		</li>
+	{% endfor %}
+</{{ list_type_name }}l>

package/modules/listicle-item/listicle-item.prototype.js

@@ -0,0 +1,11 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const o_collection_item = clonedeep( require( '../../objects/o-collection-item/o-collection-item.prototype' ) );
+
+o_collection_item.o_collection_item_classes = 'a-floated-parent';
+o_collection_item.o_figure.o_figure_classes = 'a-floated-left@tablet lrv-u-padding-r-1@tablet';
+
+module.exports = {
+	listicle_item_classes: 'lrv-a-wrapper',
+	o_collection_item: o_collection_item
+};

package/modules/listicle-item/listicle-item.twig

@@ -0,0 +1,3 @@
+<section class="listicle-item // {{ listicle_item_classes }}">
+	{% include "@larva/objects/o-collection-item/o-collection-item.twig" with o_collection_item %}
+</section>

package/modules/mega-menu/mega-menu.prototype.js

@@ -0,0 +1,16 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const mega_menu_footer_prototype = require( '../mega-menu-footer/mega-menu-footer.prototype.js' );
+const mega_menu_footer = clonedeep( mega_menu_footer_prototype );
+
+const mega_menu_content_prototype = require( '../mega-menu-content/mega-menu-content.prototype.js' );
+const mega_menu_content = clonedeep( mega_menu_content_prototype );
+
+module.exports = {
+	mega_menu_footer,
+	mega_menu_content,
+	mega_menu_classes: '',
+	mega_menu_outer_classes: 'lrv-a-wrapper',
+	mega_menu_inner_classes: 'lrv-u-background-color-white lrv-u-flex lrv-u-flex-direction-column lrv-u-border-b-2 lrv-u-border-r-2 lrv-u-border-l-2',
+	mega_menu_content_outer_classes: 'lrv-u-background-color-white lrv-u-padding-a-150 lrv-u-width-100p',
+};

package/modules/mega-menu/mega-menu.twig

@@ -0,0 +1,10 @@
+<nav class="mega-menu // js-MegaMenu {{ mega_menu_classes }} ">
+	<div class="mega-menu-outer // {{ mega_menu_outer_classes }} ">
+		<div class="mega-menu-inner // {{ mega_menu_inner_classes }} ">
+			<div class="mega-menu-content-outer // {{ mega_menu_content_outer_classes }} ">
+				{% include "@larva/modules/mega-menu-content/mega-menu-content.twig" with mega_menu_content %}
+			</div>
+			{% include "@larva/modules/mega-menu-footer/mega-menu-footer.twig" with mega_menu_footer %}
+		</div>
+	</div>
+</nav>

package/modules/mega-menu-content/mega-menu-content.prototype.js

@@ -0,0 +1,10 @@
+const clonedeep = require( 'lodash.clonedeep' );
+const mega_menu_item = clonedeep( require( '../mega-menu-item/mega-menu-item.prototype' ) );
+
+module.exports = {
+	mega_menu_content_items: [
+		mega_menu_item,
+		mega_menu_item,
+	],
+	mega_menu_content_classes: 'lrv-u-flex lrv-u-flex-wrap-wrap lrv-a-unstyle-list lrv-u-background-color-white lrv-a-space-children--050 lrv-a-space-children-horizontal '
+};

package/modules/mega-menu-content/mega-menu-content.twig

@@ -0,0 +1,5 @@
+<ul class="mega-menu-content // mega-menu__parent-list {{ mega_menu_content_classes }} ">
+	{% for item in mega_menu_content_items %}
+		{% include "@larva/modules/mega-menu-item/mega-menu-item.twig" with item %}
+	{% endfor %}
+</ul>

package/modules/mega-menu-footer/mega-menu-footer.prototype.js

@@ -0,0 +1,41 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const mega_menu_subscribe = clonedeep( require( '../mega-menu-footer-subscribe/mega-menu-footer-subscribe.prototype' ) );
+const social_heading = clonedeep( require( '../../modules/heading/heading.prototype' ) );
+const newsletter_heading = clonedeep( require( '../../modules/heading/heading.prototype' ) );
+const o_social_list = clonedeep( require( '../../objects/o-social-list/o-social-list.prototype' ) );
+
+social_heading.heading_level_text = '3';
+social_heading.heading_classes = 'lrv-a-font-body-xs lrv-u-margin-b-050 lrv-u-margin-t-025 lrv-u-font-weight-normal lrv-u-text-transform-uppercase lrv-u-text-align-center lrv-u-display-inline-block@mobile-max lrv-u-vertical-align-middle\@mobile-max';
+social_heading.heading_markup = 'Follow Us';
+
+newsletter_heading.heading_level_text = '3';
+newsletter_heading.heading_classes = 'email-form-heading lrv-u-background-color-white lrv-a-font-body-xs lrv-u-width-70p lrv-u-margin-b-125 lrv-u-text-align-center lrv-u-font-weight-normal lrv-u-text-transform-uppercase lrv-u-padding-lr-075 lrv-u-border-r-1 lrv-u-border-l-1 lrv-u-border-r-00@mobile-max lrv-u-border-l-00@mobile-max';
+newsletter_heading.heading_markup = 'Alerts & Newsletters';
+
+const o_email_capture_form_prototype = require( '../../objects/o-email-capture-form/o-email-capture-form.prototype' );
+const o_email_capture_form = clonedeep( o_email_capture_form_prototype );
+
+o_email_capture_form.c_email_field.c_email_field_label_text = 'Email Address';
+o_email_capture_form.c_email_field.c_email_field_input_placeholder_attr = 'ENTER E-MAIL';
+o_email_capture_form.c_email_field.c_email_field_input_classes = 'lrv-u-width-100p';
+o_email_capture_form.c_email_field.c_email_field_classes = 'lrv-u-border-b-1 lrv-u-border-r-1 lrv-a-font-body-xxs lrv-u-margin-b-125 lrv-u-margin-b-00@mobile-max lrv-u-text-align-left lrv-u-width-75p@mobile-max';
+o_email_capture_form.c_email_field.c_email_field_label_classes = 'lrv-a-hidden';
+o_email_capture_form.o_email_capture_form_inner_classes = 'lrv-u-text-align-right lrv-u-align-items-center';
+o_email_capture_form.c_button.c_button_classes = 'lrv-a-font-body-xs lrv-a-icon-after lrv-u-text-transform-uppercase lrv-a-unstyle-button lrv-u-cursor-pointer lrv-u-flex lrv-u-justify-content-end lrv-u-width-100p@tablet lrv-a-glue-parent@tablet lrv-u-width-75p@mobile-max';
+o_email_capture_form.c_button.c_button_inner_classes = 'lrv-u-background-color-white lrv-u-padding-l-050';
+o_email_capture_form.c_button.c_button_text = 'Sign Up';
+
+module.exports = {
+	o_email_capture_form,
+	o_social_list,
+	social_heading,
+	mega_menu_subscribe,
+	newsletter_heading,
+	mega_menu_footer_classes: 'lrv-u-border-t-2 lrv-u-background-color-white',
+	mega_menu_footer_inner_classes: 'lrv-u-flex lrv-u-flex-direction-column@mobile-max',
+	mega_menu_footer_subscribe_classes: 'lrv-u-flex lrv-u-flex-direction-column@desktop-max lrv-u-align-items-center lrv-u-width-30p lrv-a-hidden@mobile-max lrv-u-border-r-6 lrv-u-margin-r-025',
+	mega_menu_footer_social_classes: 'lrv-u-flex lrv-u-flex-direction-column lrv-u-align-items-center lrv-u-padding-tb-050 lrv-u-width-20p lrv-u-width-100p@mobile-max lrv-u-border-r-1 lrv-u-border-l-1 lrv-u-border-r-00@mobile-max lrv-u-border-l-00@mobile-max lrv-u-padding-lr-050 lrv-u-display-block@mobile-max lrv-u-text-align-center@mobile-max lrv-u-border-b-2@mobile-max',
+	mega_menu_social_list_classes:' lrv-u-display-inline-block@mobile-max lrv-u-vertical-align-middle@mobile-max lrv-u-flex@tablet lrv-u-justify-content-center',
+	mega_menu_footer_form_classes: 'lrv-u-flex lrv-u-flex-direction-column lrv-u-align-items-center lrv-u-padding-tb-1 lrv-u-width-50p lrv-u-width-100p@mobile-max lrv-u-flex-direction-column lrv-u-padding-lr-125',
+}

package/modules/mega-menu-footer/mega-menu-footer.twig

@@ -0,0 +1,19 @@
+<footer class="mega-menu__footer // {{ mega_menu_footer_classes }} ">
+	<div class="mega-menu__footer-inner // {{ mega_menu_footer_inner_classes }} ">
+		<section class="mega-menu__footer-subscribe // {{ mega_menu_footer_subscribe_classes }} ">
+			{% include "@larva/modules/mega-menu-footer-subscribe/mega-menu-footer-subscribe.twig" with mega_menu_subscribe %}
+		</section>
+		<section class="mega-menu__footer-social // {{ mega_menu_footer_social_classes }} ">
+			{% include "@larva/modules/heading/heading.twig" with social_heading %}
+			<div class="mega-menu__social-list // {{ mega_menu_social_list_classes }}">
+				{% include "@larva/objects/o-social-list/o-social-list.twig" with o_social_list %}
+			</div>
+		</section>
+		<section class="mega-menu__footer-form // {{ mega_menu_footer_form_classes }} ">
+			{% include "@larva/modules/heading/heading.twig" with newsletter_heading %}
+			<div class="lrv-u-flex-grow-1 lrv-u-width-100p">
+				{% include "@larva/objects/o-email-capture-form/o-email-capture-form.twig" with o_email_capture_form %}
+			</div>
+		</section>
+	</div>
+</footer>

package/modules/mega-menu-footer-subscribe/mega-menu-footer-subscribe.prototype.js

@@ -0,0 +1,20 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const c_lazy_image_prototype = require( '../../components/c-lazy-image/c-lazy-image.prototype.js' );
+const c_lazy_image = clonedeep( c_lazy_image_prototype );
+
+const c_icon_prototype = require( '../../components/c-icon/c-icon.prototype.js' );
+const c_icon = clonedeep( c_icon_prototype );
+
+c_icon.c_icon_classes = 'lrv-a-glue lrv-a-glue--l-0 lrv-a-glue--t-50p lrv-u-transform-translateY-n50p lrv-u-width-50';
+
+c_lazy_image.c_lazy_image_src_url = 'https://cdn.shopify.com/s/files/1/0238/6647/products/2019_37_540x.jpg';
+c_lazy_image.c_lazy_image_placeholder_url = 'https://cdn.shopify.com/s/files/1/0238/6647/products/2019_37_540x.jpg';
+c_lazy_image.c_lazy_image_classes = 'lrv-u-padding-l-3';
+c_lazy_image.c_lazy_image_crop_class = 'lrv-a-crop-2x3';
+
+module.exports = {
+	footer_subscribe_classes: 'lrv-a-glue-parent lrv-u-width-100p',
+	c_lazy_image,
+	c_icon
+};

package/modules/mega-menu-footer-subscribe/mega-menu-footer-subscribe.twig

@@ -0,0 +1,4 @@
+<div class="mega-menu-footer-subscribe // {{ footer_subscribe_classes }}">
+	{% include "@larva/components/c-icon/c-icon.twig" with c_icon %}
+	{% include "@larva/components/c-lazy-image/c-lazy-image.twig" with c_lazy_image %}
+</div>

package/modules/mega-menu-item/mega-menu-item.prototype.js

@@ -0,0 +1,23 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const c_link = clonedeep( require( '../../components/c-link/c-link.prototype' ) );
+const c_link__parent = clonedeep( c_link );
+const c_link__child = clonedeep( c_link );
+
+c_link__parent.c_link_text = 'Parent item';
+c_link__parent.c_link_classes = 'lrv-a-unstyle-link lrv-u-color-brand-primary-dark:hover lrv-u-font-weight-bold lrv-a-font-body-xs lrv-u-text-transform-uppercase';
+
+c_link__child.c_link_text = 'Child item';
+c_link__child.c_link_classes = 'lrv-a-unstyle-link lrv-u-color-brand-primary-dark:hover lrv-u-padding-tb-025 lrv-u-display-block lrv-a-font-body-xs';
+
+module.exports = {
+	c_link: c_link__parent,
+	mega_menu_item_children: [
+		c_link__child,
+		c_link__child,
+		c_link__child
+	],
+	mega_menu_item_classes:'lrv-a-unstyle-list',
+	mega_menu_item_link_classes:'lrv-u-flex lrv-u-color-black   lrv-u-display-inline-block lrv-u-width-100p',
+	mega_menu_child_list_classes:'lrv-a-unstyle-list lrv-u-padding-t-1 lrv-u-margin-b-125'
+};

package/modules/mega-menu-item/mega-menu-item.twig

@@ -0,0 +1,13 @@
+<li class="mega-menu-item // mega-menu__parent-list-item {{ mega_menu_item_classes }} ">
+	<div class="mega-menu__item-link // {{ mega_menu_item_link_classes }} ">
+		{% include "@larva/components/c-link/c-link.twig" with c_link %}
+	</div>
+
+	<ul class="mega-menu__child-list // {{ mega_menu_child_list_classes }} ">
+		{% for item in mega_menu_item_children %}
+			<li class="mega-menu__child-list-item ">
+				{% include "@larva/components/c-link/c-link.twig" with item %}
+			</li>
+		{% endfor %}
+	</ul>
+</li>

package/modules/more-stories-button/more-stories-button.profile.js

@@ -0,0 +1,12 @@
+const clonedeep = require( 'lodash.clonedeep' );
+const more_stories_button_prototype = require( './more-stories-button.prototype' );
+
+const more_stories_button_profile = clonedeep( more_stories_button_prototype );
+
+more_stories_button_profile.c_button.c_button_classes = 'js-ProfileFilter-loadMore lrv-a-unstyle-button lrv-u-cursor-pointer lrv-u-padding-tb-050 lrv-u-padding-lr-1 lrv-u-background-color-black lrv-u-color-white lrv-u-color-white:hover lrv-u-text-align-center lrv-u-font-size-28 lrv-u-display-block lrv-u-border-radius-5 lrv-u-width-100p lrv-u-font-family-primary lrv-u-font-weight-bold';
+more_stories_button_profile.c_button.c_button_url = false;
+more_stories_button_profile.c_button.c_button_text = 'Load More';
+more_stories_button_profile.c_button_prev = false;
+more_stories_button_profile.c_button_next = false
+
+module.exports = more_stories_button_profile;

package/modules/more-stories-button/more-stories-button.prototype.js

@@ -0,0 +1,29 @@
+const clonedeep = require( 'lodash.clonedeep' );
+const c_button_basic_prototype = require( '../../components/c-button/c-button.brand-basic' );
+
+const c_button_struct = clonedeep( c_button_basic_prototype );
+
+c_button_struct.c_button_classes += ' lrv-u-color-white:hover lrv-u-border-radius-5 lrv-u-text-align-center lrv-u-font-size-28';
+
+const c_button = clonedeep( c_button_struct );
+const c_button_prev = clonedeep( c_button_struct );
+const c_button_next = clonedeep( c_button_struct );
+
+c_button.c_button_classes += ' lrv-u-display-block lrv-u-width-100p';
+c_button.c_button_text = 'More Stories';
+c_button.c_button_url = '#';
+
+c_button_prev.c_button_classes += ' lrv-a-icon-arrow-left lrv-a-icon-invert lrv-a-icon-before lrv-u-font-size-18 lrv-u-justify-content-center';
+c_button_prev.c_button_text = 'Previous';
+c_button_prev.c_button_url = '#';
+
+c_button_next.c_button_classes += ' lrv-a-icon-arrow-right lrv-a-icon-invert lrv-a-icon-after lrv-u-font-size-18 lrv-u-justify-content-center lrv-u-margin-l-auto';
+c_button_next.c_button_text = 'Next';
+c_button_next.c_button_url = '#';
+
+module.exports = {
+	more_stories_button_classes: 'lrv-u-font-weight-bold lrv-u-font-family-primary',
+	c_button: c_button,
+	c_button_prev: c_button_prev,
+	c_button_next: c_button_next,
+};

package/modules/more-stories-button/more-stories-button.twig

@@ -0,0 +1,13 @@
+<nav class="more-stories-button // lrv-u-flex lrv-u-justify-content-space-between {{ more_stories_button_classes }}">
+	{% if c_button %}
+		{% include "@larva/components/c-button/c-button.twig" with c_button %}
+	{% endif %}
+
+	{% if c_button_prev %}
+		{% include "@larva/components/c-button/c-button.twig" with c_button_prev %}
+	{% endif %}
+
+	{% if c_button_next %}
+		{% include "@larva/components/c-button/c-button.twig" with c_button_next %}
+	{% endif %}
+</nav>