Updated Drupal to 8.6. This goes with the following updates because it's possible...

[yaffs-website] / web / core / profiles / demo_umami / themes / umami / css / components / blocks / search / search.css

diff --git a/web/core/profiles/demo_umami/themes/umami/css/components/blocks/search/search.css b/web/core/profiles/demo_umami/themes/umami/css/components/blocks/search/search.css
index 3edbac8567ae44fb84264ebe684f255d5034b2db..fe3684298847e56c9b3bbd95714beb6dd1f2a3fe 100644 (file)
--- a/web/core/profiles/demo_umami/themes/umami/css/components/blocks/search/search.css
+++ b/web/core/profiles/demo_umami/themes/umami/css/components/blocks/search/search.css
@@ -13,10 +13,8 @@
 
 @media screen and (min-width: 48em) {
   .search-block-form {
-    flex: 0 1 50%;
-    order: 1;
     display: block;
-    border-bottom: 1px solid #e6eee0;
+    flex: 0 1 50%;
   }
 }
 
@@ -27,11 +25,8 @@
 }
 
 .search-iconwrap {
-  flex: 0 1 30%;
-  order: 3;
-  display: flex;
-  justify-content: flex-end;
-  padding-right: 1rem;
+  /* Compensate for focus styling that offsets left alignment of icon */
+  margin-left: -7px;
 }
 
 @media screen and (min-width: 48em) {
@@ -42,19 +37,19 @@
 
 /* Search icon for mobile */
 .search-link {
-  width: 40px;
-  height: 40px;
   display: flex;
-  align-items: center;
   justify-content: flex-end;
+  align-items: center;
+  width: 40px;
+  height: 40px;
   /* Centres the icon when focused/hovered */
-  padding-right: 7px;
   margin-right: -7px;
+  padding-right: 7px;
 }
 .search-link:focus,
 .search-link:hover {
-  background-color: #fff;
   outline: 3px solid #00836d;
+  background-color: #fff;
 }
 .search-link svg {
   display: block;
@@ -67,25 +62,26 @@
   margin-top: 0;
   margin-bottom: 0;
 }
+
 .form-search {
   width: 20em;
   max-width: calc(100vw - 6.25em);
   height: auto;
   margin: 0 -2px 0 0;
   padding: 7px 8px 7px 32px;
+  color: #464646;
   border: 1px solid #dbdbdb;
   border-right: none;
   border-radius: 3px;
+  background: url(../../../../images/svg/search.svg) no-repeat 0.5em center #fff;
   font-size: 0.875rem;
   line-height: normal;
-  background: url(../../../../images/svg/search.svg) no-repeat 0.5em center #fff;
-  background-size: 1.5em;
-  color: #464646;
 }
+
 .form-search:focus {
-  outline: none;
   margin: 0 0 -2px -2px;
   padding: 5px 8px 5px 32px;
+  outline: none;
 }
 
 .form-search::placeholder {
@@ -97,10 +93,10 @@
 
 /* Search submit */
 .search-block-form .form-actions {
-  margin-top: 0;
-  margin-bottom: 0;
   position: relative;
   z-index: 1;
+  margin-top: 0;
+  margin-bottom: 0;
 }
 .search-block-form .form-submit,
 .search-form .form-submit {
@@ -113,7 +109,7 @@
 .search-block-form .form-submit:hover,
 .search-form .form-submit:focus,
 .search-form .form-submit:hover {
+  margin: 0;
   border-top-left-radius: 4px;
   border-bottom-left-radius: 4px;
-  margin: 0;
 }