keyboard button

css/style.css

@@ -125,10 +125,6 @@ table input:enabled {
     z-index: 1000;
 }
 
-.bi::before {
-  vertical-align: 0;
-}
-
 .pencil {
     color: var(--bs-secondary-color) !important;
 }

js/sudoku.js

@@ -67,7 +67,7 @@ window.onload = function() {
         searchCandidatesOf(box)
     })
 
-    insertRadios = Array.from(insertRadioGroup.getElementsByTagName("input"))
+    insertRadios = Array.from(insertRadioGroup.getElementsByTagName("input")).slice(1)
 
     for (label of document.getElementsByTagName("label")) {
         label.control.label = label
@@ -300,12 +300,7 @@ function onmouseleave(event) {
 }
 
 function insert(radio) {
-    if (radio.value == valueToInsert) {
-        valueToInsert = ""
-        radio.checked = false
-    } else {
     valueToInsert = radio.value
-    }
     grid.style.cursor = valueToInsert ? "copy" : "text"
     highlight()
 }

sudoku.php

@@ -78,6 +78,10 @@
         </form>
         <div class='d-flex mb-2'>
             <div id='insertRadioGroup' class='radioGroup btn-group flex-fill'>
+                <input type='radio'class='btn-check' id='insertRadio0' value='' name='insertRadioGroup' onclick='insert(this)' accesskey='0' checked />
+                <label for='insertRadio0' class='btn btn-primary' title='Clavier'>
+                    <i class="bi bi-cursor-text"></i>
+                </label>
                 <?php
         for($value=1; $value<=9; $value++) {
             echo "                <input type='radio'class='btn-check' id='insertRadio$value' value='$value' name='insertRadioGroup' onclick='insert(this)' accesskey='$value' disabled /><label for='insertRadio$value' class='btn btn-primary' title='Insérer un $value'>$value</label>\n";