extends ../index.jade

block sidebar
  div.sidebar-wrapper
    aside.sidebar
      != partial("../../_sidebar-header")
      != partial("../_examples-sidebar-content")

block content
  != partial("./filter-by-condition")
  != partial("../_components", {code: partial("./components"), conditions: '3', components: '1', instances: '2'})

  div.app-wrapper
    small active filter
    div.active-filter

    small info
    div.example-info-wrapper
      pre
        code.hljs.markdown.examples-info

    small controls
    div.controls
      button.register-condition Register condition
      button.apply-condition-to-component Add condition to component "filter-condition-component"
      button.apply-condition-to-instance Add condition to instance "filter-instance-2"
      button.reset Reset components

    small .component-area--main
    div.component-area.component-area--main

block scripts
  script(src="./components.js")
  script(src="./app/app.js")
  script.
    $(document).ready(function () {
      new app.Filter({
        el: '.app-wrapper'
      });
    });