Toggle Switch: Add attribute selector to input (#977)

Esri · Aug 24, 2018 · 82bfc63 · 82bfc63
1 parent a5be263
commit 82bfc63
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,8 @@
+## [1.0.4]
+
+### Fixes
+- Fix `.toggle-switch-input` cascade (#977)
+
 ## [1.0.3]
 
 ### Fixes

diff --git a/lib/sass/calcite-web/components/_switches.scss b/lib/sass/calcite-web/components/_switches.scss
@@ -95,11 +95,8 @@ $handle-destructive-checked-border-color: $Calcite_Red_a250;
 }
 
 @mixin toggle-switch-input {
-  opacity: 0;
-  height: 0;
-  width: 0;
-  margin: 0;
-  position: absolute;
+  @include visually-hidden;
+
   // hover
   &:hover + .toggle-switch-track {
     border-color: $switch-hover-border-color;
@@ -191,7 +188,7 @@ $handle-destructive-checked-border-color: $Calcite_Red_a250;
 
 @if $include-switches == true {
   .toggle-switch { @include toggle-switch(); }
-  .toggle-switch-input { @include toggle-switch-input(); }
+  .toggle-switch-input[type] { @include toggle-switch-input(); }
   .toggle-switch-label { @include toggle-switch-label(); }
   .toggle-switch-track { @include toggle-switch-track(); }
   .toggle-switch-destructive { @include toggle-switch-destructive(); }