+
Speak a command!
Supported Commands
diff --git a/03-codigotchi/script.js b/03-codigotchi/script.js
index e69de29..babaa99 100644
--- a/03-codigotchi/script.js
+++ b/03-codigotchi/script.js
@@ -0,0 +1,10 @@
+// Query the page for elements
+const micBtn = document.getElementById('microphone')
+const panelsData = document.getElementById('panels-data');
+
+// When button clicked, show the available commands
+function onStartListening() {
+ panelsData.classList.add('listening')
+}
+
+micBtn.addEventListener('click', onStartListening)
\ No newline at end of file
diff --git a/03-codigotchi/style.css b/03-codigotchi/style.css
index 887c275..9c0b013 100644
--- a/03-codigotchi/style.css
+++ b/03-codigotchi/style.css
@@ -94,3 +94,23 @@ button {
background-repeat: no-repeat;
background-size: contain;
}
+
+.panel-commands {
+ visibility: hidden;
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+
+.listening .panel-commands {
+ visibility: visible;
+}
+
+.listening .panel-microphone {
+ visibility: hidden;
+ transform: scale(0.1);
+}
+
+.panels {
+ position: relative;
+}
\ No newline at end of file