Skip to content

Commit 6b77929

Browse files
committed
WIP. Testing behavior if I backport recent Styleguidekit Mustache Default template changes over to the Styleguidekit Twig Default repo
1 parent f654509 commit 6b77929

File tree

6 files changed

+132
-186
lines changed

6 files changed

+132
-186
lines changed

composer.json

Lines changed: 27 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,29 @@
11
{
2-
"name": "pattern-lab/styleguidekit-twig-default",
3-
"description": "The default Twig-based StyleguideKit for Pattern Lab. Contains styles and mark-up for Pattern Lab's front-end.",
4-
"keywords": ["twig", "pattern lab", "styleguide"],
5-
"homepage": "http://patternlab.io",
6-
"license": "MIT",
7-
"type": "patternlab-styleguidekit",
8-
"authors": [
9-
{
10-
"name": "Dave Olsen",
11-
"email": "[email protected]",
12-
"homepage": "http://dmolsen.com",
13-
"role": "Lead Developer"
14-
},
15-
{
16-
"name": "Brad Frost",
17-
"homepage": "http://bradfrostweb.com",
18-
"role": "Creator"
19-
}
20-
],
21-
"support": {
22-
"issues": "https://github.com/pattern-lab/styleguidekit-twig-default/issues",
23-
"wiki": "http://patternlab.io/docs/",
24-
"source": "https://github.com/pattern-lab/styleguidekit-twig-default/releases"
25-
},
26-
"require": {
27-
"pattern-lab/styleguidekit-assets-default": "dev-dev"
28-
}
2+
"name": "pattern-lab/styleguidekit-twig-default",
3+
"description": "The default Twig-based StyleguideKit for Pattern Lab. Contains styles and mark-up for Pattern Lab's front-end.",
4+
"keywords": ["twig", "pattern lab", "styleguide"],
5+
"homepage": "http://patternlab.io",
6+
"license": "MIT",
7+
"type": "patternlab-styleguidekit",
8+
"authors": [
9+
{
10+
"name": "Dave Olsen",
11+
"email": "[email protected]",
12+
"homepage": "http://dmolsen.com",
13+
"role": "Lead Developer"
14+
},
15+
{
16+
"name": "Brad Frost",
17+
"homepage": "http://bradfrostweb.com",
18+
"role": "Creator"
19+
}
20+
],
21+
"support": {
22+
"issues": "https://github.com/pattern-lab/styleguidekit-twig-default/issues",
23+
"wiki": "http://patternlab.io/docs/",
24+
"source": "https://github.com/pattern-lab/styleguidekit-twig-default/releases"
25+
},
26+
"require": {
27+
"pattern-lab/styleguidekit-assets-default": "^3.0.0"
28+
}
2929
}

views/partials/general-footer.twig

Lines changed: 56 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -1,59 +1,59 @@
1-
<script>
2-
var patternData = {{ patternData | raw }};
3-
</script>
1+
<script type="text/json" id="sg-pattern-data-footer" class="sg-pattern-data">
2+
{{ patternData | raw }}
3+
</script>
44

5-
<script>
6-
/*!
7-
* scriptLoader - v0.1
8-
*
9-
* Copyright (c) 2014 Dave Olsen, http://dmolsen.com
10-
* Licensed under the MIT license
11-
*
12-
*/
13-
14-
var scriptLoader = {
15-
16-
run: function(js,cb,target) {
17-
var s = document.getElementById(target+'-'+cb);
18-
for (var i = 0; i < js.length; i++) {
19-
var src = (typeof js[i] != "string") ? js[i].src : js[i];
20-
var c = document.createElement('script');
21-
c.src = '../../'+src+'?'+cb;
22-
if (typeof js[i] != "string") {
23-
if (js[i].dep !== undefined) {
24-
c.onload = function(dep,cb,target) {
25-
return function() {
26-
scriptLoader.run(dep,cb,target);
27-
}
28-
}(js[i].dep,cb,target);
29-
}
30-
}
31-
s.parentNode.insertBefore(c,s);
32-
}
33-
}
34-
35-
}
36-
</script>
5+
<script>
6+
/*!
7+
* scriptLoader - v0.1
8+
*
9+
* Copyright (c) 2014 Dave Olsen, http://dmolsen.com
10+
* Licensed under the MIT license
11+
*
12+
*/
13+
14+
var scriptLoader = {
15+
16+
run: function(js,cb,target) {
17+
var s = document.getElementById(target+'-'+cb);
18+
for (var i = 0; i < js.length; i++) {
19+
var src = (typeof js[i] != 'string') ? js[i].src : js[i];
20+
var c = document.createElement('script');
21+
c.src = '../../'+src+'?'+cb;
22+
if (typeof js[i] != 'string') {
23+
if (js[i].dep !== undefined) {
24+
c.onload = function(dep,cb,target) {
25+
return function() {
26+
scriptLoader.run(dep,cb,target);
27+
}
28+
}(js[i].dep,cb,target);
29+
}
30+
}
31+
s.parentNode.insertBefore(c,s);
32+
}
33+
}
34+
35+
}
36+
</script>
3737

38-
<script id="pl-js-polyfill-insert-{{ cacheBuster }}">
39-
(function() {
40-
if (self != top) {
41-
var cb = '{{ cacheBuster}}';
42-
var js = [];
43-
if (typeof document !== "undefined" && !("classList" in document.documentElement)) {
44-
js.push("styleguide/bower_components/classList.min.js");
45-
}
46-
scriptLoader.run(js,cb,'pl-js-polyfill-insert');
47-
}
48-
})();
49-
</script>
38+
<script id="pl-js-polyfill-insert-{{ cacheBuster }}">
39+
(function() {
40+
if (self != top) {
41+
var cb = '{{ cacheBuster}}';
42+
var js = [];
43+
if (typeof document !== 'undefined' && !('classList' in document.documentElement)) {
44+
js.push('styleguide/bower_components/classList.min.js');
45+
}
46+
scriptLoader.run(js,cb,'pl-js-polyfill-insert');
47+
}
48+
})();
49+
</script>
5050

51-
<script id="pl-js-insert-{{ cacheBuster }}">
52-
(function() {
53-
if (self != top) {
54-
var cb = '{{ cacheBuster}}';
55-
var js = [ { "src": "styleguide/bower_components/jwerty.min.js", "dep": [ { "src": "annotations/annotations.js", "dep": [ "styleguide/js/patternlab-pattern.min.js" ] } ] } ];
56-
scriptLoader.run(js,cb,'pl-js-insert');
57-
}
58-
})();
59-
</script>
51+
<script id="pl-js-insert-{{ cacheBuster }}">
52+
(function() {
53+
if (self != top) {
54+
var cb = '{{ cacheBuster}}';
55+
var js = [ { 'src': 'styleguide/bower_components/jwerty.min.js', 'dep': [ 'styleguide/js/patternlab-pattern.min.js' ] } ];
56+
scriptLoader.run(js,cb,'pl-js-insert');
57+
}
58+
})();
59+
</script>

views/partials/general-header.twig

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@
55
<meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
66
<meta http-equiv="pragma" content="no-cache" />
77

8-
<link rel="stylesheet" href="../../styleguide/css/styleguide.css?{{ cacheBuster }}" media="all">
9-
<link rel="stylesheet" href="../../styleguide/css/styleguide-specific.css?{{ cacheBuster }}" media="all" />
8+
<!-- <link rel="stylesheet" href="../../styleguide/css/styleguide.css?{{ cacheBuster }}" media="all">
9+
<link rel="stylesheet" href="../../styleguide/css/styleguide-specific.css?{{ cacheBuster }}" media="all" /> -->
1010

11+
12+
<link rel="stylesheet" href="../../styleguide/css/styleguide.min.css?{{ cacheBuster }}" media="all">
13+
<link rel="stylesheet" href="../../styleguide/css/prism-typeahead.min.css?{{ cacheBuster }}" media="all" />

views/partials/patternSection.twig

Lines changed: 22 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -1,80 +1,23 @@
11
<div id="{{ partial.patternPartial }}" class="sg-pattern">
2-
<div class="sg-pattern-head">
3-
<h3><a href="../../patterns/{{ partial.patternLink }}" class="patternLink" data-patternpartial="{{ partial.patternPartial }}">{{ partial.patternName }}</a></h3>
4-
<div class="sg-pattern-head-actions">
5-
<!--Pattern header options-->
6-
</div>
7-
</div>
8-
{% if partial.patternDescExists %}
9-
<div class="sg-pattern-desc">
10-
<p>{{ partial.patternDesc | raw }}</p>
11-
{% for patternDescAddition in partial.patternDescAdditions %}
12-
{{ patternDescAddition | raw }}
13-
{% endfor %}
14-
</div>
15-
{% endif %}
16-
<div class="sg-pattern-example">
17-
{{ partial.patternPartialCode | raw }}
18-
</div>
19-
{% for patternExampleAddition in partial.patternExampleAdditions %}
20-
{{ patternExampleAddition | raw }}
21-
{% endfor %}
22-
<div class="sg-pattern-extra">
23-
<div class="sg-pattern-extra-annotations" style="display: none">
24-
<span class="sg-pattern-extra-name">Annotations</span>
25-
<div id="sg-pattern-extra-annotations-container">
26-
</div>
27-
</div>
28-
<div class="sg-pattern-extra-html" style="display: none">
29-
<span class="sg-pattern-extra-name">HTML</span>
30-
<pre>
31-
<code id="sg-pattern-extra-html-container">
32-
{{ partial.patternPartialCodeE | raw }}
33-
</code>
34-
</pre>
35-
</div>
36-
<div class="sg-pattern-extra-engine" style="display: none">
37-
<span class="sg-pattern-extra-name">{{ partial.patternEngineName }}</span>
38-
<pre>
39-
<code id="sg-pattern-extra-engine-container">
40-
</code>
41-
</pre>
42-
</div>
43-
<div class="sg-pattern-extra-lineage" style="display: none">
44-
<span class="sg-pattern-extra-name">Lineages</span>
45-
{% if partial.patternLineageExists %}
46-
<div class="sg-pattern-extra-lineage">
47-
The <span class="sg-pattern-extra-lineage-name">{{ partial.patternPartial }}</span> pattern contains the following pattern(s):
48-
<ul>
49-
{% for patternLineage in partial.patternLineages %}
50-
<li> <a href="{{ patternLineage.lineagePath }}" class="{% if patternLineage.lineageState %}sg-pattern-state {{ patternLineage.lineageState }} {% endif %}" data-patternpartial="{{ patternLineage.lineagePattern }}">{{ patternLineage.lineagePattern }}</a></li>
51-
{% endfor %}
52-
</ul>
53-
</div>
54-
{% endif %}
55-
{% if partial.patternLineageRExists %}
56-
<div class="sg-pattern-extra-lineage">
57-
The <span class="sg-pattern-extra-lineage-name">{{ partial.patternPartial }}</span> pattern is included in the following pattern(s):
58-
<ul>
59-
{% for patternLineageR in partial.patternLineagesR %}
60-
<li> <a href="{{ patternLineageR.lineagePath }}" class="{% if patternLineageR.lineageState %}sg-pattern-state {{ patternLineageR.lineageState }} {% endif %}" data-patternpartial="{{ patternLineageR.lineagePattern }}">{{ patternLineageR.lineagePattern }}</a></li>
61-
{% endfor %}
62-
</ul>
63-
</div>
64-
{% endif %}
65-
{% if not partial.patternLineageEExists %}
66-
The <span class="sg-pattern-extra-lineage-name">{{ partial.patternPartial }}</span> pattern doesn't have any lineage information.
67-
{% endif %}
68-
</div>
69-
{% if partial.patternCSSExists %}
70-
<div class="sg-pattern-extra-css" style="display: none">
71-
<span class="sg-pattern-extra-name">{{ partial.patternEngineName }}</span>
72-
<pre>
73-
<code id="sg-pattern-extra-engine-container">
74-
{{ partial.patternCSS }}
75-
</code>
76-
</pre>
77-
</div>
78-
{% endif %}
79-
</div>
80-
</div>
2+
<div class="sg-pattern-head">
3+
<h3 class="sg-pattern-title">
4+
<a href="../../patterns/{{ partial.patternLink }}" class="patternLink" data-patternpartial="{{ partial.patternPartial }}" title="Link to Pattern">
5+
{{ partial.patternName }}
6+
{% if partial.patternState %}
7+
<span class="sg-pattern-state {{ partial.patternState }}">{{ partial.patternState }}</span>
8+
{% endif %}
9+
</a>
10+
</h3>
11+
<div class="sg-pattern-breadcrumb">{{ partial.patternBreadcrumb }}</div>
12+
<a href="#" data-patternpartial="{{ partial.patternPartial }}" title="View Pattern Info" id="sg-pattern-extra-toggle-{{partial.patternPartial}}" class="sg-pattern-extra-toggle"><span>&#9660;</span></a>
13+
</div>
14+
<div class="sg-pattern-extra" id="sg-pattern-extra-{{ partial.patternPartial }}">
15+
16+
</div>
17+
<div class="sg-pattern-example">
18+
{{ partial.patternPartialCode | raw }}
19+
</div>
20+
<script type="text/json" id="sg-pattern-data-{{partial.patternPartial}}" class="sg-pattern-data">
21+
{{ partial.patternData }}
22+
</script>
23+
</div><!--end .sg-pattern-->
Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<div id="{{ partial.patternPartial }}" class="sg-subtype">
2-
<h2><a href="../../patterns/{{ partial.patternLink }}" class="patternLink" data-patternpartial="{{ partial.patternPartial }}">{{ partial.patternName }}</a></h2>
3-
<div class="sg-pattern-body">
4-
{{ partial.patternDesc | raw }}
5-
</div>
6-
</div>
2+
<h2><a href="../../patterns/{{ partial.patternLink }}" class="patternLink" data-patternpartial="{{ partial.patternPartial }}">{{ partial.patternName }}</a></h2>
3+
<div class="sg-pattern-body">
4+
{{ partial.patternDesc | raw }}
5+
</div>
6+
</div>

views/viewall.twig

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
11

22
<!-- View All Patterns in a Pattern Sub-Type -->
33
<div class="sg-main" role="main">
4-
5-
<!-- Patterns -->
6-
<div id="sg-patterns">
7-
{% for partial in partials %}
8-
{% if partial.patternSectionSubtype %}
9-
{% include "patternSectionSubtype.twig" %}
10-
{% else %}
11-
{% include "patternSection.twig" %}
12-
{% endif %}
13-
{% endfor %}
14-
</div> <!--end #sg-patterns-->
15-
4+
5+
<!-- Patterns -->
6+
<div id="sg-patterns">
7+
{% for partial in partials %}
8+
{% if partial.patternSectionSubtype %}
9+
{% include "patternSectionSubtype.twig" %}
10+
{% else %}
11+
{% include "patternSection.twig" %}
12+
{% endif %}
13+
{% endfor %}
14+
</div> <!--end #sg-patterns-->
1615
</div><!--end .sg-main-->
1716

17+
1818
<!-- JS to hook everything together and do annotations -->
19-
<script>
20-
// handle injection of items from builder
21-
var patternPartial = "{{ patternPartial }}";
22-
var lineage = "";
23-
</script>
19+
<!-- <script>
20+
// handle injection of items from builder
21+
var patternPartial = "{{ patternPartial }}";
22+
var lineage = "";
23+
</script> -->

0 commit comments

Comments
 (0)