Align search color

index.html

@@ -7,15 +7,16 @@
     <title>polkadot{.js}/phishing</title>
     <style>
       :root {
+        --color: #4e4e4e;
         --font-mono: 0.9em Consolas, monaco, "Ubuntu Mono", "Liberation Mono", "Courier New", Courier, monospace;
         --font-sans: 1em "-apple-system", BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
       }
 
       a { color: #ff8c00 !important; text-decoration: none }
-      body { color: #4e4e4e; font: var(--font-sans); height: 100vh; overflow-x: hidden; padding: 0 }
+      body { color: var(--color); font: var(--font-sans); height: 100vh; overflow-x: hidden; padding: 0 }
       h3 { font: var(--font-sans); font-weight: 400; margin: 0; opacity: 0.5; text-transform: lowercase }
       p { line-height: 1.5rem; margin: 0.75rem 0 }
-      input { display: block; padding: 0.5rem 0.75rem; width: 100% }
+      input { color: var(--color); display: block; opacity: 0.85; padding: 0.5rem 0.75rem; width: 100% }
 
       .box { background: rgba(255, 255, 255, 0.85); border-radius: 0.25rem; flex: 1 1; margin: 0.5rem; min-width: 15rem; max-width: 40rem; padding: 1rem 1.5rem; text-align: center; white-space: nowrap; width: 40rem; z-index: 2 }
       .buttons { display: none; margin: 2rem 0 1.5rem }
@@ -78,7 +79,6 @@
 
       const style = document.createElement('style');
       const table = document.getElementById('table');
-      const search = document.getElementById('search');
 
       document.head.appendChild(style);
 
@@ -203,8 +203,6 @@
           } else {
             fillAddresses();
           }
-
-          search.focus();
         }
       }
 
@@ -270,15 +268,17 @@
           Promise.all(metaJson.map(({ url }) => isUp(`https://${url}`)))
         ]);
 
-        search.addEventListener('input', onSearch);
-        search.style.display = 'block';
-
         document.getElementById('buttons').style.display = 'block';
         fillTable('sites');
+
+        const search = document.getElementById('search');
+
+        search.addEventListener('input', onSearch);
+        search.style.display = 'block';
+        search.focus();
       }
 
       main();
     </script>
   </body>
 </html>
-