Update SearchField styles (#570)

src/ensembl/src/content/app/species-selector/components/species-search-field/SpeciesSearchField.scss

@@ -6,19 +6,15 @@ $rightCornerWidth: 40px;
   display: inline-flex;
   align-items: center;
   position: relative;
-  padding: 4px;
   width: 100%;
   max-width: 485px;
-  height: 36px;
-  box-shadow: inset 2px 2px 4px -2px $dark-grey;
-  background: white;
 
   // nesting to increase specificity of the selector (needs to override child rules)
   .speciesSearchField {
     width: 100%;
     background: $white;
-    padding-left: 18px;
-    border: none;
+    height: 36px;
+    padding-left: 22px;
   
     input {
       &::placeholder {

src/ensembl/src/shared/components/in-app-search/InAppSearch.scss

@@ -22,8 +22,6 @@
 
 .searchFieldWrapper {
   grid-area: search-field;
-  padding: 4px;
-  box-shadow: inset 2px 2px 4px -2px $dark-grey;
   background: white;
 
   &Interstitial {
@@ -32,9 +30,7 @@
 
   // nesting to increase specificity of the selector
   .searchField {
-    border: none;
     width: 100%;
-    height: 100%;
   }
 }
 

src/ensembl/src/shared/components/search-field/SearchField.scss

 @import 'src/styles/common';
 
 .searchField {
-  border: 1px solid $grey;
+  box-shadow: $form-field-shadow;
+  height: 30px;
   display: inline-flex;
-  padding: 0 0.6em;
+  padding: 0 12px;
+
+  input {
+    background-color: transparent;
+  }
 }
 
 .searchFieldRightCorner {