<div class="text-center h4">
    Create new section <i class="fas fa-thumbs-up"></i>
    <br />
    <br />
    <i class="{{ selectedMenu.icon }}"></i> {{ selectedMenu.title }}
  </div>
  <hr>
  <form method="post">
    {% csrf_token %}
    <div class="form-group">
      <label for="exampleInputEmail1">Title:</label>
      <input type="text" class="form-control" name="title" placeholder="">
      <p class="help-block">Required: This title will be displayed above the content.</p>
    </div>
    <div class="form-group">
      <label for="menuPathSelect">Menu:</label>
      <select class="form-control" name="menu_path" id="menuPathSelect">
        {% for menu_item in menu_items %}
          <option value="{{ menu_item.path }}">{{ menu_item.title }}</option>
        {% endfor %}
      </select>
      <p class="help-block">Required: Menu under which this section should be displayed.</p>
    </div>
    <div class="form-group">
      <label for="exampleInputPassword1">Index:</label>
      <input type="text" class="form-control" name="index" placeholder="">
      <p class="help-block">Optional: The entire wiki page is sorted by this index. The lower the value, the further to the top is the section. Default will be 0.</p>
    </div>
    <div class="form-group">
      <label for="exampleInputPassword1">Icon:</label>
      <input type="text" class="form-control" name="icon" placeholder="">
      <p class="help-block">Optional: Go to <a href="https://fontawesome.com/v5/search?o=r&m=free" target="_blank">https://fontawesome.com/v5/search?o=r&m=free</a> to find matching icons. We only support free icons. Format example: fas fa-hand-spock</p>
    </div>
    <div class="form-group">
      <label for="exampleInputPassword1">Content:</label>
      <textarea class="form-control" name="content" id="contentInput" rows="10"></textarea>
      <p class="help-block">Optional: This will be displayed as your main content of the section. You can use markdown. See <a href="https://commonmark.org/help/">https://commonmark.org/help/</a> for references.</p>
    </div>
    <div class="row">
      <div class="col d-grid">
    <button type="submit" name="confirm_create" value="0" class="btn btn-primary">
        <i class="fas fa-times-circle"></i>
        Cancel
    </button>
    </div>
    <div class="col d-grid">
      <button type="submit" name="confirm_create" value="1" class="btn btn-success">
        <i class="fas fa-plus-square"></i>
        Create
    </button>
    </div>
    </div>
</form>