site: add a class to search form

public/css/style.css

@@ -259,21 +259,21 @@ main {
   border-color: var(--text);
 }
 
-form[name=search] {
+.suggestions {
   gap: 0 var(--gallery-column-gap);
   justify-content: center;
   align-items: center;
 }
 
-form[name=search] input[type=submit] {
+.suggestions input[type=submit] {
   width: 7rem;
 }
 
-form[name=search] input[name=tags] {
+.suggestions input[name=tags] {
   width: 100%;
 }
 
-ul.suggestions {
+.suggestions ul {
   position: absolute;
 
   background-color: var(--bg);
@@ -285,7 +285,7 @@ ul.suggestions {
   list-style: none;
 }
 
-ul.suggestions li {
+.suggestions li {
   padding-left: 0.1875rem;
   padding-right: 0.1875rem;
 }

templates/_search.html.ep

@@ -2,7 +2,7 @@
 
 <%= form_for "list_media" =>
   name => "search",
-  class => "layout-flex-row" =>
+  class => "layout-flex-row suggestions" =>
   begin %>
   <div class="layout-flex-item-fullsize position-relative"
     x-data="tagsSuggestions('<%= param "tags" %>')"
@@ -17,7 +17,7 @@
       @keydown.up.prevent="previousItem"
       @keydown.down.prevent="nextItem"
       @keydown.escape="open = false">
-    <ul class="suggestions"
+    <ul
       x-ref="suggestions"
       x-cloak x-show="open && items.length > 0">
       <template x-for="(item, index) in sortedItems" :key="item.display">