HTML
            


            
PUG
            
include ../../../mixins/tarif.pug

.form-group-version2(role="radiogroup" aria-labelledby="group-radio-5-0-0-1")
  .wrapper-label
    .field-label
      p#group-radio-5-0-0-1 Radio .-horizontal.-vertical-md (regroupé)
  .field-item.-form-check-version2.-horizontal.-vertical-md
    .row
      .col-md-3
        .item
          input(type='radio' name='radio-input-5-0-0-1', checked)#radio-input-5-0-0-1
          label(for='radio-input-5-0-0-1') 
            img(src='https://dummyimage.com/32x32/' alt='').img-fluid/
            span.wrapper-content 
              span Radio
              +tarif('span', 14.95, '€', 'mois', '', '', '-text-align-left -size-small -neutral', true)
      .col-md-3
        .item
          input(type='radio' name='radio-input-5-0-0-1')#radio-input-5-0-0-2
          label(for='radio-input-5-0-0-2') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span.wrapper-content 
              span Radio
                span.complementary (info complémentaire)
              +tarif('span', 14.95, '€', 'mois', '', '', '-text-align-left -size-small -neutral', true)
          .wrapper-cta
            button.additional-cta(data-toggle='modal' data-target='#modal-inline-1' type='button')
              i.maificon.maificon-information-cercle(aria-hidden="true")
              span.sr-only Blabla 
      .col-md-3
        .item
          input(type='radio' name='radio-input-5-0-0-1')#radio-input-5-0-0-3
          label(for='radio-input-5-0-0-3') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span.wrapper-content 
              span Radio
              +tarif('span', 14.95, '€', 'mois', '', '', '-text-align-left -size-small -neutral', true)
      .col-md-3
        .item
          input(type='radio' name='radio-input-5-0-0-1')#radio-input-5-0-0-4
          label(for='radio-input-5-0-0-4') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span.wrapper-content 
              span Radio
              +tarif('span', 14.95, '€', 'mois', '', '', '-text-align-left -size-small -neutral', true)
          .wrapper-cta
            button.additional-cta(data-toggle='modal' data-target='#modal-inline-1' type='button')
              i.maificon.maificon-information-cercle(aria-hidden="true")
              span.sr-only Blabla 

.form-group-version2.has-error(role="radiogroup" aria-labelledby="group-radio-6-0-0-1 error--vertical-md-01")
  .wrapper-label
    .field-label
      p#group-radio-6-0-0-1 Radio .-horizontal.-vertical-md.has-error (regroupé)
  .field-item.-form-check-version2.-horizontal.-vertical-md
    .row
      .col-md-3
        .item
          input(type='radio' name='radio-input-6-0-0-1')#radio-input-6-0-0-1
          label(for='radio-input-6-0-0-1') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span.wrapper-content 
              span Radio
      .col-md-3
        .item
          input(type='radio' name='radio-input-6-0-0-1')#radio-input-6-0-0-2
          label(for='radio-input-6-0-0-2') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span.wrapper-content 
              span Radio
      .col-md-3
        .item
          input(type='radio' name='radio-input-6-0-0-1')#radio-input-6-0-0-3
          label(for='radio-input-6-0-0-3') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span.wrapper-content 
              span Radio
      .col-md-3
        .item
          input(type='radio' name='radio-input-6-0-0-1')#radio-input-6-0-0-4
          label(for='radio-input-6-0-0-4') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span.wrapper-content 
              span Radio
  .help-block 
    p#error--vertical-md-01 Une sélection est obligatoire avec le formulaire checkbox

.form-group-version2(role="radiogroup" aria-labelledby="group-radio-7-0-0-1")
  .wrapper-label
    .field-label
      p#group-radio-7-0-0-1 Radio .-horizontal.-vertical-md disabled (regroupé)
  .field-item.-form-check-version2.-horizontal.-vertical-md
    .row
      .col-md-3
        .item
          input(type='radio' name='radio-input-7-0-0-1', disabled)#radio-input-7-0-0-1
          label(for='radio-input-7-0-0-1') 
            span.wrapper-content 
              span Radio
      .col-md-3
        .item
          input(type='radio' name='radio-input-7-0-0-1', disabled)#radio-input-7-0-0-2
          label(for='radio-input-7-0-0-2') 
            span.wrapper-content 
              span Radio
      .col-md-3
        .item
          input(type='radio' name='radio-input-7-0-0-1', disabled)#radio-input-7-0-0-3
          label(for='radio-input-7-0-0-3') 
            span.wrapper-content 
              span Radio
      .col-md-3
        .item
          input(type='radio' name='radio-input-7-0-0-1', disabled)#radio-input-7-0-0-4
          label(for='radio-input-7-0-0-4') 
            span.wrapper-content 
              span Radio