gulpjs * new spritesmith plugin * reworked exports * new nunjucks-render version fixing dependency issues! File structure New naming scheme for nunjucks files. Underscore used for files which are imported and not directly displayed. Nunjucks blocks where renamed and are placed differently. New macro for navigational elements.
52 lines
1.9 KiB
Text
52 lines
1.9 KiB
Text
<!-- page-index.njk -->
|
|
{% set pageId = "index" %}
|
|
{% set pageClass = "height_full" %}
|
|
|
|
{% extends "demo/_default.njk" %}
|
|
|
|
{% block title %}Index{% endblock %}
|
|
{% block head %}
|
|
{{ super() }}
|
|
{% endblock %}
|
|
|
|
{% block body %}
|
|
<div class="wrap">
|
|
<div class="hello">
|
|
<h2>This is {{hippie.brand | upper}}</h2>
|
|
<p>You can start using it by replacing this file with your own index page.</p>
|
|
<p>To do this you need to open the file <code>/gulpfile.js</code> and comment out the line <code>index: "demo.html",</code>. Then you need to place your index file (<code>index.njk</code>) into the folder <code>/source/pages</code>.</p>
|
|
<p>For a very basic start you can make a copy of the demo page <code>blank.njk</code>. You can find it at <code>/source/pages/demo</code>.</p>
|
|
<p>The <i>demo</i> folder contains an overview of all elements and also examples for style combinations and even whole page layouts.<br/>Follow the white rabbit.</p>
|
|
<h3>Overview</h3>
|
|
<nav>
|
|
<ul class="list_link">
|
|
<!-- Loops through "demoadditionallinks" array -->
|
|
{% for link in data.demoadditionallinks %}
|
|
<li><a href="{{link.href}}">{{link.text}}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
</nav>
|
|
<div class="pos_rel">
|
|
<pre class="txt_tiny txt_white pos_abs pin_down pin_right"> ()()<br> (..)<br>C(")(")</pre>
|
|
<h3>Demo Pages</h3>
|
|
</div>
|
|
<ul class="list_link">
|
|
<!-- Loops through "demo-links" array -->
|
|
{% for link in data.demolinks %}
|
|
<li><a href="{{link.href}}">{{link.text}}</a></li>
|
|
{% endfor %}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|
|
|
|
{% block script %}
|
|
{{ super() }}
|
|
<script src="./js/{{hippie.jsFile}}.min.js" type="text/javascript"></script>
|
|
<script type="text/javascript">
|
|
// Page specific
|
|
// ------------------------------------------------------------------------------
|
|
$( document ).ready(function() {
|
|
});
|
|
</script>
|
|
{% endblock %}
|