Commit 6512f12b authored by Gábor Hojtsy's avatar Gábor Hojtsy

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

Issue #2938194 by markconroy, andrewmacpherson: Focus styles should meet accessibility guidelines in Umami theme
parent cdbf659c
......@@ -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;
......
......@@ -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 */
......
......@@ -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;
}
......@@ -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) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment