Fix completition widget: body placement + style. (#8119)

Author: isoos

pkg/web_app/lib/src/widget/completion/widget.dart

@@ -86,8 +86,8 @@ void create(HTMLElement element, Map<String, String> options) {
       dropdown: dropdown,
       data: data,
     );
-    // Add dropdown after the <input>
-    document.body!.after(dropdown);
+    // Append dropdown to body
+    document.body!.append(dropdown);
   });
 }
 

pkg/web_css/lib/src/_search.scss

@@ -121,13 +121,13 @@
     cursor: pointer;
     white-space: nowrap;
     padding: 0px 3px;
-  }
-
-  >.completion-option-selected {
-    background-color: var(--pub-selected-bgColor);
 
     &:hover {
       background-color: var(--pub-selected-bgColor);
     }
   }
+
+  >.completion-option-selected {
+    background-color: var(--pub-selected-bgColor);
+  }
 }