ui tweaks for the like search results

private_search_page.js

···
   /** @param {string} query */
 
   searchInLycan(query) {
+    this.results.innerHTML = '';
+
     if (query.length == 0) {
-      this.results.innerHTML = '';
       return;
     }
 
-    this.results.innerHTML = '...';
+    let loading = $tag('p', { text: "..." });
+    this.results.append(loading);
 
     let isLoading = false;
     let firstPageLoaded = false;
···
       }
 
       if (response.posts.length == 0) {
-        this.results.append(firstPageLoaded ? "No more results." : "No results.");
+        let p = $tag('p.results-end', { text: firstPageLoaded ? "No more results." : "No results." });
+        loading.remove();
+        this.results.append(p);
+
         isLoading = false;
         finished = true;
         return;
···
       let posts = records.map(x => new Post(x));
 
       if (!firstPageLoaded) {
-        this.results.innerHTML = '';
+        loading.remove();
         firstPageLoaded = true;
       }
 

style.css

···
   margin-left: 8px;
 }
 
+#private_search_page .results {
+  margin-top: 30px;
+}
+
 #private_search_page .results > .post {
-  padding-left: 0;
+  margin-left: -15px;
+  padding-left: 15px;
+  border-bottom: 1px solid #ddd;
+  padding-bottom: 10px;
+  margin-top: 24px;
+}
+
+#private_search_page .results-end {
+  font-size: 12pt;
+  color: #333;  
+}
+
+#private_search_page .post + .results-end {
+  font-size: 11pt;
 }
 
 @media (prefers-color-scheme: dark) {
···
 
   #private_search_page .search-query {
     border: 1px solid #666;
+  }
+
+  #private_search_page .results-end {
+    color: #888;  
+  }
+
+  #private_search_page .results > .post {
+    border-bottom: 1px solid #555;
   }
 }