Fix placement and color of search box on desktop and mobile

Author: maxious

CHANGES.md

@@ -52,6 +52,7 @@
 *   Added spacing on byline of dataset page
 *   Moved homepage config from S3 to local
 *   Made data quality rating use stars across search results and quality page, and made both use quality aspect.
+*   Fix placement and color of search box on desktop and mobile
 
 ## 0.0.37
 

magda-web-client/src/Components/Search/SearchBox.scss

@@ -16,6 +16,9 @@
 
 .searchBox-switcher {
     &.none-home {
+        @media (min-width: $medium) {
+            background: rgba(245, 245, 245, 0.8);
+        }
         .searchBox {
             background-color: transparent;
         }
@@ -68,6 +71,9 @@
         right: 0;
         padding: 11px;
         bottom: 0;
+        @media (min-width: $medium) {
+            bottom: 7px;
+        }
         border: 2px solid transparent;
         box-sizing: border-box;
         display: inline-block;