From: Ardis Lu <ardisglu@gmail.com>
Date: Tue, 11 Jul 2023 02:52:34 +0000 (-0700)
Subject: Only show output header if textarea is populated
X-Git-Url: https://git.ardis.lu/?a=commitdiff_plain;h=95e2f025c04fe102ae97582a3effbce5f42c143d;p=simulate-etherscan-function-display

Only show output header if textarea is populated
---

diff --git a/index.html b/index.html
index 1dc5cb6..15757b5 100644
--- a/index.html
+++ b/index.html
@@ -122,6 +122,14 @@
       background: rgb(8 29 53);
       clip-path: polygon(0 0, 100% 0, 50% 90%);
     }
+
+    #output-header {
+      display: none;
+    }
+
+    textarea:not(:invalid) + #output-header {
+      display: unset;
+    }
   </style>
 </head>
 
@@ -133,9 +141,9 @@
 
   <main>
     <label for="functions">Solidity functions</label>
-    <textarea name="functions" id="functions" placeholder="function totalSupply() external view returns (uint256)" autocomplete="off"></textarea>
+    <textarea name="functions" id="functions" placeholder="function totalSupply() external view returns (uint256)" autocomplete="off" required></textarea>
 
-    <h2>Simulated Etherscan function pills</h2>
+    <h2 id="output-header">Simulated Etherscan function pills</h2>
     <div class="pill-container"></div>
   </main>