@penskemediacorp/larva-patterns 1.2.0-alpha.0 → 1.3.0

package/src/objects/o-figure/o-figure.twig

@@ -1,57 +0,0 @@
-{% if o_figure_permalink_url %}
-	<a href="{{ o_figure_permalink_url }}" class="o-figure__link {{ o_figure_link_classes }}">
-{% endif %}
-
-{% if o_figure_screen_reader_text %}
-	<span class="a-screen-reader-only">{{ o_figure_screen_reader_text }}</span>
-{% endif %}
-
-{% if has_toaster %}
-	<figure class="o-figure {{ modifier_class }} {{ o_figure_classes }}" data-toaster-activate-trigger>
-{% else %}
-	<figure class="o-figure {{ modifier_class }} {{ o_figure_classes }}" style="{{ o_figure_width_attr }}">
-{% endif %}
-
-{% if o_figure_crop_class %}
-	<div class="{{ o_figure_crop_class }}">
-{% endif %}
-
-{% if o_figure_image_markup %}
-	{{ o_figure_image_markup }}
-{% else %}
-	<img class="o-figure__image {{ o_figure_image_classes }}" src="{{ o_figure_placeholder_image_url }}" data-lazy-src="{{ o_figure_image_url }}" alt="{{ o_figure_alt_attr }}">
-{% endif %}
-
-{% if c_button %}
-	{% include "@larva/components/c-button/c-button.twig" with c_button %}
-{% endif %}
-
-{% if o_figure_crop_class %}
-	</div>
-{% endif %}
-
-{# Backwards Compatibility #}
-{% if o_figure_caption_text %}
-	<figcaption class="o-figure__caption {{ o_figure_caption_classes }}">{{ o_figure_caption_text }}</figcaption>
-{% endif %}
-
-{% if o_figure_show_figcaption %}
-	<figcaption class="o-figure__caption {{ o_figure_figcaption_classes }}">
-		{% if o_figure_caption_markup %}
-			<span class="{{ o_figure_caption_classes }}">{{ o_figure_caption_markup }}</span>
-		{% endif %}
-		{% if o_figure_credit_text %}
-			<span class="{{ o_figure_credit_classes }}">{{ o_figure_credit_text }}</span>
-		{% endif %}
-	</figcaption>
-{% endif %}
-
-{% if c_play_badge %}
-	{% include "@larva/components/c-play-badge/c-play-badge.twig" with c_play_badge %}
-{% endif %}
-
-</figure>
-
-{% if o_figure_permalink_url %}
-	</a>
-{% endif %}

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

@@ -1,12 +0,0 @@
-module.exports = {
-	"o_heading_classes": "u-flex u-align-items-center pmc-u-background-black pmc-u-padding-a-1",
-	"c_heading": {
-		"c_heading_classes": "pmc-u-color-white",
-		"c_heading_text": "Section Heading"
-	},
-	"c_button": {
-		"modifier_class": "c-button--plain pmc-u-font-size-12 pmc-u-color-white pmc-u-text-transform-uppercase a-icon-after a-icon-right-arrow u-margin-l-auto",
-		"c_button_url": "#",
-		"c_button_text": "Link"
-	}
-};

package/src/objects/o-header/o-header.scss

@@ -1,5 +0,0 @@
-// Heading
-//
-// Markup: o-header.twig
-//
-// Style Guide: Objects.Header

package/src/objects/o-nav/o-nav.prototype.js

@@ -1,20 +0,0 @@
-const c_nav_link = require( '../../components/c-nav-link/c-nav-link.prototype' );
-
-const o_nav_list_items = [
-	c_nav_link,
-	c_nav_link,
-	c_nav_link
-];
-
-module.exports = {
-	"modifier_class": "",
-	"o_nav_data_attributes": "",
-	"o_nav_classes": "pmc-u-background-brand-red",
-	"o_nav_title_text": "",
-	"o_nav_title_classes": "",
-	"o_nav_list_data_attributes": "",
-	"o_nav_list_classes" : "",
-	"o_nav_list_item_data_attributes": "",
-	"o_nav_list_item_classes": "",
-	"o_nav_list_items": o_nav_list_items
-};

package/src/objects/o-nav/o-nav.scss

@@ -1,41 +0,0 @@
-// Nav
-//
-// .o-nav--flexy - A horizontal, flexible, centered nav.
-// .o-nav--horizontal - A horizontal, centered nav.
-//
-// Markup: o-nav.twig
-//
-// Style Guide: Objects.Nav
-
-@import '../../../node_modules/@penskemediacorp/larva-scss/src/setup.scss';
-
-.o-nav {}
-
-.o-nav__title {}
-
-.o-nav__list {
-	@include pmc-unstyle-list;
-}
-
-.o-nav--flexy .o-nav__list {
-	display: flex;
-	justify-content: center;
-	align-items: center;
-}
-
-.o-nav--horizontal .o-nav__list {
-	display: flex;
-	align-items: center;
-}
-
-.o-nav--flexy .o-nav__list-item {
-	padding-left: $spacer-050;
-	padding-right: $spacer-050;
-}
-
-.o-nav__list-item:last-child {
-
-	.o-nav--flexy  & {
-		border-right: 0;
-	}
-}

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

@@ -1,14 +0,0 @@
-<nav class="o-nav {{ modifier_class }} {{ o_nav_classes }}" data-dropdown="{{ o_nav_data_attributes }}">
-
-	{% if o_nav_title_text %}
-		<h4 class="o-nav__title {{ o_nav_title_classes }}" data-dropdown-list-item="{{ o_nav_title_data_attributes }}"> {{ o_nav_title_text }}</h4>
-	{% endif %}
-
-	<ul class="o-nav__list {{ o_nav_list_classes }}" data-dropdown-list="{{ o_nav_list_data_attributes }}">
-		{% for item in o_nav_list_items %}
-			<li class="o-nav__list-item {{ o_nav_list_item_classes }}" data-dropdown-list-item="{{ o_nav_list_item_data_attributes }}">
-				{% include "@larva/components/c-nav-link/c-nav-link.twig" with item %}
-			</li>
-		{% endfor %}
-	</ul>
-</nav>

package/src/objects/o-sponsored-by/o-sponsored-by.prototype.js

@@ -1,11 +0,0 @@
-module.exports = {
-	"o_sponsored_by_classes": "u-flex u-align-items-center",
-	"o_sponsored_by_title_classes": "pmc-u-color-grey-medium pmc-u-font-family-georgia pmc-u-font-size-10 pmc-u-margin-r-050",
-	"o_sponsored_by_text": "Sponsored by",
-	"o_figure": {
-		"o_figure_classes": "u-width-50",
-		"o_figure_permalink_url": "#",
-		"o_figure_alt_text": "Thumbnail image",
-		"o_figure_image_url": "https://picsum.photos/57/11"
-	}
-}

package/src/objects/o-sponsored-by/o-sponsored-by.scss

@@ -1,5 +0,0 @@
-// Sponsored By
-//
-// Markup: o-sponsored-by.twig
-//
-// Style Guide: Objects.SponsoredBy

package/src/objects/o-tease/o-tease.prototype.js

@@ -1,22 +0,0 @@
-module.exports = {
-	"o_tease_url": "#",
-	"o_tease_primary_classes": "",
-	"o_tease_secondary_classes": "",
-	"c_heading": {
-		"c_heading_text": "Breaking News",
-		"c_heading_classes": "pmc-u-font-family-balto pmc-u-font-size-20 pmc-u-font-weight-bold u-font-style-italic"
-	},
-	"c_title": {
-		"c_title_text": "here is title text from o-tease.json"
-	},
-	"c_tagline": {
-		"c_tagline_classes": "",
-		"c_tagline_markup": "here is title text from o-tease.json"
-	},
-	"o_figure": {
-		"o_figure_crop_class": "pmc-u-crop-2x3",
-		"o_figure_alt_attr": "Thumbnail image",
-		"o_figure_image_url": "https://picsum.photos/100/100",
-		"o_figure_caption_text": "Here in o-tease"
-	}
-};

package/src/objects/o-tease/o-tease.scss

@@ -1,30 +0,0 @@
-// Tease
-//
-// The tease is a side by side image with a title and additional, optional lines of text beneath.
-//
-// .o-tease--flipped - Order of primary and secondary are reversed.
-//
-// Markup: o-tease.twig
-//
-// Style guide: Objects.Tease
-
-@import '@setup';
-
-.o-tease {
-	display: flex;
-	align-items: center;
-	flex-direction: row-reverse;
-}
-
-.o-tease--flipped {
-	flex-direction: row;
-}
-
-.o-tease__primary {
-	flex-grow: 1;
-}
-
-.o-tease__secondary {
-	width: 30%;
-	flex-shrink: 0;
-}

package/src/objects/o-tease-list/o-tease-list.prototype.js

@@ -1,25 +0,0 @@
-module.exports = {
-	"o_tease_list_items": [
-		{
-			"c_title": {
-				"c_title_text": "Story list item 1"
-			},
-			"o_figure": {
-				"o_figure_crop_class": "pmc-u-crop-9x16",
-				"o_figure_alt_attr": "Thumbnail image",
-				"o_figure_image_url": "https://picsum.photos/200/300"
-			}
-		},
-		{
-			"c_title": {
-				"c_title_text": "Story list item 2"
-			},
-			"o_figure": {
-				"o_figure_crop_class": "pmc-u-crop-9x16",
-				"o_figure_permalink_url": "https://notlaura.com",
-				"o_figure_alt_attr": "Thumbnail image",
-				"o_figure_image_url": "https://picsum.photos/300/300"
-			}
-		}
-	]
-}

package/src/objects/o-tease-list/o-tease-list.scss

@@ -1,11 +0,0 @@
-// Story List
-//
-// Markup: o-tease-list.twig
-//
-// Style guide: Objects.StoryList
-
-@import '@setup';
-
-.o-tease-list {
-	@include pmc-unstyle-list;
-}

package/src/objects/objects.scss

@@ -1 +0,0 @@
-@import './o-nav/o-nav.scss';