Il markup dei toggle è completamente diverso da quelle delle checkbox

[giuliaghisini]

Esiste già una discussione sul tema che ti interessa, o su un tema simile?

• Ho verificato e non esiste

Versione della libreria

3.x

Cosa

il markup dei Toggle, è completamente diverso da quello delle checkbox, anche se di fatto l'input è dello stesso tipo.
in pratica, i toggle si fanno come

<div class="form-check form-check-inline">
    <div class="toggles">
      <label for="toggleEsempio1a">
        Label dell'interruttore 1
        <input type="checkbox" id="toggleEsempio1a">
        <span class="lever"></span>
      </label>
    </div>
  </div>

mentre le checkbox si fanno

<div class="form-check">
    <input id="checkbox1" type="checkbox">
    <label for="checkbox1">Checkbox di esempio</label>
  </div>

Per uniformità sarebbe bello che anche per i toggles, l'input stia allo stesso livello della label ( e non al suo interno).

Forse questa issue può essere collegata a questa: #1662

Perché

uniformità del markup

Contesto

No response

Altro

No response

[Fupete]

@giuliaghisini: provo a fare l'avvocato del diavolo (DX): con il markup attuale del toggle (o switch) in BSI è però chiaro allo sviluppatore che anche <span class="lever"></span> fa parte del toggle. Seppure è un elemento puramente estetico/decorativo. Mi sbaglio? Se mettiamo tutti allo stesso livello quello <span> corre presto il rischio di rimanere orfano. <input> e <label> rimangono collegati dal for, ma quello <span>...

[Fupete]

Non sono sicuro che non abbia anche un impatto su gestione stati :hover e aree cliccabili questa cosa. Da verificare.

Ovviamente benvenga semplificare, ma facciamolo valutando per bene.

[giuliaghisini]

@Fupete sicuramente può essere una miglioria. Essendo un input non visibile, sarebbe bello che il markup sia coerente fra checkbox e toggle, magari si potrebbe mettere anche una sola regola css generica per gli input con type="checkbox" negli stili globali del form. A livello visivo non cambia nulla per l'utente perchè tanto quell'input non è visibile. Era per semplicare anche il codice css che c'è su bsi e non dover fare regole che sovrascrivono altre regole.
Può essere un suggerimento per il futuro.