<!DOCTYPE html>
<html<% if(htmlWebpackPlugin.files.manifest) { %> manifest="<%= htmlWebpackPlugin.files.manifest %>"<% } %>>
  <head>
    <meta charset="UTF-8">
    <title><%= htmlWebpackPlugin.options.title || 'Webpack App'%></title>

    <% if (htmlWebpackPlugin.files.favicon) { %>
    <link rel="shortcut icon" href="<%= htmlWebpackPlugin.files.favicon%>">
    <% } %>

    <% if (htmlWebpackPlugin.options.mobile) { %>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <% } %>

    <% for (var css in htmlWebpackPlugin.files.css) { %>
    <link href="<%= htmlWebpackPlugin.files.css[css] %>" rel="stylesheet">
    <% } %>

    <% if (htmlWebpackPlugin.options.baseHref) { %>
    <base href="<%= htmlWebpackPlugin.options.baseHref %>" />
    <% } %>
  </head>
  <body>
    <div class="pure-g">
      <header class="pure-u-1">
        <% if (htmlWebpackPlugin.options.name) { %>
        <h1><%= htmlWebpackPlugin.options.name %></h1>
        <% } %>

        <% if (htmlWebpackPlugin.options.description) { %>
        <div class="description"><%= htmlWebpackPlugin.options.description %></div>
        <% } %>
      </header>

      <article class="pure-u-1">
        <h2>Demonstration</h2>
        <section class="demonstration">
          <%= htmlWebpackPlugin.options.demonstration %>
        </section>

        <h2>Documentation</h2>
        <section class="documentation">
          <%= htmlWebpackPlugin.options.documentation %>
        </section>
      </article>
    </div>

    <% for (var chunk in htmlWebpackPlugin.files.chunks) { %>
      <script src="<%= htmlWebpackPlugin.files.chunks[chunk].entry %>"></script>
    <% } %>
  </body>
</html>
