Bruut

# Templating

All templates are located in src/templates. We work with Pug or with Twig, depending on the project needs.

Folder What's in it
blueprints To keep stuff DRY, we use a page skeleton or blueprint that takes care of the repeating stuff (header, footer) on each page. Every template will inherit a blueprint from this folder.
mixins Here we keep snippets that we often need in the prototypes. Think of it as little snippets of code / components, like a form field or responsive image. In the templates, these mixins are called like this: {% include 'mixins/_mixin.twig' with { foo : 'bar' } %}
partials Partials are larger pieces of template, like a header or footer

Most pages will use the page blueprint in blueprints. This will take care of the page skeleton. A page with the page blueprint looks like this:

For Twig

<!DOCTYPE html>
<html class="no-js {{ pageClass }}" lang="nl">

<head>
   [...]
</head>

<body>
   {% include '../../../public_html/dist/sprite/symbol-defs.svg' %}

   <main class="site-content">
   	{% include '../partials/header.twig' %}
   	{% block content %} {% endblock %}
   </main>

   {% include '../partials/footer.twig' %}

TIP

These blocks make sure that everything you add in the block is placed at the right position on build time.

← Code Guide →