Skip to content

Commit 19ee7d1

Browse files
author
Ryan A. Johnson
committed
refactor(Layouts): update templates
* Update horizontal/vertical layout templates to use CDN for webcomponents polyfills * Replace webcomponentsjs polyfills with CDN assets
1 parent 61af775 commit 19ee7d1

17 files changed

+42
-1065
lines changed

‎docs/_templates/partials/after_footer.njk‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
elAdapter.parentElement.removeChild(elAdapter);
1010
}
1111
</script>
12-
<script src="vendor/scripts/custom-elements-es5-adapter.js"></script>
12+
<script src="{{ data.cdn.webComponents }}/custom-elements-es5-adapter.js"></script>
1313
</span>
1414

1515
<script src="https://code.jquery.com/jquery-3.2.1.min.js"

‎docs/_templates/partials/head.njk‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,5 +10,5 @@
1010
<link rel="stylesheet" href="docs.css">
1111

1212
<!-- Polyfill Loader -->
13-
<script src="vendor/scripts/webcomponents-loader.js"></script>
13+
<script src="{{ data.cdn.webComponents }}/webcomponents-loader.js"></script>
1414
</head>

‎docs/_templates/partials/lorem-nav.njk‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
<a href="#">Link 1</a>
2+
<a href="#">Link 2</a>
3+
<a href="#">Link 3</a>
4+
5+
<hx-disclosure aria-controls="section-1">
6+
Section 1
7+
<hx-icon class="toggle-icon" type="angle-down"></hx-icon>
8+
</hx-disclosure>
9+
<hx-reveal id="section-1" open>
10+
<a href="#">Link 1-1</a>
11+
<a href="#">Link 1-2</a>
12+
<a href="#">Link 1-3</a>
13+
14+
<hx-disclosure aria-controls="section-1-2">
15+
Section 2
16+
<hx-icon class="toggle-icon" type="angle-down"></hx-icon>
17+
</hx-disclosure>
18+
<hx-reveal id="section-1-2" open>
19+
<a href="#">Link 2-1</a>
20+
<a href="#">Link 2-2</a>
21+
<a href="#">Link 2-3</a>
22+
</hx-reveal>
23+
</hx-reveal>
24+

‎docs/components/layouts/horizontal-layout-template.html‎

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,7 @@
1515

1616
<!-- FIXME: Add your application styles here! -->
1717

18-
<!-- FIXME: point to loader in node_modules/@webcomponents/webcomponentsjs -->
19-
<script src="vendor/scripts/webcomponents-loader.js"></script>
18+
<script src="{{ data.cdn.webComponents }}/webcomponents-loader.js"></script>
2019
</head>
2120
<body class="hxHorizontal" id="top">
2221
<!--
@@ -31,7 +30,9 @@
3130
<div id="app">
3231
<div id="stage">
3332
<nav id="nav" class="hxNav">
34-
{% include 'partials/app_nav.njk' %}
33+
<!-- Product Navigation -->
34+
{% include 'partials/lorem-nav.njk' %}
35+
<!-- end:Product Navigation -->
3536
</nav>
3637

3738
<!--
@@ -53,14 +54,9 @@
5354
</nav>
5455
<h1>Left Panel</h1>
5556

56-
<div class="hxAlert">
57-
<div class="hxAlert__icon">
58-
<hx-icon type="info-circle"></hx-icon>
59-
</div>
60-
<div class="hxAlert__text">
61-
Copy the source of this page to use as a template for your application.
62-
</div>
63-
</div>
57+
<hx-alert type="info" static>
58+
Copy the source of this page to use as a template for your application.
59+
</hx-alert>
6460

6561
<ul>
6662
<li>
@@ -114,8 +110,7 @@ <h2>Right Panel</h2>
114110
elAdapter.parentElement.removeChild(elAdapter);
115111
}
116112
</script>
117-
<!-- FIXME: point to adapter in node_modules/@webcomponents/webcomponentsjs -->
118-
<script src="vendor/scripts/custom-elements-es5-adapter.js"></script>
113+
<script src="{{ data.cdn.webComponents }}/custom-elements-es5-adapter.js"></script>
119114
</span>
120115

121116
<!-- FIXME: point to HelixUI behavior in node_modules/helix-ui -->

‎docs/components/layouts/vertical-layout-template.html‎

Lines changed: 8 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -15,8 +15,7 @@
1515

1616
<!-- FIXME: Add your application styles here! -->
1717

18-
<!-- FIXME: point to loader in node_modules/@webcomponents/webcomponentsjs -->
19-
<script src="vendor/scripts/webcomponents-loader.js"></script>
18+
<script src="{{ data.cdn.webComponents }}/webcomponents-loader.js"></script>
2019
</head>
2120
<body class="hxVertical" id="top">
2221
<!--
@@ -31,9 +30,9 @@
3130
<div id="app">
3231
<div id="stage">
3332
<nav id="nav" class="hxNav">
34-
<!-- Left Navigation -->
35-
{% include 'partials/app_nav.njk' %}
36-
<!-- end:Left Navigation -->
33+
<!-- Product Navigation -->
34+
{% include 'partials/lorem-nav.njk' %}
35+
<!-- end:Product Navigation -->
3736
</nav>
3837

3938
<!--
@@ -51,14 +50,9 @@
5150

5251
<h1>Page Content</h1>
5352

54-
<div class="hxAlert">
55-
<div class="hxAlert__icon">
56-
<hx-icon type="info-circle"></hx-icon>
57-
</div>
58-
<div class="hxAlert__text">
59-
Copy the source of this page to use as a template for your application.
60-
</div>
61-
</div>
53+
<hx-alert type="info" static>
54+
Copy the source of this page to use as a template for your application.
55+
</hx-alert>
6256

6357
<ul>
6458
<li>
@@ -111,8 +105,7 @@ <h1>Page Content</h1>
111105
elAdapter.parentElement.removeChild(elAdapter);
112106
}
113107
</script>
114-
<!-- FIXME: point to adapter in node_modules/@webcomponents/webcomponentsjs -->
115-
<script src="vendor/scripts/custom-elements-es5-adapter.js"></script>
108+
<script src="{{ data.cdn.webComponents }}/custom-elements-es5-adapter.js"></script>
116109
</span>
117110

118111
<!-- FIXME: point to HelixUI behavior in node_modules/helix-ui -->

0 commit comments

Comments
 (0)