- var theme_customizer      = true;
- var sidebar               = true;
- var slick                 = true;
- var header_slider         = true;
- var animate               = true;
- var scrollbar             = true;

doctype html
html(lang='en')
  include ../../components/header-files
  body
    include ../../components/loader
    include ../../components/taptop
    // page-wrapper Start
    #pageWrapper.page-wrapper.compact-wrapper
      include ../../components/header
      // Page Body Start
      .page-body-wrapper
        include ../../components/sidebar
        .page-body
          .container-fluid
            .page-title
              .row
                .col-6
                  h3
                    | Checkbox & Radio

                .col-6
                  ol.breadcrumb
                    li.breadcrumb-item
                      a(href='index.html')                                        
                        svg.stroke-icon
                          use(href='../assets/svg/icon-sprite.svg#stroke-home')
                    li.breadcrumb-item Form Controls
                    li.breadcrumb-item.active  Checkbox & Radio
          // Container-fluid starts
          .container-fluid
            .row
              .col-md-6
                .card
                  .card-header
                    h5 Custom Radio
                  .card-body
                    .row
                      .col-sm-12
                        h5.mb-0 Custom Radio
                      .col
                        .mb-3.m-t-15.custom-radio-ml
                          .form-check.radio.radio-primary
                            input#radio1.form-check-input(type='radio', name='radio1', value='option1')
                            label.form-check-label(for='radio1')
                              | Option
                              span.digits  1
                          .form-check.radio.radio-primary
                            input#radio3.form-check-input(type='radio', name='radio1', value='option1', disabled='')
                            label.form-check-label(for='radio3') Disabled
                          .form-check.radio.radio-primary
                            input#radio4.form-check-input(type='radio', name='radio1', value='option1', checked='')
                            label.form-check-label(for='radio4') Checked
                      .col-sm-12
                        h5.mb-0 Radio states
                      .col
                        .mb-3.m-t-15.custom-radio-ml
                          .form-check.radio.radio-primary
                            input#radio11.form-check-input(type='radio', name='radio1', value='option1')
                            label.form-check-label(for='radio11')
                              | Option
                              span.digits  1
                          .form-check.radio.radio-secondary
                            input#radio22.form-check-input(type='radio', name='radio1', value='option1')
                            label.form-check-label(for='radio22')
                              | Option
                              span.digits  2
                          .form-check.radio.radio-success
                            input#radio55.form-check-input(type='radio', name='radio1', value='option1')
                            label.form-check-label(for='radio55')
                              | Option
                              span.digits  3
                          .form-check.radio.radio-info
                            input#radio33.form-check-input(type='radio', name='radio1', value='option1', disabled='')
                            label.form-check-label(for='radio33')
                              | Option
                              span.digits  4
                          .form-check.radio.radio-warning
                            input#radio44.form-check-input(type='radio', name='radio1', value='option1')
                            label.form-check-label(for='radio44')
                              | Option
                              span.digits  5
                          .form-check.radio.radio-danger
                            input#radio66.form-check-input(type='radio', name='radio1', value='option1', checked='')
                            label.form-check-label(for='radio66')
                              | Option
                              span.digits  6
                      .col-sm-12
                        h5.mb-0 Inline checkbox
                      .col
                        .m-t-15.m-checkbox-inline.custom-radio-ml
                          .form-check.form-check-inline.radio.radio-primary
                            input#radioinline1.form-check-input(type='radio', name='radio1', value='option1')
                            label.form-check-label.mb-0(for='radioinline1')
                              | Option
                              span.digits  1
                          .form-check.form-check-inline.radio.radio-primary
                            input#radioinline2.form-check-input(type='radio', name='radio1', value='option1')
                            label.form-check-label.mb-0(for='radioinline2')
                              | Option
                              span.digits  2
                          .form-check.form-check-inline.radio.radio-primary
                            input#radioinline3.form-check-input(type='radio', name='radio1', value='option1')
                            label.form-check-label.mb-0(for='radioinline3')
                              | Option
                              span.digits  3
              .col-md-6
                .card
                  .card-header
                    h5 Custom checkbox
                  .card-body
                    .row
                      .col-sm-12
                        h5.mb-0 Custom checkbox
                      .col
                        .mb-3.m-t-15
                          .form-check.checkbox.mb-0
                            input#checkbox1.form-check-input(type='checkbox')
                            label.form-check-label(for='checkbox1') Default
                          .form-check.checkbox.mb-0
                            input#checkbox2.form-check-input(type='checkbox', disabled='')
                            label.form-check-label(for='checkbox2') Disabled
                          .form-check.checkbox.mb-0
                            input#checkbox3.form-check-input(type='checkbox', checked='')
                            label.form-check-label(for='checkbox3') Checked
                      .col-sm-12
                        h5.mb-0 Checkbox states
                      .col
                        .mb-3.m-t-15
                          .form-check.checkbox.checkbox-primary.mb-0
                            input#checkbox-primary-1.form-check-input(type='checkbox')
                            label.form-check-label(for='checkbox-primary-1') Success state
                          .form-check.checkbox.checkbox-secondary.mb-0
                            input#checkbox-dark.form-check-input(type='checkbox', disabled='')
                            label.form-check-label(for='checkbox-dark') Brand state
                          .form-check.checkbox.checkbox-success.mb-0
                            input#checkbox-primary.form-check-input(type='checkbox')
                            label.form-check-label(for='checkbox-primary') primary state
                      .col-sm-12
                        h5.mb-0 Inline checkbox
                      .col
                        .m-t-15.m-checkbox-inline
                          .form-check.form-check-inline.checkbox.checkbox-dark.mb-0
                            input#inline-1.form-check-input(type='checkbox')
                            label.form-check-label(for='inline-1')
                              | Option
                              span.digits  1
                          .form-check.form-check-inline.checkbox.checkbox-dark.mb-0
                            input#inline-2.form-check-input(type='checkbox')
                            label.form-check-label(for='inline-2')
                              | Option
                              span.digits  2
                          .form-check.form-check-inline.checkbox.checkbox-dark.mb-0
                            input#inline-3.form-check-input(type='checkbox')
                            label.form-check-label(for='inline-3')
                              | Option
                              span.digits  3
              .col-md-6
                .card
                  .card-header
                    h5 Animated radio buttons
                  .card-body.animate-chk
                    .row
                      .col
                        label.d-block(for='edo-ani')
                          input#edo-ani.radio_animated(type='radio', name='rdo-ani', checked='')
                          |                                                 Option 1
                        label.d-block(for='edo-ani1')
                          input#edo-ani1.radio_animated(type='radio', name='rdo-ani')
                          |                                                 Option 2
                        label.d-block(for='edo-ani2')
                          input#edo-ani2.radio_animated(type='radio', name='rdo-ani', checked='')
                          |                                                 Option 3
                        label.d-block(for='edo-ani13')
                          input#edo-ani13.radio_animated(type='radio', name='rdo-ani')
                          |                                                 Option 4
              .col-md-6
                .card
                  .card-header
                    h5 Animated checkbox buttons
                  .card-body.animate-chk
                    .row
                      .col
                        label.d-block(for='chk-ani')
                          input#chk-ani.checkbox_animated(type='checkbox', checked='')
                          |                                                 Option 1
                        label.d-block(for='chk-ani1')
                          input#chk-ani1.checkbox_animated(type='checkbox')
                          |                                                 Option 2
                        label.d-block(for='chk-ani2')
                          input#chk-ani2.checkbox_animated(type='checkbox', checked='')
                          |                                                 Option 3
                        label.d-block(for='chk-ani3')
                          input#chk-ani3.checkbox_animated(type='checkbox')
                          |                                                 Option 4
              .col-md-12
                .card
                  .card-header
                    h5 Square checkbox
                  .card-body
                    .row
                      .col
                        .mb-3
                          .checkbox.checkbox-dark.m-squar
                            input#inline-sqr-1(type='checkbox')
                            label.mt-0(for='inline-sqr-1') Default
                          .checkbox.checkbox-dark.m-squar
                            input#inline-sqr-2(type='checkbox', disabled='')
                            label(for='inline-sqr-2') Disabled
                          .checkbox.checkbox-dark.m-squar
                            input#inline-sqr-3(type='checkbox', checked='')
                            label(for='inline-sqr-3') checked
                      .col-sm-12
                        h5 Solid checkbox
                      .col
                        .m-t-15
                          .form-check.checkbox.checkbox-solid-success
                            input#solid1.form-check-input(type='checkbox')
                            label.form-check-label(for='solid1') Default
                          .form-check.checkbox.checkbox-solid-dark
                            input#solid2.form-check-input(type='checkbox', disabled='')
                            label.form-check-label(for='solid2') Disabled
                          .form-check.checkbox.checkbox-solid-primary
                            input#solid3.form-check-input(type='checkbox', checked='')
                            label.form-check-label(for='solid3') checked
                          .form-check.checkbox.checkbox-solid-danger
                            input#solid4.form-check-input(type='checkbox', checked='')
                            label.form-check-label(for='solid4') checked
                          .form-check.checkbox.checkbox-solid-light
                            input#solid5.form-check-input(type='checkbox', checked='')
                            label.form-check-label(for='solid5') checked
                          .form-check.checkbox.checkbox-solid-info
                            input#solid6.form-check-input(type='checkbox', checked='')
                            label.form-check-label(for='solid6') checked
                          .form-check.checkbox.checkbox-solid-dark
                            input#solid7.form-check-input(type='checkbox', checked='')
                            label.form-check-label.mb-0(for='solid7') checked

          // Container-fluid Ends
        include ../../components/footer
    include ../../components/footer-files
