Small fixes

- Fix md-icon-button not white on md-card-media-cover
- Allow custom md-ratio
- Fix cursor being a pointer when md-checkbox/md-radio is disabled
- Allow md-radio to be toggled even if id/name is not set
- Fix select all checkbox not updating when all md-table-row's are selected

Author: d3radicated

src/components/mdCard/mdCard.theme

@@ -89,6 +89,15 @@
           background-color: #{'BACKGROUND-CONTRAST-0.4'};
         }
       }
+
+      .md-card-header,
+      .md-card-actions {
+        .md-icon-button:not(.md-primary):not(.md-warn):not(.md-accent) {
+          .md-icon {
+            color: #fff;
+          }
+        }
+      }
     }
 
     .md-card-expand {

src/components/mdCard/mdCardMedia.vue

@@ -14,11 +14,21 @@
     },
     computed: {
       classes() {
-        let classes = {
-          'md-16-9': this.mdRatio === '16:9' || this.mdRatio === '16/9',
-          'md-4-3': this.mdRatio === '4:3' || this.mdRatio === '4/3',
-          'md-1-1': this.mdRatio === '1:1' || this.mdRatio === '1/1'
-        };
+        let classes = {};
+
+        if (this.mdRatio) {
+          let ratio = [];
+
+          if (this.mdRatio.indexOf(':') !== -1) {
+            ratio = this.mdRatio.split(':');
+          } else if (this.mdRatio.indexOf('/') !== -1) {
+            ratio = this.mdRatio.split('/');
+          }
+
+          if (ratio.length === 2) {
+            classes['md-' + ratio[0] + '-' + ratio[1]] = true;
+          }
+        }
 
         if (this.mdMedium || this.mdBig) {
           classes = {

src/components/mdCheckbox/mdCheckbox.scss

@@ -8,7 +8,14 @@ $checkbox-touch-size: 48px;
   margin: 16px 8px 16px 0;
   display: inline-flex;
   position: relative;
-  cursor: pointer;
+
+  &:not(.md-disabled) {
+    cursor: pointer;
+
+    .md-checkbox-label {
+      cursor: pointer;
+    }
+  }
 
   .md-checkbox-container {
     width: $checkbox-size;
@@ -78,7 +85,6 @@ $checkbox-touch-size: 48px;
     height: $checkbox-size;
     padding-left: 8px;
     line-height: $checkbox-size;
-    cursor: pointer;
   }
 }
 

src/components/mdRadio/mdRadio.scss

@@ -8,7 +8,14 @@ $radio-touch-size: 48px;
   margin: 16px 8px 16px 0;
   display: inline-flex;
   position: relative;
-  cursor: pointer;
+  
+  &:not(.md-disabled) {
+    cursor: pointer;
+
+    .md-radio-label {
+      cursor: pointer;
+    }
+  }
 
   .md-radio-container {
     width: $radio-size;
@@ -71,7 +78,6 @@ $radio-touch-size: 48px;
     height: $radio-size;
     padding-left: 8px;
     line-height: $radio-size;
-    cursor: pointer;
   }
 }
 

src/components/mdRadio/mdRadio.vue

@@ -1,11 +1,11 @@
 <template>
   <div class="md-radio" :class="[themeClass, classes]">
-    <div class="md-radio-container" @click="toggleCheck">
-      <input type="radio" :name="name" :id="id" :disabled="disabled" :value="value" @click="toggleCheck">
+    <div class="md-radio-container" @click.stop="toggleCheck">
+      <input type="radio" :name="name" :id="id" :disabled="disabled" :value="value">
       <md-ink-ripple :md-disabled="disabled" />
     </div>
 
-    <label :for="id || name" class="md-radio-label" v-if="$slots.default">
+    <label :for="id || name" class="md-radio-label" v-if="$slots.default" @click="toggleCheck">
       <slot></slot>
     </label>
   </div>

src/components/mdTable/mdTableRow.vue

@@ -65,7 +65,7 @@
       },
       handleSingleSelection(value) {
         this.parentTable.setRowSelection(value, this.mdItem);
-        this.parentTable.$children[0].checkbox = this.parentTable.numberOfSelected === this.parentTable.rowsCounter;
+        this.parentTable.$children[0].checkbox = this.parentTable.numberOfSelected === this.parentTable.numberOfRows;
       },
       handleMultipleSelection(value) {
         if (this.parentTable.numberOfRows > 25) {