Stepper

.container-fluid
  .row
    - steps = %i[mon_habitation mon_installation mes_habitudes]
    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mon_habitation, i18n_scope: "connaissance_client")

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mon_installation, i18n_scope: "connaissance_client")

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mes_habitudes, i18n_scope: "connaissance_client")

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mes_habitudes, final_step: :none, i18n_scope: "connaissance_client")

hr.pv-4

.container-fluid
  .row
    - steps = %i[mon_habitation mon_installation mes_habitudes]
    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mon_habitation, i18n_scope: "connaissance_client", theme: :bleu)

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mon_installation, i18n_scope: "connaissance_client", theme: :bleu)

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mes_habitudes, i18n_scope: "connaissance_client", theme: :bleu)

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mes_habitudes, final_step: :none, i18n_scope: "connaissance_client", theme: :bleu)

hr.pv-4

.container-fluid.pv-4.bg-vert
  .row
    - steps = %i[mon_habitation mon_installation mes_habitudes]
    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mon_habitation, classes: "lg-invert xs-invert", i18n_scope: "connaissance_client")

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mon_installation, classes: "lg-invert xs-invert", i18n_scope: "connaissance_client")

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mes_habitudes, classes: "lg-invert xs-invert", i18n_scope: "connaissance_client")

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mes_habitudes, classes: "lg-invert xs-invert", final_step: :none, i18n_scope: "connaissance_client")

hr.pv-4

.container-fluid
  .row
    - steps = %i[ma_situation mon_compteur mon_estimation le_sociétariat mes_coordonnées mes_options]
    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :ma_situation, i18n_scope: "souscription", theme: :vert)

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mon_estimation, i18n_scope: "souscription", theme: :vert)

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mes_options, i18n_scope: "souscription", theme: :vert)

    .col-md-3.col-xs-12
      = render StepperComponent.new(steps:, current_step: :mes_options, final_step: :none, i18n_scope: "souscription", theme: :vert)