A/B-testin jälkeen vaihdoin napit selectiin

src/App.css

@@ -56,14 +56,11 @@
   cursor: pointer; 
 }
 
-#soittimet {
-  font-size: 20px;
-  position: "absolute";
-  bottom: 60;
+#sfmenu {
+  font-size: 30px;
   cursor: pointer; 
 }
 
-
 #sharp {
   background-color: black;
   color: white;

src/App.js

@@ -231,16 +231,13 @@ function App() {
   const handleFis4Click = () => {
     audioPlayer.stopNote(0)
     audioPlayer.playNote("F#4")}
-  const handlePianoClick = () => {
-    audioPlayer.setInstrument("acoustic_grand_piano")}
-  const handleSaxClick = () => {
-        audioPlayer.setInstrument("alto_sax")}
-  const handleAahClick = () => {
-        audioPlayer.setInstrument("choir_aahs")}
-  const handleShakuClick = () => {
-        audioPlayer.setInstrument("shakuhachi")}
-  const handleCelloClick = () => {
-        audioPlayer.setInstrument("cello")}
+ 
+  function handleSoitinChange(e) {
+    audioPlayer.setInstrument(e.target.value)
+          
+      }
+      
+    
           
                     
   return (
@@ -279,11 +276,20 @@ function App() {
       <button id="thin" onClick={handleF4Click}>-</button>
       <button id="sharp" onClick={handleFis4Click}>ä</button>
      
-      <button id="soittimet" onClick={handlePianoClick}>piano</button>
-      <button id="soittimet" onClick={handleSaxClick}>saksofoni</button>
-      <button id="soittimet" onClick={handleAahClick}>ihminen</button>
-      <button id="soittimet" onClick={handleShakuClick}>shakuhachi</button>
-      <button id="soittimet" onClick={handleCelloClick}>sello</button>
+          <select id="sfmenu"
+          defaultValue="flute"
+          onChange={handleSoitinChange}>
+            <option value="shakuhachi">shakuhachi</option>
+            <option value="cello">sello</option>
+            <option value="flute">huilu</option>
+            <option value="bassoon">fagotti</option>
+            <option value="french_horn">torvi</option>
+            <option value="choir_aahs">ihminen</option>
+            <option value="grand_acoustic_piano">piano</option>
+            <option value="bagpipe">säkkipilli</option>
+            <option value="breath_noise">hengitys</option>
+
+          </select>
       
     </div>
   )