From 71c3eac7250bdb47fe8b49d5e891bdb0e93b773a Mon Sep 17 00:00:00 2001
From: Luke Smith <Luke Smith>
Date: Thu, 23 Jun 2022 21:19:50 -0400
Subject: [PATCH] no styling in noscript, fix #788

---
 content/_index.md | 11 ++++-------
 static/style.css  |  2 ++
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/content/_index.md b/content/_index.md
index 9368520..39dc763 100644
--- a/content/_index.md
+++ b/content/_index.md
@@ -5,13 +5,7 @@ description: 'The fast-loading recipe site with cooking only and no ads.'
 
 ## What do you want to cook?
 
-<noscript>
-<style>
-.search { display: none; }
-</style>
-</noscript>
-
-<div class="search">
+<div class="search js-only">
   <input type="text" id="search" placeholder="Search...">
   <button class="clear-search">
     <svg xmlns="http://www.w3.org/2000/svg" class="ionicon" viewBox="0 0 512 512"><title>Backspace</title><path d="M135.19 390.14a28.79 28.79 0 0021.68 9.86h246.26A29 29 0 00432 371.13V140.87A29 29 0 00403.13 112H156.87a28.84 28.84 0 00-21.67 9.84v0L46.33 256l88.86 134.11z" fill="none" stroke="currentColor" stroke-linejoin="round" stroke-width="32"></path><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="32" d="M336.67 192.33L206.66 322.34M336.67 322.34L206.66 192.33M336.67 192.33L206.66 322.34M336.67 322.34L206.66 192.33"></path></svg>
@@ -20,6 +14,9 @@ description: 'The fast-loading recipe site with cooking only and no ads.'
 
 <script>
 document.addEventListener('DOMContentLoaded', () => {
+  for (e of document.getElementsByClassName("js-only")) {
+        e.classList.remove("js-only")
+  }
   const rec = document.querySelectorAll('#artlist li')
   const search = document.querySelector('#search')
   const clearSearch = document.querySelector('.clear-search')
diff --git a/static/style.css b/static/style.css
index 3c10664..ca7fd5f 100644
--- a/static/style.css
+++ b/static/style.css
@@ -270,3 +270,5 @@ button.clear-search:hover {
 .qr {
     max-height: 150px; ;
 }
+
+.js-only { display: none ; }