Improve form usability

diff --git a/index.html b/index.html
index e6077d16c29fdd81204afe65fd84f69c9f5fb977..4c03d2e6fd16433b8aa3a534f9e05d791119d748 100644 (file)
--- a/index.html
+++ b/index.html
@@ -51,6 +51,14 @@
 
     button {
       padding: 4px 8px;
+      cursor: pointer;
+      transition: filter 400ms;
+    }
+
+    button:hover,
+    button:focus {
+      filter: brightness(110%);
+      transition: filter 200ms;
     }
 
     output:empty::after {
@@ -67,7 +75,7 @@
   <main>
     <form>
       <label for="functions">Functions</label>
-      <textarea name="functions" id="functions"></textarea>
+      <textarea name="functions" id="functions" required></textarea>
 
       <button>Calculate</button>