style

index.html

@@ -63,10 +63,17 @@ body > main {
 }
 
 #bouton_reconnaissance_vocale {
-    padding: 0;
+    padding-left: 0;
+    padding-right: 0.5rem;
     width: 3rem;
+    margin-left: 0;
     margin-left: -3rem;
     border: none;
+    z-index: 10;
+}
+
+#bouton_reconnaissance_vocale:hover {
+    filter: brightness(1.2);
 }
 
 #bouton_envoyer {
@@ -135,6 +142,7 @@ const bouton_annuler = document.getElementById('bouton_annuler');
 const bouton_ok = document.getElementById('bouton_ok');
 const footer = document.querySelector('footer');
 const langue = document.documentElement.lang;
+let voix = null;
 
 question.addEventListener('keydown', e => {
     if (e.key === 'Enter' && !e.ctrlKey && !e.shiftKey) {
@@ -206,9 +214,10 @@ formulaire.addEventListener('submit', async (e) => {
 })
 
 // Synthèse vocale
-let voix = null;
 function charger_voix() {
     let liste_voix = speechSynthesis.getVoices(); // .filter(voice => voice.lang.startsWith(langue));
+    liste_voix.sort((a, b) => b.lang.startsWith(langue));
+    liste_voix.sort((a, b) => b.default);
     select_voix.innerHTML = aphone;
     
     if (!liste_voix.length) {
@@ -221,7 +230,7 @@ function charger_voix() {
     liste_voix.forEach((v, i) => {
         const option = document.createElement('option');
         option.value = i;
-        option.innerText = v.name;
+        option.textContent = `${v.name} (${v.lang})`;
         select_voix.appendChild(option);
         if (v.voiceURI === window.localStorage.getItem('voix')) {
             select_voix.value = i;