Tamás Hajas thamas

thamas 4 hours ago

In Emulsify 04-templates/_default.twig defines twig blocks for page sections » 05-pages/_page.twig adds content (drupal regions) to these sections » templates/product/page--product.html.twig can’t modify these twig blocks because it is not a child but a grandchild of _default. Any solution to this? (I’ve just added the needed part to _page.twig within an if and set it to true in page--product.htm.twig but I do not like to pollute the general page template with a component which is not needed on every page…

evanmwillhite 2 hours ago

there is a solution. It was a little bit to wrap my head around, but I use it a lot now. You can set the block in the middle template like so:

willthemoor [1:17 AM] .
Just coming to realize the power of flat arrays within _data/data.json and the use of twig's random() function for mocking stuff in Pattern Lab. It's good living!

data.json

"schools" : [
  "Georgetown",
  "Harvard",
  "Princeton",
  "Yale"

	{#
	Source: https://youtu.be/jNqXZ4Jb2No?t=824
	DrupalCon Seattle 2019: Pattern Lab: The Definitive How-to
	#}

	{#
	_context « All available global variables
	Do not print "value" because it crashes Drupal!
	#}

	{#
	Source: https://youtu.be/jNqXZ4Jb2No
	DrupalCon Seattle 2019: Pattern Lab: The Definitive How-to
	#}

	{% set classes = [
	'card',
	media ? 'card--has-media',
	isDark ? 'card--is-dark',
	] %}

	{#
	Source: https://youtu.be/jNqXZ4Jb2No?t=822
	DrupalCon Seattle 2019: Pattern Lab: The Definitive How-to
	#}

	{% set img = node.field_img.entity.getFileUri() %}
	{# result: public://images/ocean.jpg #}

	{% set imgUrl = file_url(img) %}
	{# result: /sites/default/files/ocean.jpg #}

	// There is no auto placement for CSS Grid items in IE.
	// Sow we need to place the items into rows.
	@mixin ie-grid-rows($start: 1, $rows: 50, $container: true, $shift: 0) {
	@for $i from $start through $rows {
	$row: $i - $shift;

	@if $container {
	> *:nth-child(#{$i}) {
	-ms-grid-row: $row;
	}

	<?php

	/**
	* Implemets hook_preprocess_node().
	*
	* Create variable from translated taxonomy term name.
	* Code by @tikaszvince.
	*/
	function THEMENAME_preprocess_node(&$variables) {
	/** @var Drupal\node\Entity\Node $node */

	tippy:
	js:
	vendor/tippy.all.min.js: {}

	twist:
	js:
	components/_patterns/03-organisms/twist/twist.js: {}
	dependencies:
	- mytheme/tippy

	{#
	This snippet is from a component based (Emulsify / Pattern Lab) custom Drupal theme.
	The "span_…" variables are the properties of the BEM Twig function.
	See: https://www.fourkitchens.com/blog/development/bem-twig-function/

	The goal is to set the default display correctly (when the page loads).
	After that the field visibility is manipulated by JS based on user interaction.
	#}

	{% set amount = element['#object'].field_amount.value %}

	{#
	This is from a component based (Pattern Lab) custom Drupal theme.

	_banner.twig is the actual component, a modified version of the HTML element Field Group template.
	It contains a link component, the url of that is the banner_link_path variable.

	The banner group contains a banner copy subgroup and it contains a Link field.
	We get the path from that link field.

	It's intended to use with internal paths, have'n tried with external urls (yet).