HTML
            


            
PUG
            
.conversationnel
  .conversation
    .conversation-question
      .row
        .col-md-8.mx-auto
          form.maif-form
            .row.autocomplete
              .col-12
                .dropup
                  .form-group
                    input.form-control(type='text')/
                  ul.dropdown-menu
                    li
                      a(href='#')
                        .row
                          .col-10 Valeur 1
                          .col-2 Val 1
                    li
                      a(href='#')
                        .row
                          .col-10 Valeur 2
                          .col-2 Val 2
.conversationnel
  .conversation
    .conversation-question
      .row
        .col-md-8.mx-auto
          form.maif-form
            .row.buttons
              .col-4
                button.btn.btn-block
                  span Bouton 1
              .col-4
                button.btn.btn-block
                  span Bouton 2
              .col-4
                button.btn.btn-block
                  span Bouton 3
.conversationnel
  .conversation
    .conversation-question
      .row
        .col-md-8.mx-auto
          form.maif-form
            .row.buttons
              .col-6
                button.btn.btn-block
                  span Bouton 1
              .col-6
                button.btn.btn-block
                  span Bouton 2
.conversationnel
  .conversation
    .conversation-question
      .row
        .col-md-8.mx-auto
          form.maif-form
            .row.buttons
              .col-10.mx-auto
                button.btn.btn-block
                  span Bouton 1
.conversationnel
  .conversation
    .conversation-question
      .row.v-center
        .col-12.col-md-8.mx-auto
          form.maif-form
            .row.flex-row
              .col-8
                .form-group
                  input.input-large.form-control(type='text', placeholder='Champ texte')/
              .col-4
                .form-group
                  button.btn.btn-block
                    span ENVOYER
            .text-center
              a(href='#') Lien suivant
.conversationnel
  .conversation
    .conversation-question
      .row
        .col-md-8.mx-auto
          form.maif-form
            .row
              .col-8
                .form-group.no-margin.champ-texte
                  input(type='text', placeholder='Champ texte').input-large.form-control/
                  .unite m²
              .col-4
                button.btn.btn-block ENVOYER
.conversationnel
  .conversation
    .conversation-question
      .row
        .col-md-8.mx-auto
          form.maif-form
            .row
              .col-8
                .form-group.no-margin
                  input(type='text', placeholder='Champ texte').input-large.form-control/
              .col-4
                button.btn.btn-block ENVOYER
.conversationnel
  .conversation
    .conversation-question
      .row
        .col-md-8.mx-auto
          form.maif-form
            .row
              .col-8
                .form-group.no-margin
                  .form-date.form-date-lointaine.no-margin
                    input(type="date").input-large/
              .col-4
                button.btn.btn-block ENVOYER
.conversationnel
  .conversation
    .conversation-question
      .row
        .col-md-8.mx-auto
          form.maif-form
            .select
              .dropup
                button.btn.dropdown-toggle(type='button', data-toggle='dropdown', aria-haspopup='true', aria-expanded='false') Sélectionnez dans la liste
                  .dropdown-toggler
                    span.caret
                ul.dropdown-menu(aria-labelledby='select')
                  li
                    a(href='#') Donnée 1
.conversationnel
  .conversation
    .conversation-question
      | Contenu