--- /dev/null
+input#modalSettings.modal(type="checkbox")
+div(role="dialog" aria-labelledby="settingsTitle")
+ .card.smallpad(onChange="blabla(event)")
+ label.modal-close(for="modalSettings")
+ h3#settingsTitle.section= translations["Preferences"]
+ // taille echiquier : TODO
+ fieldset
+ label(for="setHints")= translations["Show hints?"]
+ // TODO: this.hints will not work. Idea: query storage in a generic way ?
+ // --> getValue("hints") par exemple
+ input#setHints(type="checkbox" checked=this.hints)
+ fieldset
+ label(for="selectColor")= translations["Board colors"]
+ select#selectColor
+ option(value="lichess" selected="this.color=='lichess'")
+ = translations["brown"]
+ option(value="chesscom" selected="this.color=='chesscom'")
+ = translations["green"]
+ option(value="chesstempo" selected="this.color=='chesstempo'")
+ = translations["blue"]
+ fieldset
+ label(for="selectSound")= translations["Play sounds?"]
+ select#selectSound
+ option(value="0" selected="this.sound==0")= translations["None"]
+ option(value="1" selected="this.sound==1")= translations["New game"]
+ option(value="2" selected="this.sound==2")= translations["All"]