--- a/web/src/main.ts	Sat Jul 06 16:45:19 2024 -0700
+++ b/web/src/main.ts	Sun Jul 07 16:26:56 2024 -0700
@@ -43,6 +43,12 @@
         top: -22px;
         z-index: -1;
       }
+      dt {
+        color: blue;
+      }
+      dd {
+        margin-bottom: 25px;
+      }
     `,
   ];
   @state() query: string = "climate";
@@ -106,11 +112,13 @@
         </form>
       </section>
       <section id="results">
-        ${this.results.map(
-          (r) =>
-            html`<div>${r.title}</div>
-              <div>${unsafeHTML(r.snippetHtml)}</div>`
-        )}
+        <dl>
+          ${this.results.map(
+            (r) =>
+              html`<dt>${r.title}</dt>
+                <dd>${unsafeHTML(r.snippetHtml)}</dd>`
+          )}
+        </dl>
         <div>Matching results: ${this.results.length}</div>
       </section>
     `;
@@ -127,17 +135,12 @@
 
     const sentQ = await this.getCurrentQuery();
 
-    // const resp = await fetch("query", {
-    //   method: "POST",
-    //   body: "query=" + encodeURIComponent(sentQ),
-    //   headers: { "Content-Type": "application/x-www-form-urlencoded" },
-    // });
-    // if (sentQ != (await this.getCurrentQuery())) {
-    //   // old result- ignore
-    //   return;
-    // }
-    this.results.push({ title: "doc1", snippetHtml: "<h1>hello</h1>" });
-    console.log("ScoSearchPage ~ submit ~  this.results:", this.results);
+    const resp = await fetch("query?" + new URLSearchParams({ q: sentQ }));
+    if (sentQ != (await this.getCurrentQuery())) {
+      // old result- ignore
+      return;
+    }
+    this.results = (await resp.json()).results;
     this.requestUpdate();
   }
 }