Fix checkbox click for checkboxes without a label.

elastic · Mar 19, 2018 · 384f291 · 384f291
1 parent e0604ee
commit 384f291
Showing 1 changed file with 9 additions and 1 deletion.
diff --git a/src/components/form/checkbox/_checkbox.scss b/src/components/form/checkbox/_checkbox.scss
@@ -2,7 +2,14 @@
   position: relative;
 
   .euiCheckbox__input {
-    @include euiScreenReaderOnly;
+    opacity: 0;
+    overflow: hidden;
+    position: absolute;
+    z-index: 1;
+    top: 4px;
+    width: $euiCheckBoxSize;
+    height: $euiCheckBoxSize;
+    cursor: pointer;
 
     ~ .euiCheckbox__label {
       display: block;
@@ -17,6 +24,7 @@
     + .euiCheckbox__square {
       display: inline-block;
       position: absolute;
+      z-index: 0;
       left: 0;
       top: ($euiSizeL - $euiCheckBoxSize)/2;
       @include euiCustomControl($type: 'square', $size: $euiCheckBoxSize);