Commit c851547e authored by Ken Hawkins's avatar Ken Hawkins
Browse files

Update pattern syntax differences between nunj, hbs

parent a881ce3c
<!DOCTYPE html>
<html lang="en" class="vf-no-js">
<head>
{{> @vf-no-js }}
{% render "@vf-no-js" %}
<title>{{ _target.title }} | {{ _config.project.title }}</title>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1, minimum-scale=1" name="viewport">
{{> @vf-favicon}}
{{> @embl-content-meta-properties meta-who="Group Jane" meta-where="Barcelona" meta-what="research,cancer" meta-active="what"}}
{% render "@vf-favicon" %}
{% render "@embl-content-meta-properties", {"meta_who": "Group Jane", "meta_where": "Barcelona", "meta_what": "research", "meta_active": "what"} %}
{{#if _config.project.environment.local }}
<link rel="stylesheet" href="{{ path '/css/styles.css' }}">
{{/if}}
{{#if _config.project.environment.production }}
{% if _config.project.environment.local %}
<link rel="stylesheet" href="{{ '/css/styles.css' | path }}">
{% endif %}
{% if _config.project.environment.production %}
<link rel="stylesheet" href="https://dev.assets.emblstatic.net/vf/css/styles.css">
{{/if}}
{% endif %}
</head>
<body>
<header class="vf-header">
......@@ -39,32 +39,32 @@
</section>
<div class="vf-body">
{{> @vf-intro }}
{% render "@vf-intro" %}
<section class="vf-news-container | embl-grid embl-grid--has-sidebar">
{{> '@vf-section-header' section-title='Latest Press Releases'}}
{% render '@vf-section-header', {"section-title":"Latest Press Releases"} %}
<div class="vf-news-container__content">
{{ render '@vf-news-item' }}
{{ render '@vf-news-item' }}
{{ render '@vf-news-item' }}
{{ render '@vf-news-item' }}
{% render '@vf-news-item' %}
{% render '@vf-news-item' %}
{% render '@vf-news-item' %}
{% render '@vf-news-item' %}
</div>
<div class="vf-news-container__sidebar">
{{ render '@vf-news-item--snippet' }}
{{ render '@vf-news-item--snippet' }}
{{ render '@vf-news-item--snippet' }}
{% render '@vf-news-item--snippet' %}
{% render '@vf-news-item--snippet' %}
{% render '@vf-news-item--snippet' %}
</div>
</section>
<section class="vf-news-container | embl-grid embl-grid--alt">
{{> '@vf-section-header' section-title='Latest Press Releases'}}
{% render '@vf-section-header', {'section-title'='Latest Press Releases'} %}
{{> '@vf-figure'}}
{% render '@vf-figure' %}
</section>
......@@ -72,6 +72,6 @@
<link rel="import" href="https://dev.beta.embl.org/api/v1/pattern.html?filter-content-type=article&filter-id=569&pattern=node-body&source=contenthub" data-target="self" data-embl-js-content-hub-loader>
<script src="{{ path '/scripts/scripts.js' }}"></script>
<script src="{{ '/scripts/scripts.js' | path }}"></script>
</body>
</html>
{{> @embl-content-meta-properties meta-who="James Sharpe" meta-what="Sharpe Group" meta-where="EMBL Barcelona"}}
{% render "@embl-content-meta-properties", {"meta_who": "James Sharpe", "meta_what": "Sharpe Group", "meta_where": "EMBL Barcelona"} %}
<nav class="vf-breadcrumbs embl-breadcrumbs-lookup" aria-label="Breadcrumb" data-embl-js-breadcrumbs-lookup>
<div class="vf-text embl-breadcrumbs-lookup--loading-text"></div>
......
......@@ -4,13 +4,13 @@ preview: '@preview--blocks'
status: alpha
context:
pattern-type: embl-block
meta-who: all
meta-what: services, websites
meta-where: EMBL
meta-active: what
meta-utility: -8
meta-reach: -5
meta-maintainer: Strategy and Communications
meta-last-review: "2019-01-20"
meta-review-cycle: 180
meta-expiry: "2019-06-20"
meta_who: all
meta_what: services, websites
meta_where: EMBL
meta_active: what
meta_utility: -8
meta_reach: -5
meta_maintainer: Strategy and Communications
meta_last-review: "2019-01-20"
meta_review-cycle: 180
meta_expiry: "2019-06-20"
<!-- Content descriptors -->
<meta name="embl:who" content="{{ meta-who }}"> <!-- the people, groups and teams involved -->
<meta name="embl:where" content="{{ meta-where }}"> <!-- at which EMBL sites the content applies -->
<meta name="embl:what" content="{{ meta-what }}"> <!-- the activities covered -->
<meta name="embl:active" content="{{ meta-active }}"> <!-- which of the who/what/where is active -->
<meta name="embl:who" content="{{ meta_who }}"> <!-- the people, groups and teams involved -->
<meta name="embl:where" content="{{ meta_where }}"> <!-- at which EMBL sites the content applies -->
<meta name="embl:what" content="{{ meta_what }}"> <!-- the activities covered -->
<meta name="embl:active" content="{{ meta_active }}"> <!-- which of the who/what/where is active -->
<!-- Content role -->
<meta name="embl:utility" content="-8"> <!-- if content is task and work based or if is meant to inspire -->
<meta name="embl:reach" content="-5"> <!-- if content is externally (public) or internally focused (those that work at EMBL) -->
<!-- Page infromation -->
<meta name="embl:maintainer" content="{{ meta-maintainer }}"> <!-- the contact person or group responsible for the page -->
<meta name="embl:last-review" content="{{ meta-last-review }}"> <!-- the last time the page was reviewed or updated -->
<meta name="embl:review-cycle" content="{{ meta-review-cycle }}"> <!-- how long in days before the page should be checked -->
<meta name="embl:expiry" content="{{ meta-expiry }}"> <!-- if there is a fixed point in time when the page is no longer relevant -->
<meta name="embl:maintainer" content="{{ meta_maintainer }}"> <!-- the contact person or group responsible for the page -->
<meta name="embl:last-review" content="{{ meta-last_review }}"> <!-- the last time the page was reviewed or updated -->
<meta name="embl:review-cycle" content="{{ meta_review_cycle }}"> <!-- how long in days before the page should be checked -->
<meta name="embl:expiry" content="{{ meta_expiry }}"> <!-- if there is a fixed point in time when the page is no longer relevant -->
......@@ -26,6 +26,6 @@ _Make sure you import any requirements along with the modules._
The CSS classnames available should be used on their own on a Container or added to a Containers exisitng classname declaration in the HTML.
A EMBL Layout should only be applied to Containers. For Blocks you should use the [Visual Framework Grid System]({{ path '/docs/grids/grid-system' }}).
A EMBL Layout should only be applied to Containers. For Blocks you should use the [Visual Framework Grid System]({{ '/docs/grids/grid-system' | path }}).
If the EMBL Layout System is being added to a Container that has a classname we separate the classes in the HTML with a `|`.
<!DOCTYPE html>
<html lang="en" class="vf-no-js">
<head>
{{> @vf-no-js }}
{% render "@vf-no-js" %}
<title>{{ _target.title }} | {{ _config.project.title }}</title>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1, minimum-scale=1" name="viewport">
{{> @vf-favicon}}
{{> @embl-content-meta-properties meta-who="Group Jane" meta-where="Barcelona" meta-what="research,cancer" meta-active="what"}}
{% render "@vf-favicon" %}
{% render "@embl-content-meta-properties", {"meta_who": "Group Jane", "meta_where": "Barcelona", "meta_what": "research", "meta_active": "what"} %}
{{#if _config.project.environment.local }}
<link rel="stylesheet" href="{{ path '/css/styles.css' }}">
{{/if}}
{{#if _config.project.environment.production }}
{% if _config.project.environment.local %}
<link rel="stylesheet" href="{{ '/css/styles.css' | path }}">
{% endif %}
{% if _config.project.environment.production %}
<link rel="stylesheet" href="https://dev.assets.emblstatic.net/vf/css/styles.css">
{{/if}}
{% endif %}
</head>
<body>
<header class="vf-header">
......@@ -31,6 +31,6 @@
<link rel="import" href="https://dev.beta.embl.org/api/v1/pattern.html?filter-content-type=article&filter-id=569&pattern=node-body&source=contenthub" data-target="self" data-embl-js-content-hub-loader>
<script src="{{ path '/scripts/scripts.js' }}"></script>
<script src="{{ '/scripts/scripts.js' | path }}"></script>
</body>
</html>
......@@ -11,7 +11,7 @@
{{> @embl-content-meta-properties meta-who="Strategy and Communications" meta-where="EMBL" meta-what="Visual Framework" meta-last-review="2019-01-20" meta-active="what"}}
{{#if _config.project.environment.local }}
<link rel="stylesheet" href="{{ path '/css/styles.css' }}">
<link rel="stylesheet" href="{{ '/css/styles.css' | path }}">
{{/if}}
{{#if _config.project.environment.production }}
<link rel="stylesheet" href="https://dev.assets.emblstatic.net/vf/css/styles.css">
......@@ -81,7 +81,7 @@
<aside class="vf-inlay__content--additional">
<article class="vf-summary | vf-summary--profile vf-summary--profile-r">
<img class="vf-summary__image vf-summary__image--avatar" src="{{ path '/assets/vf-summary/assets/vf-summary--profile-img.png' }}" alt="">
<img class="vf-summary__image vf-summary__image--avatar" src="{{ '/assets/vf-summary/assets/vf-summary--profile-img.png' | path }}" alt="">
<h3 class="vf-summary__title">Person Name</h3>
<p class="vf-summary__text">Group Leader</p>
<a href="##" class="vf-summary__email">Contact Person</a>
......@@ -129,6 +129,6 @@
<link rel="import" href="https://dev.beta.embl.org/api/v1/pattern.html?filter-content-type=article&filter-id=569&pattern=node-body&source=contenthub" data-target="self" data-embl-js-content-hub-loader>
<script src="{{ path '/scripts/scripts.js' }}"></script>
<script src="{{ '/scripts/scripts.js' | path }}"></script>
</body>
</html>
<a href="http://www.embl.de" class="embl-logo">
<img src="{{ path '/assets/embl-logo/assets/logo.png' }}" alt="European Molecular Biology Laboratory Home">
<img src="{{ '/assets/embl-logo/assets/logo.png' | path }}" alt="European Molecular Biology Laboratory Home">
</a>
<!DOCTYPE html>
<html lang="en" class="vf-no-js">
<head>
{{> @vf-no-js }}
{% render "@vf-no-js" %}
<title>{{ _target.title }} | {{ _config.project.title }}</title>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1, minimum-scale=1" name="viewport">
{{> @vf-favicon}}
{{> @embl-content-meta-properties meta-who="Group Jane" meta-where="Barcelona" meta-what="research,cancer" meta-active="what"}}
{% render "@vf-favicon" %}
{% render "@embl-content-meta-properties", {"meta_who": "Group Jane", "meta_where": "Barcelona", "meta_what": "research", "meta_active": "what"} %}
{{#if _config.project.environment.local }}
<link rel="stylesheet" href="{{ path '/css/styles.css' }}">
{{/if}}
{{#if _config.project.environment.production }}
{% if _config.project.environment.local %}
<link rel="stylesheet" href="{{ '/css/styles.css' | path }}">
{% endif %}
{% if _config.project.environment.production %}
<link rel="stylesheet" href="https://dev.assets.emblstatic.net/vf/css/styles.css">
{{/if}}
{% endif %}
</head>
<body>
<header class="vf-header">
<link rel="import" href="https://dev.beta.embl.org/api/v1/pattern.html?filter-content-type=article&filter-id=574&pattern=node-body&source=contenthub" data-target="self" data-embl-js-content-hub-loader>
{{render '@vf-masthead'}}
{{render '@vf-navigation--main'}}
{{render '@vf-navigation--additional'}}
{% render '@vf-masthead' %}
{% render '@vf-navigation--main' %}
{% render '@vf-navigation--additional' %}
</header>
<!-- dismissible banner -->
......@@ -45,11 +42,11 @@
</section>
<div class="vf-body">
{{> @vf-intro }}
{% render "@vf-intro" %}
</div>
<link rel="import" href="https://dev.beta.embl.org/api/v1/pattern.html?filter-content-type=article&filter-id=569&pattern=node-body&source=contenthub" data-target="self" data-embl-js-content-hub-loader>
<script src="{{ path '/scripts/scripts.js' }}"></script>
<script src="{{ '/scripts/scripts.js' | path }}"></script>
</body>
</html>
<section class="vf-activity-group | embl-grid">
<h3 class="vf-activity-group__heading">Recent activity</h3>
{{render '@vf-activity-list'}}
{{render '@vf-activity-list'}}
{{render '@vf-activity-list'}}
{% render '@vf-activity-list' %}
{% render '@vf-activity-list' %}
{% render '@vf-activity-list' %}
</section>
<a href=""class="vf-badge vf-badge--primary">{{vf-badge-name}}</a>
<a href=""class="vf-badge vf-badge--primary">{{vf_badge_name}}</a>
<span class="vf-badge vf-badge--primary vf-badge--outline">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--outline">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--primary">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--secondary">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--tertiary">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--rounded">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--pill">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--primary">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--secondary">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--tertiary">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--rounded">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--pill">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--square"></span>
<span class="vf-badge vf-badge--primary vf-badge--outline">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--outline">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--primary">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--secondary">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--tertiary">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--primary">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--secondary">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--tertiary">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--rounded">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--pill">{{vf-badge-name}}</span>
<div class="vf-badge vf-badge--primary vf-badge--square" arta-label="{{vf-badge-name}}"></div>
<span class="vf-badge vf-badge--primary vf-badge--phases">{{vf-badge-name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--rounded">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--pill">{{vf_badge_name}}</span>
<div class="vf-badge vf-badge--primary vf-badge--square" arta-label="{{vf_badge_name}}"></div>
<span class="vf-badge vf-badge--primary vf-badge--phases">{{vf_badge_name}}</span>
<span class="vf-badge vf-badge--primary vf-badge--phases">beta</span>
......@@ -3,4 +3,4 @@ label: Badges
preview: '@preview--elements'
context:
pattern-type: element
vf-badge-name: alpha
vf_badge_name: alpha
<span class="vf-badge{{#if vf-badge-classes}} {{this}}{{/if}}">{{vf-badge-name}}</span>
<span class="vf-badge{% if vf-badge-classes %} {{this}}{% endif %}">{{vf_badge_name}}</span>
<!DOCTYPE html>
<html lang="en" class="vf-no-js">
<head>
{{> @vf-no-js }}
{% render "@vf-no-js" %}
<title>{{ _target.title }} | {{ _config.project.title }}</title>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1, minimum-scale=1" name="viewport">
{{> @vf-favicon}}
{{> @embl-content-meta-properties meta-who="Group Jane" meta-where="Barcelona" meta-what="research,cancer" meta-active="what"}}
{% render "@vf-favicon" %}
{% render "@embl-content-meta-properties", {"meta_who": "Group Jane", "meta_where": "Barcelona", "meta_what": "research", "meta_active": "what"} %}
{{#if _config.project.environment.local }}
<link rel="stylesheet" href="{{ path '/css/styles.css' }}">
{{/if}}
{{#if _config.project.environment.production }}
{% if _config.project.environment.local %}
<link rel="stylesheet" href="{{ '/css/styles.css' | path }}">
{% endif %}
{% if _config.project.environment.production %}
<link rel="stylesheet" href="https://dev.assets.emblstatic.net/vf/css/styles.css">
{{/if}}
{% endif %}
</head>
<body>
<header class="vf-header">
{{> @vf-global-header}}
{% render "@vf-global-header" %}
</header>
<!-- dismissible banner -->
......@@ -40,11 +40,11 @@
<div class="vf-body">
{{> @vf-intro }}
{% render "@vf-intro" %}
</div>
{{> @vf-footer }}
{% render "@vf-footer" %}
<script src="{{ path '/scripts/scripts.js' }}"></script>
<script src="{{ '/scripts/scripts.js' | path }}"></script>
</body>
</html>
......@@ -4,7 +4,7 @@
<ol class="vf-discussion__list | vf-list">
<li class="vf-discussion__item">
<div class="vf-discussion__meta">
<img class="vf-discussion__author-avatar" src="{{ path './vf-summary/assets/vf-summary--profile-img.png' }}" alt="">
<img class="vf-discussion__author-avatar" src="{{ './vf-summary/assets/vf-summary--profile-img.png' | path }}" alt="">
<cite class="vf-discussion__author">Title If Relevant</cite><span> says:</span>
<p class="vf-discussion__date">15th February 2018</p>
</div>
......@@ -19,7 +19,7 @@
<li class="vf-discussion__item">
<div class="vf-discussion__meta">
<img class="vf-discussion__author-avatar" src="{{ path './vf-summary/assets/vf-summary--profile-img.png' }}" alt="">
<img class="vf-discussion__author-avatar" src="{{ './vf-summary/assets/vf-summary--profile-img.png' | path }}" alt="">
<cite class="vf-discussion__author">Title If Relevant</cite><span> says:</span>
<p class="vf-discussion__date">15th February 2018</p>
</div>
......@@ -31,7 +31,7 @@
<ol class="vf-discussion__list | vf-list">
<li class="vf-discussion__item">
<div class="vf-discussion__meta">
<img class="vf-discussion__author-avatar" src="{{ path './vf-summary/assets/vf-summary--profile-img.png' }}" alt="">
<img class="vf-discussion__author-avatar" src="{{ './vf-summary/assets/vf-summary--profile-img.png' | path }}" alt="">
<cite class="vf-discussion__author">Title If Relevant</cite><span> says:</span>
<p class="vf-discussion__date">15th February 2018</p>
</div>
......
<figure class="vf-figure">
<img class="vf-figure__image" src="{{ path '/assets/vf-figure/assets/figure-example.png' }}" alt="">
<img class="vf-figure__image" src="{{ '/assets/vf-figure/assets/figure-example.png' | path }}" alt="">
<figcaption class="vf-figure__caption">Version, 1982, Adenovirus with 217 dots</figcaption>
</figure>
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment