HTML
            


            
PUG
            
.form-group-version2
  .wrapper-label
    .field-label
      p Composant de base
  .field-item.upload
    input#file(type='file')
    label(for='file')
      i.maificon.maificon-upload(aria-hidden="true")
      span Vous pouvez déposer un fichier ici 
        br 
        | ou
      span.button.-secondary Importer un fichier
      span.formats Formats autorisés : .jpg, .jpeg, .png, .pdf 
        br 
        | Taille maximale autorisée : 30Mo

.form-group-version2.has-error
  .wrapper-label
    .field-label
      p Composant Erreur fichier envoyé
  .field-item.upload
    input#file2(type='file' aria-describedby="upload-error-message" aria-invalid="true")
    label(for='file2')
      i.maificon.maificon-upload(aria-hidden="true")
      span Vous pouvez déposer un fichier supplémentaire ici 
        br 
        | ou
      span.button.-secondary Importer un autre fichier
      span.formats Formats autorisés : .jpg, .jpeg, .png, .pdf 
        br 
        | Taille maximale autorisée : 30Mo
    p.help-block(id="upload-error-message") Veuillez déposer le(s) document(s) attendu(s)
    .file
      .infos
        .entete
          i.maificon.maificon-pdf(aria-hidden="true")
          span.round-check(aria-hidden="true")
          .informations
            p.filename nomdufichier.pdf
            p.filetype Typage du fichier
            p.filesize 159 Ko
        button.chip.-icon(data-toggle="collapse" data-target="#trash2" aria-expanded="true" type="button" aria-label='Supprimer le fichier nomdufichier.pdf' title='Supprimer le fichier nomdufichier.pdf')
          i.maificon.maificon-trash(aria-hidden="true")
      #trash2.trash.collapse.show
        .collapse-content
          p Êtes-vous sûr de vouloir supprimer ce document ?
          .validation
            button.button.-secondary(type="button" data-toggle="collapse" data-target="#trash2" aria-expanded="true") Annuler
            button.button.-primary(type="button") Supprimer
    .file
      .infos
        .entete
          i.maificon.maificon-pdf(aria-hidden="true")
          span.round-check(aria-hidden="true")
          .informations
            p.filename nomdufichier.pdf
            p.filetype Typage du fichier
            p.filesize 159 Ko
        button.chip.-icon(data-toggle="collapse" data-target="#trash" aria-expanded="false" type="button" aria-label='Supprimer le fichier nomdufichier.pdf' title='Supprimer le fichier nomdufichier.pdf')
          i.maificon.maificon-trash(aria-hidden="true")
          span.sr-only Supprimer le fichier
      #trash.trash.collapse
        .collapse-content
          p Êtes-vous sûr de vouloir supprimer ce document ?
          .validation
            button.button.-secondary(type="button" data-toggle="collapse" data-target="#trash" aria-expanded="false") Annuler
            button.button.-primary(type="button") Supprimer

.form-group-version2
  p.field-label Ecran selection
  .field-item.upload
    .selection
      .form-group-version2.has-error
        label.field-label(for="form-group-upload-selection") De quel type de document s’agit-il ?
        .select
          select#form-group-upload-selection(aria-describedby="typeFile-error-message" required aria-invalid="true")
            option(disabled, selected='') Sélectionnez le type
            option(value='1') Déclaration
            option(value='2') Constat amiable
            option(value='3') Devis
            option(value='4') Déclaration
            option(value='5') Facture
            option(value='6') Photo
            option(value='7') Témoignage
            option(value='8') Dépôt de plainte
            option(value='9') Courrier d’un tiers
            option(value='10') Courrier d’un assureur
            option(value='11') Document médical
            option(value='12') Autre
        p.help-block(id="typeFile-error-message") Veuillez faire une sélection
      .validation
        button.button.-secondary.-full-width(type="button") Annuler
        button.button.-secondary.-full-width(type="button") Envoyer