## -*- coding: utf-8 -*-
<%inherit file="/debug_style/index.html"/>

<%def name="breadcrumbs_links()">
    ${h.link_to(_('Style'), h.url('debug_style_home'))}
    &raquo;
    ${c.active}
</%def>


<%def name="real_main()">
<div class="box">
    <div class="title">
        ${self.breadcrumbs()}
    </div>

    <div class='sidebar-col-wrapper'>
    ${self.sidebar()}

    <div class="main-content">

      <h2>Headline comes as a h2 element</h2>


        <form method='post' action='none'>
          <div class='form'>
            <div class='fields'>

              <div class='field'>
                <div class='label'>
                  <label for='example_input'>Example input label:</label>
                </div>
                <div class='input'>
                  <input id="example_input" type="text" placeholder="Example input">
                </div>
              </div>

              <div class='field'>
                <div class='label'>
                  <label for='example_select'>Example select input:</label>
                </div>
                <div class="select">
                    <select id="example_select" >
                        <option value="#">${_('Templates...')}</option>
                        <option value="ga">Google Analytics</option>
                        <option value="clicky">Clicky</option>
                        <option value="server_announce">${_('Server Announcement')}</option>
                    </select>
                </div>
              </div>
              <script>
              $(document).ready(function() {
                  $('#example_select').select2({
                      containerCssClass: 'drop-menu',
                      dropdownCssClass: 'drop-menu-dropdown',
                      dropdownAutoWidth: true,
                      minimumResultsForSearch: -1
                  });
              });
              </script>

              <div class='field'>
                <div class='label'>
                  <label for='example_checkbox'>Example checkbox:</label>
                </div>
                <div class="checkboxes">
                  <div class="checkbox">
                    <input id="example_checkbox" type="checkbox">
                    <label for="example_checkbox">Label of the checkbox</label>
                  </div>
                </div>
              </div>

              <div class='field'>
                <div class='label'>
                  <label for='example_checkboxes'>Example multiple radios:</label>
                </div>
                ## TODO: johbo: This is off compared to the checkboxes
                <div class="radios">
                  <label><input type="radio" checked="checked" value="hg.create.repository" name="default_repo_create" id="default_repo_create_hgcreaterepository">Enabled</label>
                  <label><input type="radio" value="hg.create.none" name="default_repo_create" id="default_repo_create_hgcreatenone">Disabled</label>
                  <span class="help-block">
                    Permission to allow repository creation. This includes ability
                    to create repositories in root level. If this option is disabled
                    admin of repository group can still create repositories
                    inside that repository group.
                  </span>
                </div>
              </div>

              <div class="buttons">
                <input type="submit" value="Save" id="example_save" class="btn">
                <input type="reset" value="Reset" id="example_reset" class="btn">
              </div>

            </div>
          </div>
        </form>




    </div>
  </div>
</div>
</%def>