@penskemediacorp/larva-patterns 1.7.1 → 1.7.2

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

@@ -0,0 +1,53 @@
+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 );
+
+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]['article_kicker'] = false;
+		linked_gallery_items[i]['c_svg'] = false;
+	}
+	
+	if ( 1 === i ) {
+		linked_gallery_items[i]['article_kicker']['article_kicker_url'] = '#';
+		linked_gallery_items[i]['article_kicker']['article_kicker_link_classes'] = 'lrv-a-unstyle-link lrv-u-padding-b-050 lrv-u-border-b-1'
+		linked_gallery_items[i]['article_kicker']['article_kicker_classes'] = 'lrv-a-font-basic-xs lrv-u-margin-t-1@desktop lrv-u-text-transform-uppercase lrv-a-glue@mobile-max';
+		linked_gallery_items[i]['article_kicker']['article_kicker_text'] = 'Photo Portfolio';
+		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]['article_kicker'] = false;
+		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,
+	c_title,
+};

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

@@ -0,0 +1,22 @@
+<div class="linked-gallery // {{ linked_gallery_classes }}">
+	<div class="{{ linked_gallery_container_classes }}">
+		<div 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 %}
+
+					{% if item['article_kicker'] %}
+						{% include "@larva/modules/article-kicker/article-kicker.twig" with item['article_kicker'] %}
+					{% endif %}
+				</div>
+			{% endfor %}
+		</div>	
+		{% include "@larva/components/c-title/c-title.twig" with c_title %}
+	</div>
+</div>

package/objects/o-icon-button/o-icon-button.twig

@@ -1,7 +1,11 @@
 {% if o_icon_button_url %}
 	<a href="{{ o_button_url }}" class="{{ o_icon_button_classes }}" target="{{ o_icon_button_target_attr }}" rel="{{ o_icon_button_rel_attr }}" data-pmc-sp-product="{{ o_icon_button_guid_attr }}" data-category-name="{{ o_icon_button_category_attr }}" {{ wp_action( 'pmc_do_render_custom_ga_tracking_attr', o_icon_button_ga_tracking ) }}>
 {% else %}
-	<button class="o-icon-button {{ o_icon_button_classes }}">
+	{% if o_icon_use_span %}
+		<span class="o-icon-button {{ o_icon_button_classes }}">
+	{% else %}
+		<button class="o-icon-button {{ o_icon_button_classes }}">
+	{% endif %}
 {% endif %}
 
 	{% include "@larva/components/c-icon/c-icon.twig" with c_icon %}
@@ -17,5 +21,9 @@
 {% if o_icon_button_url %}
 	</a>
 {% else %}
-	</button>
+	{% if o_icon_use_span %}
+		</span>
+	{% else %}
+		</button>
+	{% endif %}
 {% endif %}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@penskemediacorp/larva-patterns",
-  "version": "1.7.1",
+  "version": "1.7.2",
   "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": "^1.7.1",
+    "@penskemediacorp/larva-css": "^1.7.2",
     "@penskemediacorp/larva-js": "^1.7.1",
     "@penskemediacorp/larva-svg": "^1.4.0",
     "lodash.clonedeep": "^4.5.0"
   },
-  "gitHead": "50a9ce0abcf3a59686bc3749408326040b4f1668"
+  "gitHead": "282a59529a11489ab454027627c313ed2fb30853"
 }