fix(button): style disabled anchor/button elements

add opacity and remove pointer events closes #6108
ionic-team · May 20, 2016 · d0abbaf · d0abbaf
1 parent aeeae3f
commit d0abbaf
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 6 deletions.
diff --git a/src/components/button/button.scss b/src/components/button/button.scss
@@ -47,6 +47,8 @@ a[button] {
   text-decoration: none;
 }
 
+a[disabled],
+button[disabled],
 .button[disabled] {
   cursor: default;
   opacity: .4;

diff --git a/src/components/item/test/buttons/main.html b/src/components/item/test/buttons/main.html
@@ -24,17 +24,17 @@
     <button outline item-right (click)="testClick($event)">Outline</button>
   </ion-item>
 
-  <ion-item>
+  <button ion-item disabled>
     <button item-left (click)="testClick($event)">
       <ion-icon name="home"></ion-icon>
       Left Icon
     </button>
-    left icon buttons
+    disabled left icon buttons
     <button outline item-right (click)="testClick($event)">
       <ion-icon name="star"></ion-icon>
       Left Icon
     </button>
-  </ion-item>
+  </button>
 
   <ion-item>
     <button item-left (click)="testClick($event)">
@@ -58,13 +58,13 @@
     </button>
   </ion-item>
 
-  <ion-item>
-    ion-item right icon/text button large
+  <a ion-item disabled>
+    a ion-item disabled right icon/text button large
     <button item-right large (click)="testClick($event)">
       <ion-icon name="refresh"></ion-icon>
       Refresh
     </button>
-  </ion-item>
+  </a>
 
   <ion-item>
     <button clear item-left small (click)="testClick($event)">