feat(md-collection): invert theme color for avatar

aurelia-ui-toolkits · Sep 19, 2016 · ab09b97 · ab09b97
1 parent 0f8c8e9
commit ab09b97
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 0 deletions.
diff --git a/sample/src/samples/collections/avatar.html b/sample/src/samples/collections/avatar.html
@@ -41,5 +41,15 @@
           <i class="material-icons">send</i>
         </div>
       </md-collection-item>
+      <md-collection-item class="accent-text avatar">
+        <i class="circle material-icons primary-text" style="font-size:36px;">person</i>
+        <span class="title">Title</span>
+        <p>First Line <br>
+           Second Line
+        </p>
+        <div class="secondary-content">
+          <i class="material-icons">send</i>
+        </div>
+      </md-collection-item>       
   </div>
 </template>
diff --git a/src/colors/md-colors.html b/src/colors/md-colors.html
@@ -138,6 +138,22 @@
   md-collection .collection md-collection-item.collection-item.avatar i.circle.success {
     background-color: ${mdAccentColor};
   }
+  md-collection .collection md-collection-item.collection-item.avatar i.circle.primary-text {
+    color: ${mdPrimaryColor};
+    background-color: transparent;
+  }
+  md-collection .collection md-collection-item.collection-item.avatar i.circle.accent-text {
+    color: ${mdAccentColor};
+    background-color: transparent;
+  }
+  md-collection .collection md-collection-item.collection-item.avatar i.circle.error-text {
+    color: ${mdErrorColor};
+    background-color: transparent;
+  }
+  md-collection .collection md-collection-item.collection-item.avatar i.circle.success-text {
+    color: ${mdAccentColor};
+    background-color: transparent;
+  }   
 
 
   /* datepicker */