DSO Toolkit homepage

Wizard Stap 1

There are no notes for this item.

<main>
    <h2 class="dso-steps-indicator">
        1. Project

        <span class="dso-step">
            Stap 1/7
        </span>
    </h2>

    <div class="clearfix"></div>
    <div class="alert alert-info" role="alert">
        Hulp nodig bij kiezen? Doe dan eerst de <a href="#">Vergunningscheck</a>.
    </div>

    <div class="clearfix"></div>
    <form class="form-horizontal">

        <fieldset>
            <legend>Project</legend>

            <div class="form-group dso-input dso-input-text">
                <div class="dso-label-container">
                    <label for="form-vertical-naam project" class="control-label">
                        Wat is de naam van uw project?
                    </label>

                </div>
                <div class="dso-field-container">
                    <input type="text" id="form-vertical-naam project" class="form-control">

                </div>

            </div>

            <div class="form-group dso-textarea">
                <div class="dso-label-container">
                    <label for="form-vertical-beschrijving project" class="control-label">
                        Korte omschrijving van uw project
                    </label>

                </div>
                <div class="dso-field-container">
                    <textarea class="form-control" id="form-vertical-beschrijving project"></textarea>

                </div>

            </div>

            <div class="form-group dso-textarea">
                <div class="dso-label-container">
                    <label for="form-vertical-kosten project" class="control-label">
                        Wat zijn de kosten van uw project?
                    </label>

                </div>
                <div class="dso-field-container">
                    <textarea class="form-control" id="form-vertical-kosten project"></textarea>

                </div>

            </div>

        </fieldset>

        <div class="dso-form-buttons">

            <button type="submit" class="btn btn-primary"><span>Volgende stap</span><svg class="di di-chevron-right">
                    <use href="../../dso-icons.svg#chevron-right" />
                </svg></button>

        </div>

    </form>

</main>
<main>
  {% render '@form-steps', {title: steps.title, step: steps.step} %}
  <div class="clearfix"></div>
  {% render '@alert', {modifier: alert.modifier, message: alert.message} %}
  <div class="clearfix"></div>
  {% render '@form', form %}
</main>
menu:
  modifier: main
  items:
    - label: Home
    - label: Vergunningcheck
    - label: Aanvragen
      active: true
    - label: Regels op de kaart
    - label: Mijn Omgevingsloket
steps:
  title: 1. Project
  step: Stap 1/7
alert:
  modifier: info
  message: 'Hulp nodig bij kiezen? Doe dan eerst de <a href="#">Vergunningscheck</a>.'
form:
  formModifier: form-horizontal
  fieldsets:
    - legend: Project
      groups:
        - id: naam project
          inputType: input
          type: text
          label: Wat is de naam van uw project?
        - id: beschrijving project
          inputType: textarea
          type: text
          label: Korte omschrijving van uw project
        - id: kosten project
          inputType: textarea
          type: text
          label: Wat zijn de kosten van uw project?
  buttons:
    - type: submit
      modifier: primary
      label: Volgende stap
      iconAfter: chevron-right