<bp:template>
  {% extends "./base.xml" %}

  {% block css %}
    {# Main CSS (Sass) #}
    {% asset %}
      <b:if cond='!data:view.isLayoutMode'>
      <style>
      {% asset "./sass/dist/style.css" %}
      </style>
      </b:if>
    {% endasset %}

    {# Main CSS (Skin) #}
    {% asset %}
      <b:if cond='!data:view.isLayoutMode'>
      <b:skin>
      <![CDATA[
      {% asset "./skin/dist/style.css" %}
      ]]>
      </b:skin>
      </b:if>
    {% endasset %}

    {# Layout Mode CSS #}
    {% asset %}
      <b:if cond='data:view.isLayoutMode'>
      <b:template-skin>
      <![CDATA[
      /* CSS here */
      ]]>
      </b:template-skin>
      </b:if>
    {% endasset %}
  {% endblock %}

  {% block body %}
    <b:if cond='!data:view.isError'>
      {% template "./template/header.xml" %}

      {% template "./template/content.xml" %}

      {% template "./template/footer.xml" %}
    </b:if>

    <b:if cond='data:view.isError'>
      {% template "./template/404.xml" %}
    </b:if>
  {% endblock %}

  {% block js %}
    {# Main JS #}
    {% asset %}
      <script>
      //<![CDATA[
      {% asset "./js/dist/script.js" %}
      //]]>
      </script>
    {% endasset %}
  {% endblock %}
</bp:template>
