Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor/nunjucks ification #302

Merged
merged 30 commits into from
Mar 25, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
30 commits
Select commit Hold shift + click to select a range
0202459
adds nunjucks fractal adapter as a dependency
Mar 14, 2019
aaff77c
starts removing handlebars from fractal.js and adding nunjucks
Mar 14, 2019
50f65d3
Approcah 1 to variant modifiers
khawkins98 Mar 18, 2019
d6b31dc
Approach 2 to variant modifiers
khawkins98 Mar 18, 2019
dee4540
Merge branch 'develop' into refactor/nunjucks-ification
khawkins98 Mar 19, 2019
161f564
Update package.json
khawkins98 Mar 19, 2019
84824d2
Update to frctl/nunjucks 2.0
khawkins98 Mar 19, 2019
ab76227
Get pattern library theme working
khawkins98 Mar 19, 2019
c8d888f
Convert a few patterns to `.nunj`
khawkins98 Mar 19, 2019
86c9b6a
Convert preview to .nunj
khawkins98 Mar 19, 2019
1a9a4eb
Supporting patterns
khawkins98 Mar 19, 2019
de024c0
Eample of passing values to patterns
khawkins98 Mar 19, 2019
96cdb29
Drop the mandelbrot theme
khawkins98 Mar 20, 2019
3bff9ef
Make a full fractal theme
khawkins98 Mar 20, 2019
19c477c
Use .njk instead of .nunj for docs, components
khawkins98 Mar 20, 2019
c03d0d4
Makes all the patterns, docs .njk
khawkins98 Mar 20, 2019
010d394
Don't escape components, strip white space
khawkins98 Mar 21, 2019
3715b0a
Cleanup, minor fixes
khawkins98 Mar 21, 2019
ea049a6
Merge branch 'feature/variant-modifiers' into refactor/nunjucks-ifica…
khawkins98 Mar 22, 2019
da64367
Use a more svelte approach to #310 with Nunj
khawkins98 Mar 22, 2019
4672f88
Commit theme dist
khawkins98 Mar 22, 2019
a881ce3
Remove unused theme JS
khawkins98 Mar 22, 2019
c851547
Update pattern syntax differences between nunj, hbs
khawkins98 Mar 22, 2019
7e08c80
Fix rendering errors
khawkins98 Mar 22, 2019
f313bd6
Merge branch 'develop' into refactor/nunjucks-ification
khawkins98 Mar 25, 2019
27a6d2b
Package files should point to .njk (.hbs now removed)
khawkins98 Mar 25, 2019
cafa939
Port html codeblock helper to nunjucks extension
khawkins98 Mar 25, 2019
db726cc
Make pattern YAML context available to readme
khawkins98 Mar 25, 2019
668597c
Cleanup dead code
khawkins98 Mar 25, 2019
b459f81
Merge pull request #318 from visual-framework/feature/nunjucks-extens…
Mar 25, 2019
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
  •  
  •  
  •  
Original file line number Diff line number Diff line change
@@ -1,27 +1,27 @@
<!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}}
{% render '@vf-favicon' %}

{{#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/develop/css/styles.css">
{{/if}}
{% endif %}
</head>
<body class="">
<div class="vf-grid">
<div class="vf-pattern__container">
{{{ yield }}}
{{ yield | safe }}
</div>
</div>
<script src="{{ path '/scripts/scripts.js' }}"></script>
<script src="{{ '/scripts/scripts.js' | path }}"></script>
</body>
</html>
1 change: 0 additions & 1 deletion components/_previews/_preview--fullhtml.hbs

This file was deleted.

1 change: 1 addition & 0 deletions components/_previews/_preview--fullhtml.njk
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
{{ yield | safe }}
Original file line number Diff line number Diff line change
@@ -1,27 +1,27 @@
<!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}}
{% render '@vf-favicon' %}

{{#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/develop/css/styles.css">
{{/if}}
{% endif %}
</head>
<body class="">
<div class="vf-grid">
<div class="vf-pattern__container">
{{{ yield }}}
{{ yield | safe }}
</div>
</div>
<script src="{{ path '/scripts/scripts.js' }}"></script>
<script src="{{ '/scripts/scripts.js' | path }}"></script>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -1,25 +1,23 @@
<!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}}
{% render '@vf-favicon' %}

{{#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/develop/css/styles.css">
{{/if}}
{% endif %}
</head>
<body>

{{{ yield }}}

<script src="{{ path '/scripts/scripts.js' }}"></script>
{{ yield | safe }}
<script src="{{ '/scripts/scripts.js' | path }}"></script>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -1,28 +1,28 @@
<!DOCTYPE html>
<html lang="en" class="vf-no-js">
<head>
{{> @vf-no-js }}
<title>{{ _target.title }} | Visual Framework</title>
{% 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}}
{% render '@vf-favicon' %}

{{#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/develop/css/styles.css">
{{/if}}
{% endif %}
</head>
<body class="vf-body">
<div class="vf-grid">
<div class="vf-pattern__container">
{{{ yield }}}
{{ yield | safe }}
</div>
</div>

<script src="{{ path '/scripts/scripts.js' }}"></script>
<script src="{{ '/scripts/scripts.js' | path }}"></script>
</body>
</html>
Original file line number Diff line number Diff line change
@@ -1,21 +1,21 @@
<!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 }}
<link rel="stylesheet" href="https://dev.assets.emblstatic.net/vf/develop/css/styles.css">
{{/if}}
{% 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">
{% endif %}
</head>
<body>
<header class="vf-header">
Expand All @@ -30,48 +30,48 @@
Don't need to customise the EMBL Design Language for Websites?
</h3>
<p class="vf-banner__text">Here's the core CSS and JS you need. Don't forget to <a href="http://dev.beta.embl.org/guidelines/visual-framework/dev-docs/" class="vf-link">consult the pattern library</a>.</p>
{{~#codeblockhtml~}}
{% codeblock 'html' -%}
<link rel="stylesheet" href="https://dev.assets.emblstatic.net/vf/develop/css/styles.css">
<script src="https://dev.assets.emblstatic.net/vf/develop/scripts/scripts.js"></script>
{{/codeblockhtml}}
{% endcodeblock %}
</div>
</div>
</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>

</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>
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
{{> @embl-content-meta-properties meta-who="James Sharpe" meta-what="Sharpe Group" meta-where="EMBL Barcelona" meta-active="what"}}
{% 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-list vf-list--inline | vf-breadcrumbs__list | embl-breadcrumbs-lookup--ghosting"></div>
Expand Down
2 changes: 1 addition & 1 deletion components/embl-conditional-edit/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@
"embl-conditional-edit.scss",
"embl-conditional-edit.css",
"embl-conditional-edit.js",
"embl-conditional-edit.hbs",
"embl-conditional-edit.njk",
"embl-conditional-edit.config.yml"
],
"test": "echo \"Error: no test specified\" && exit 1",
Expand Down
2 changes: 1 addition & 1 deletion components/embl-content-hub-loader/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
"embl-content-hub-loader.js",
"embl-content-hub-loader__fetch.js",
"embl-content-hub-loader__html-imports.js",
"embl-content-hub-loader.hbs",
"embl-content-hub-loader.njk",
"embl-content-hub-loader.config.yml"
],
"test": "echo \"Error: no test specified\" && exit 1",
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -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"
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
<!-- 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 -->
2 changes: 1 addition & 1 deletion components/embl-grid/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -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 `|`.
File renamed without changes.
Original file line number Diff line number Diff line change
@@ -1,21 +1,21 @@
<!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 }}
<link rel="stylesheet" href="https://dev.assets.emblstatic.net/vf/develop/css/styles.css">
{{/if}}
{% 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">
{% endif %}
</head>
<body>
<header class="vf-header">
Expand All @@ -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>
Loading