Issue #2938194 by markconroy, andrewmacpherson: Focus styles should meet...

Issue #2938194 by markconroy, andrewmacpherson: Focus styles should meet accessibility guidelines in Umami theme

core/profiles/demo_umami/themes/umami/css/base.css

@@ -199,6 +199,20 @@ input {
   font-size: 1rem;
   padding: 0.8rem 0.4rem;
 }
+input:focus {
+  border: 3px solid #00836d;
+  margin-bottom: 2px;
+}
+
+textarea {
+  border: 2px solid #767775;
+  color: #000;
+  padding: 0.8rem 0.4rem;
+}
+textarea:focus {
+  border: 3px solid #00836d;
+  margin-bottom: 2px;
+}
 
 label {
   color: #464646;

core/profiles/demo_umami/themes/umami/css/components/blocks/banner/banner.css

@@ -43,7 +43,8 @@
 .block-type-banner-block .field--name-field-content-link a:hover {
   background-color: #00836d;
   color: #fff;
-  text-decoration: underline;
+  outline: 2px solid currentColor;
+  outline-offset: -2px;
 }
 
 /* 768px */

core/profiles/demo_umami/themes/umami/css/components/blocks/search/search.css

@@ -51,6 +51,11 @@
   padding-right: 7px;
   margin-right: -7px;
 }
+.search-link:focus,
+.search-link:hover {
+  background-color: #fff;
+  outline: 3px solid #00836d;
+}
 .search-link svg {
   display: block;
   width: 26px;
@@ -63,11 +68,11 @@
   margin-bottom: 0;
 }
 .form-search {
-  width: 26em;
+  width: 20em;
   max-width: calc(100vw - 6.25em);
   height: auto;
-  margin: 0;
-  padding: 0.5em 6.25em 0.5em 2.25em;
+  margin: 0 -2px 0 0;
+  padding: 7px 8px 7px 32px;
   border: 1px solid #dbdbdb;
   border-right: none;
   border-radius: 3px;
@@ -79,7 +84,8 @@
 }
 .form-search:focus {
   outline: none;
-  box-shadow: 0 0 1px 1px #d62e5f;
+  margin: 0 0 -2px -2px;
+  padding: 5px 8px 5px 32px;
 }
 
 .form-search::placeholder {
@@ -93,8 +99,6 @@
 .search-block-form .form-actions {
   margin-top: 0;
   margin-bottom: 0;
-  width: 80px;
-  margin-left: -80px;
   position: relative;
   z-index: 1;
 }
@@ -104,3 +108,12 @@
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
 }
+
+.search-block-form .form-submit:focus,
+.search-block-form .form-submit:hover,
+.search-form .form-submit:focus,
+.search-form .form-submit:hover {
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px;
+  margin: 0;
+}

core/profiles/demo_umami/themes/umami/css/components/navigation/menu-main/menu-main.css

@@ -62,12 +62,12 @@
   background-color: inherit;
   text-decoration: none;
   border-bottom-color: rgba(255, 97, 56, 0.3);
-  color: #ff6138;
+  color: #da3c13;
 }
 .menu-main__link:active,
 .menu-main__link.is-active {
   text-decoration: none;
-  border-bottom-color: #ff6138;
+  border-bottom-color: #da3c13;
 }
 
 @media screen and (min-width: 48em) {