@penskemediacorp/larva-patterns 0.6.3 → 0.6.4-develop.17

package/objects/o-header-buttons/o-header-buttons.twig

@@ -0,0 +1,42 @@
+<div class="lrv-u-flex {{o_header_button_classes}}">
+	<div class="item-wrap // {{ got_tip_wrapper_classes }}">
+		{% include "@larva/components/c-link/c-link.twig" with c_got_a_tip %}
+	</div>
+
+		{% if show_flyout %}
+
+			<div class="item-wrap // {{ account_menu_classes }} ">
+				{% include "@larva/objects/o-account-menu/o-account-menu.twig" with o_account_menu %}
+			</div>
+
+		{% else %}
+
+			<div class="item-wrap // {{ account_menu_classes }} {{ hide_flyout_classes}}">
+				{% include "@larva/components/c-link/c-link.twig" with c_account_link %}
+			</div>
+
+		{% endif %}
+
+		{% if button_wrap %}
+
+			<div class="items-wrap // {{ button_wrap_classes }}">
+				{% if c_subscribe_link %}
+					{% include "@larva/components/c-link/c-link.twig" with c_subscribe_link %}
+				{% endif %}
+
+				{% include "@larva/components/c-link/c-link.twig" with c_login_link %}
+			</div>
+
+		{% else %}
+
+			<div class="item-wrap // {{ subscribe_wrapper_classes }}">
+				{% if c_subscribe_link %}
+					{% include "@larva/components/c-link/c-link.twig" with c_subscribe_link %}
+				{% endif %}
+			</div>
+			<div class="item-wrap // {{ login_wrapper_classes }} ">
+				{% include "@larva/components/c-link/c-link.twig" with c_login_link %}
+			</div>
+
+		{% endif %}
+</div>

package/objects/o-input-group/o-input-group.prototype.js

@@ -0,0 +1,11 @@
+const clonedeep = require( 'lodash.clonedeep' );
+const c_input = clonedeep(require('@penskemediacorp/larva-patterns/components/c-input/c-input.prototype'));
+
+module.exports = {
+	o_input_group_class: '',
+	o_input_group_items: [
+		c_input,
+		c_input,
+		c_input
+	]
+};

package/objects/o-input-group/o-input-group.twig

@@ -0,0 +1,5 @@
+<div class="o-input-group {{ o_input_group_class }}">
+	{% for item in o_input_group_items %}
+		{% include "@larva/components/c-input/c-input.twig" with item %}
+	{% endfor %}
+</div>

package/objects/o-nav/o-nav.twig

@@ -13,10 +13,16 @@
 >
 
 	{% if o_nav_title_text %}
-		{% if o_nav_tag_text %}
-			<{{ o_nav_tag_text }} id="{{ o_nav_title_id_attr }}" class="o-nav__title {{ o_nav_title_classes }}">{{ o_nav_title_text }}</{{ o_nav_tag_text }}>
-		{% else %}
-			<h4 id="{{ o_nav_title_id_attr }}" class="o-nav__title {{ o_nav_title_classes }}">{{ o_nav_title_text }}</h4>
+		{% if o_nav_title_outer %}
+			<div class="o-nav__title-outer {{ o_nav_title_outer_classes }}">
+		{% endif %}
+				{% if o_nav_tag_text %}
+					<{{ o_nav_tag_text }} id="{{ o_nav_title_id_attr }}" class="o-nav__title {{ o_nav_title_classes }}">{{ o_nav_title_text }}</{{ o_nav_tag_text }}>
+				{% else %}
+					<h4 id="{{ o_nav_title_id_attr }}" class="o-nav__title {{ o_nav_title_classes }}">{{ o_nav_title_text }}</h4>
+				{% endif %}
+		{% if o_nav_title_outer %}
+			</div>
 		{% endif %}
 	{% endif %}
 

package/objects/o-sub-header/o-sub-header.prototype.js

@@ -0,0 +1,39 @@
+const clonedeep = require( 'lodash.clonedeep' );
+
+const c_heading_prototype = require( '@penskemediacorp/larva-patterns/components/c-heading/c-heading.prototype.js' );
+const c_heading = clonedeep( c_heading_prototype );
+
+const o_nav_prototype = require( '@penskemediacorp/larva-patterns/objects/o-nav/o-nav.prototype' );
+const o_nav = clonedeep( o_nav_prototype );
+
+const o_nav_items_c_links__prototype = require( '@penskemediacorp/larva-patterns/components/c-link/c-link.prototype.js' );
+
+c_heading.c_heading_text = 'Market';
+c_heading.c_heading_classes = 'lrv-u-font-family-secondary lrv-u-font-size-56@desktop-xl lrv-u-font-size-50 lrv-u-margin-b-050@mobile-max lrv-u-line-height-small lrv-u-text-align-center@mobile-max lrv-u-margin-r-2@desktop';
+c_heading.c_heading_is_primary_heading = true;
+
+o_nav.o_nav_list_items = [];
+const menuLinks = [ 'View All', 'Tag Title', 'Tag Title', 'Tag Title', 'Tag Title', 'Tag Title' ];
+
+for (let i = 0; i < menuLinks.length; i++) {
+	let c_link = clonedeep( o_nav_items_c_links__prototype );
+
+	c_link.c_link_text = menuLinks[i];
+	c_link.c_link_classes += ' c_link_classes lrv-u-font-family-primary lrv-u-color-grey-dark:hover';
+
+	o_nav.o_nav_list_items.push( c_link );
+}
+
+const mobileDropdownUtilities = ' lrv-u-border-a-1@mobile-max lrv-u-justify-content-center lrv-u-margin-b-050@mobile-max lrv-u-border-color-grey-light';
+
+o_nav.o_nav_classes = 'lrv-u-flex@desktop lrv-u-align-items-center lrv-u-text-align-center lrv-js-MobileHeightToggle';
+o_nav.o_nav_title_text = 'View Categories';
+o_nav.o_nav_title_classes = 'lrv-a-hidden@desktop lrv-js-MobileHeightToggle-trigger lrv-a-icon-after lrv-a-icon-arrow-down lrv-u-font-size-16 lrv-u-font-family-primary lrv-u-font-weight-normal lrv-u-padding-tb-050 lrv-u-width-100p@mobile-max ' + mobileDropdownUtilities;
+o_nav.o_nav_list_classes += ' lrv-js-MobileHeightToggle-target lrv-u-flex lrv-u-flex-direction-column@mobile-max  lrv-u-line-height-large lrv-u-flex-wrap-wrap lrv-a-space-children--1 lrv-a-space-children-horizontal@tablet';
+o_nav.o_nav_list_item_classes = mobileDropdownUtilities;
+
+module.exports = {
+	o_sub_header_classes: 'lrv-u-flex u-align-items-flex-end@tablet lrv-u-flex-direction-column@mobile-max',
+	c_heading: c_heading,
+	o_nav: o_nav,
+};

package/objects/o-sub-header/o-sub-header.twig

@@ -0,0 +1,9 @@
+<header class="o-sub-header // {{ o_sub_header_classes }}">
+	{% if c_heading %}
+		{% include "@larva/components/c-heading/c-heading.twig" with c_heading %}
+	{% endif %}
+
+	{% if o_nav %}
+		{% include "@larva/objects/o-nav/o-nav.twig" with o_nav %}
+	{% endif %}
+</header>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@penskemediacorp/larva-patterns",
-  "version": "0.6.3",
+  "version": "0.6.4-develop.17+854eedf7",
   "description": "Larva markup patterns.",
   "author": "laras126 <laras126@gmail.com>",
   "homepage": "https://github.com/Penske-Media-Corp/pmc-larva/tree/master/packages/patterns#readme",
@@ -20,10 +20,10 @@
     "url": "https://github.com/Penske-Media-Corp/pmc-larva/issues"
   },
   "dependencies": {
-    "@penskemediacorp/larva-css": "^0.6.3",
-    "@penskemediacorp/larva-js": "^0.6.0",
-    "@penskemediacorp/larva-svg": "^0.6.0",
+    "@penskemediacorp/larva-css": "^0.6.4-develop.17+854eedf7",
+    "@penskemediacorp/larva-js": "^0.6.4-develop.17+854eedf7",
+    "@penskemediacorp/larva-svg": "^0.6.4-develop.17+854eedf7",
     "lodash.clonedeep": "^4.5.0"
   },
-  "gitHead": "f0ffbd9ac9ba9b13889ade0e4dbc9c94f9e6dd11"
+  "gitHead": "854eedf76f31c2ed8f5300329cc2242f936e69b8"
 }