[A11Y] Adds missing focus rings back to control elements (#3016)

* Remove the stuff that removes critical accessibility features * Remove no outline from basic blade layout * Remove focus outline from FormControls
flarum · Sep 13, 2021 · c10a30b · c10a30b
1 parent b0bc021
commit c10a30b
Show file tree

Hide file tree

Showing 5 changed files with 2 additions and 13 deletions.
diff --git a/less/common/Button.less b/less/common/Button.less
@@ -64,12 +64,6 @@
   &.active,
   .open > &.Dropdown-toggle {
     .box-shadow(inset 0 3px 5px rgba(0, 0, 0, .125));
-    outline: none;
-  }
-
-  &:focus,
-  &.focus {
-    outline: none;
   }
 
   &.disabled,

diff --git a/less/common/Dropdown.less b/less/common/Dropdown.less
@@ -63,9 +63,6 @@
       &:hover {
         background: @control-bg;
       }
-      &:focus {
-        outline: none;
-      }
     }
     &.active {
       > a, > button {

diff --git a/less/common/FormControl.less b/less/common/FormControl.less
@@ -13,8 +13,7 @@
   transition: var(--transition);
   -webkit-appearance: none;
 
-  &:focus,
-  &.focus {
+  &:focus {
     background-color: @body-bg;
     color: @text-color;
     border-color: @primary-color;
@@ -44,6 +43,7 @@
     font-size: 16px; // minimum font-size required to prevent page zoom on focus in iOS 10
   }
 }
+
 .helpText {
   font-size: 12px;
   line-height: 1.5em;

diff --git a/less/common/Search.less b/less/common/Search.less
@@ -70,7 +70,6 @@
   .Button {
     float: left;
     margin-left: -36px;
-    outline: none;
     width: 36px !important;
 
     &.LoadingIndicator {

diff --git a/views/layouts/basic.blade.php b/views/layouts/basic.blade.php
@@ -86,7 +86,6 @@
       .form-control:focus,
       .form-control.focus {
          border-color: {{ $primaryColor }};
-         outline: none;
       }
       .errors {
         color: #d83e3e;