CRM-16415 have font awesome handle ui-icon with fa- class
authorAndrew Hunt <andrew@aghstrategies.com>
Wed, 30 Sep 2015 21:13:36 +0000 (17:13 -0400)
committerAndrew Hunt <andrew@aghstrategies.com>
Tue, 13 Oct 2015 17:21:20 +0000 (13:21 -0400)
based on http://stackoverflow.com/a/17493936

----------------------------------------
* CRM-16415: Implement Font Awesome icon font
  https://issues.civicrm.org/jira/browse/CRM-16415

css/crm-i.css

index 12514a92087917abf2665494d3ed0878996010c4..cbdee150294bdd05a935630e95829ae0931da84a 100644 (file)
@@ -1,6 +1,7 @@
 /* Direct copy of .fa from font-awesome.css
 This is separate to avoid conflict with a site theme's implementation of FA.  It
 is loaded before font-awesome.css so that .fa-XXX classes can modify it. */
+.ui-icon[class*=" fa-"],
 .crm-i {
   display: inline-block;
   font: normal normal normal 14px/1 FontAwesome;
@@ -10,3 +11,24 @@ is loaded before font-awesome.css so that .fa-XXX classes can modify it. */
   -moz-osx-font-smoothing: grayscale;
   transform: translate(0, 0);
 }
+
+/* Have FA handle jQuery UI icons */
+
+.ui-icon[class*=" fa-"] {
+    /* Remove the jQuery UI Icon */
+    background: none repeat scroll 0 0 transparent !important;
+    /* Remove the jQuery UI Text Indent */
+    text-indent: 0;
+    /* Bump it up - jQuery UI is -8px */
+    margin-top: -0.5em;
+}
+
+/* Allow use of icon-large to be properly aligned */
+.ui-icon.icon-large {
+    margin-top: -0.75em;
+}
+
+.ui-button-icon-only .ui-icon[class*=" fa-"] {
+    /* Bump it - jQuery UI is -8px */
+    margin-left: -7px;
+}