Radio .inline.condensed (regroupé)

Radio .inline.condensed - Multiligne (regroupé)

Radio .inline.condensed .has-error (regroupé)

Une sélection est obligatoire avec le formulaire checkbox

Radio .inline.condensed disabled (regroupé)

          

HTML


PUG

.form-group(role="radiogroup" aria-labelledby="group-radio-liste-0-0-8")
  p#group-radio-liste-0-0-8.field-label Radio .inline.condensed (regroupé)
  .field-item.form-check.inline.condensed.-with-cta
    .row
      .col-md-12
        .item
          input(type='radio' name='radio-input-liste-0-0-8' checked)#radio-input-liste-2-2-0-1
          label(for='radio-input-liste-2-2-0-1') 
            img(src='https://dummyimage.com/48x48/' alt='').img-fluid/
            span Radio
      .col-md-12
        .item.-cta
          input(type='radio' name='radio-input-liste-0-0-8')#radio-input-liste-2-2-0-2
          label(for='radio-input-liste-2-2-0-2') 
            span Radio
              span.tarif xx,xx € /mois
                small soit xx,xx/ans
          .wrapper-cta
            button(data-toggle='modal' data-target='#modal-inline-1' type='button')
              i.maificon.maificon-information-cercle(aria-hidden="true")
              span.sr-only Blabla 
      .col-md-12
        .item.-cta
          input(type='radio' name='radio-input-liste-0-0-8')#radio-input-liste-2-2-0-3
          label(for='radio-input-liste-2-2-0-3') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span Radio
          .wrapper-cta
            button(data-toggle='modal' data-target='#modal-inline-1' type='button')
              i.maificon.maificon-information-cercle(aria-hidden="true")
              span.sr-only Blabla 

.form-group(role="radiogroup" aria-labelledby="group-radio-liste-0-0-81")
  p#group-radio-liste-0-0-81.field-label Radio .inline.condensed - Multiligne (regroupé)
  .field-item.form-check.inline.condensed
    .row
      .col-md-12
        .item.-cta
          input(type='radio' name='radio-input-liste-0-0-81')#radio-input-liste-2-2-0-41
          label(for='radio-input-liste-2-2-0-41') 
            img(src='https://dummyimage.com/48x48/' alt='').img-fluid/
            span.multiline Radio multiline
              small (info complémentaire)
          .wrapper-cta
            button(data-toggle='modal' data-target='#modal-inline-1' type='button')
              i.maificon.maificon-information-cercle(aria-hidden="true")
              span.sr-only Blabla 
      .col-md-12
        .item.-cta
          input(type='radio' name='radio-input-liste-0-0-81')#radio-input-liste-2-2-0-21
          label(for='radio-input-liste-2-2-0-21') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span.multiline Radio multiline
              small (info complémentaire)
          .wrapper-cta
            button(data-toggle='modal' data-target='#modal-inline-1' type='button')
              i.maificon.maificon-information-cercle(aria-hidden="true")
              span.sr-only Blabla 

.form-group.has-error(role="radiogroup" aria-labelledby="group-radio-liste-0-0-11" aria-describedby="error-liste-01" tabindex="-1")
  p#group-radio-liste-0-0-11.field-label Radio .inline.condensed .has-error (regroupé)
  .field-item.form-check.inline.condensed.-with-cta
    .row
      .col-md-12
        .item
          input(type='radio' name='radio-input-liste-0-0-11')#radio-input-liste-2-4-0-1
          label(for='radio-input-liste-2-4-0-1') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span Radio
      .col-md-12
        .item
          input(type='radio' name='radio-input-liste-0-0-11')#radio-input-liste-2-4-0-2
          label(for='radio-input-liste-2-4-0-2') 
            span Radio
              span.tarif xx,xx € /mois
                small soit xx,xx/ans
      .col-md-12
        .item.-cta
          input(type='radio' name='radio-input-liste-0-0-11')#radio-input-liste-2-4-0-3
          label(for='radio-input-liste-2-4-0-3') 
            span Radio
          .wrapper-cta
            button(data-toggle='modal' data-target='#modal-inline-1' type='button')
              i.maificon.maificon-information-cercle(aria-hidden="true")
              span.sr-only Blabla 
  p#error-liste-01.help-block Une sélection est obligatoire avec le formulaire checkbox

.form-group(role="radiogroup" aria-labelledby="group-radio-liste-0-0-10")
  p#group-radio-liste-0-0-10.field-label Radio .inline.condensed disabled (regroupé)
  .field-item.form-check.inline.condensed.-with-cta
    .row
      .col-md-12
        .item
          input(type='radio' name='radio-input-liste-0-0-10' disabled)#radio-input-liste-2-3-0-1
          label(for='radio-input-liste-2-3-0-1') 
            i.maificon.maificon-biens-sport(aria-hidden="true")
            span Radio
      .col-md-12
        .item
          input(type='radio' name='radio-input-liste-0-0-10' disabled)#radio-input-liste-2-3-0-2
          label(for='radio-input-liste-2-3-0-2') 
            span Radio
              span.tarif xx,xx € /mois
                small soit xx,xx/ans
      .col-md-12
        .item.-cta
          input(type='radio' name='radio-input-liste-0-0-10' disabled)#radio-input-liste-2-3-0-3
          label(for='radio-input-liste-2-3-0-3') 
            span Radio
          .wrapper-cta
            button(data-toggle='modal' data-target='#modal-inline-1' disabled type='button')
              i.maificon.maificon-information-cercle(aria-hidden="true")
              span.sr-only Blabla