@zohodesk/icons 1.4.0-exp-1 → 1.4.1

package/assets/react/zd-font-react-logo.module.css

@@ -1,7 +1,10 @@
 @font-face {
   font-family:"zdfonts-react-logo";
-  src: url('../fonts/zd-logo.woff2') format('woff2'),
-       url('../fonts/zd-logo.woff') format('woff');
+  src:
+    url('../fonts/zd-logo.woff2') format('woff2'),
+    
+    url('../fonts/zd-logo.woff') format('woff'),
+    url('../fonts/zd-logo.svg#zdfonts') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -15,9 +18,16 @@
 	font-family:"zdfonts-react-logo" !important;
 }
 
-/* Define icon codes */
-.icon-SkyDeskSupport .path1:before { content: "\b5000";  color: rgb(40, 149, 213); }
-.icon-SkyDeskSupport .path2:before { content: "\b5001"; margin-left: -3.108398em; color: rgb(115, 115, 115); }
-
-.icon-Zoho-Desk:before { content: "\b5002"; }
+.icon-SkyDeskSupport .path1:before {
+  content: "\e800";
+  color: rgb(40, 149, 213);
+}
+.icon-SkyDeskSupport .path2:before {
+  content: "\e801";
+  margin-left: -3.1083984375em;
+  color: rgb(115, 115, 115);
+}
+.icon-Zoho-Desk:before {
+  content: "\e802";
+}
 }

package/assets/react/zd-font-react-organization.module.css

@@ -1,7 +1,10 @@
 @font-face {
   font-family:"zdfonts-react-organization";
-  src: url('../fonts/zd-organization.woff2') format('woff2'),
-       url('../fonts/zd-organization.woff') format('woff');
+  src:
+    url('../fonts/zd-organization.woff2') format('woff2'),
+    
+    url('../fonts/zd-organization.woff') format('woff'),
+    url('../fonts/zd-organization.svg#zdfonts') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -11,36 +14,61 @@
 /*$Id$*/
 
 .ff{font-family:"zdfonts-react-organization" !important;}
-/* Define icon codes */
-.icon-add52:before { content: "\c5000"; }
-
-.icon-Addtick-inapp:before { content: "\c5001"; }
-
-.icon-book42:before { content: "\c5002"; }
-
-.icon-chat51:before { content: "\c5003"; }
-
-.icon-delete:before { content: "\c5004"; }
-
-.icon-file:before { content: "\c5005"; }
-
-.icon-mobile:before { content: "\c5006"; }
-
-.icon-multibrand-enb .path1:before { content: "\c5007";  color: rgb(187, 194, 202); }
-.icon-multibrand-enb .path2:before { content: "\c5008"; margin-left: -1.25em; color: rgb(125, 185, 100); }
-
-.icon-newchatgreenicn .path1:before { content: "\c5009";  color: rgb(255, 255, 255); }
-.icon-newchatgreenicn .path2:before { content: "\c500a"; margin-left: -1.0625em; color: rgb(20, 180, 116); }
-
-.icon-smily-bad-filled:before { content: "\c500b"; }
-
-.icon-smily-bad:before { content: "\c500c"; }
-
-.icon-smily-good-filled:before { content: "\c500d"; }
-
-.icon-smily-good:before { content: "\c500e"; }
-
-.icon-speechbubble56:before { content: "\c500f"; }
-
-.icon-team-assign:before { content: "\c5010"; }
+.icon-add52:before {
+  content: "\e900";
+}
+.icon-Addtick-inapp:before {
+  content: "\e901";
+}
+.icon-book42:before {
+  content: "\e902";
+}
+.icon-chat51:before {
+  content: "\e903";
+}
+.icon-delete:before {
+  content: "\e904";
+}
+.icon-file:before {
+  content: "\e905";
+}
+.icon-mobile:before {
+  content: "\e906";
+}
+.icon-multibrand-enb .path1:before {
+  content: "\e907";
+  color: rgb(187, 194, 202);
+}
+.icon-multibrand-enb .path2:before {
+  content: "\e908";
+  margin-left: -1.25em;
+  color: rgb(125, 185, 100);
+}
+.icon-newchatgreenicn .path1:before {
+  content: "\e909";
+  color: rgb(255, 255, 255);
+}
+.icon-newchatgreenicn .path2:before {
+  content: "\e90a";
+  margin-left: -1.0625em;
+  color: rgb(20, 180, 116);
+}
+.icon-smily-bad-filled:before {
+  content: "\e90b";
+}
+.icon-smily-bad:before {
+  content: "\e90c";
+}
+.icon-smily-good-filled:before {
+  content: "\e90d";
+}
+.icon-smily-good:before {
+  content: "\e90e";
+}
+.icon-speechbubble56:before {
+  content: "\e90f";
+}
+.icon-team-assign:before {
+  content: "\e910";
+}
 }

package/assets/react/zd-font-react-organization.plain.css

@@ -1,7 +1,10 @@
 @font-face {
   font-family:"zdfonts-react-organization";
-  src: url('../fonts/zd-organization.woff2') format('woff2'),
-       url('../fonts/zd-organization.woff') format('woff');
+  src:
+    url('../fonts/zd-organization.woff2') format('woff2'),
+    
+    url('../fonts/zd-organization.woff') format('woff'),
+    url('../fonts/zd-organization.svg#zdfonts') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -15,36 +18,61 @@
 	font-family:"zdfonts-react-organization" !important;
 }
 
-/* Define icon codes */
-.icon-add52:before { content: "\c5000"; }
-
-.icon-Addtick-inapp:before { content: "\c5001"; }
-
-.icon-book42:before { content: "\c5002"; }
-
-.icon-chat51:before { content: "\c5003"; }
-
-.icon-delete:before { content: "\c5004"; }
-
-.icon-file:before { content: "\c5005"; }
-
-.icon-mobile:before { content: "\c5006"; }
-
-.icon-multibrand-enb .path1:before { content: "\c5007";  color: rgb(187, 194, 202); }
-.icon-multibrand-enb .path2:before { content: "\c5008"; margin-left: -1.25em; color: rgb(125, 185, 100); }
-
-.icon-newchatgreenicn .path1:before { content: "\c5009";  color: rgb(255, 255, 255); }
-.icon-newchatgreenicn .path2:before { content: "\c500a"; margin-left: -1.0625em; color: rgb(20, 180, 116); }
-
-.icon-smily-bad-filled:before { content: "\c500b"; }
-
-.icon-smily-bad:before { content: "\c500c"; }
-
-.icon-smily-good-filled:before { content: "\c500d"; }
-
-.icon-smily-good:before { content: "\c500e"; }
-
-.icon-speechbubble56:before { content: "\c500f"; }
-
-.icon-team-assign:before { content: "\c5010"; }
+.icon-add52:before {
+  content: "\e900";
+}
+.icon-Addtick-inapp:before {
+  content: "\e901";
+}
+.icon-book42:before {
+  content: "\e902";
+}
+.icon-chat51:before {
+  content: "\e903";
+}
+.icon-delete:before {
+  content: "\e904";
+}
+.icon-file:before {
+  content: "\e905";
+}
+.icon-mobile:before {
+  content: "\e906";
+}
+.icon-multibrand-enb .path1:before {
+  content: "\e907";
+  color: rgb(187, 194, 202);
+}
+.icon-multibrand-enb .path2:before {
+  content: "\e908";
+  margin-left: -1.25em;
+  color: rgb(125, 185, 100);
+}
+.icon-newchatgreenicn .path1:before {
+  content: "\e909";
+  color: rgb(255, 255, 255);
+}
+.icon-newchatgreenicn .path2:before {
+  content: "\e90a";
+  margin-left: -1.0625em;
+  color: rgb(20, 180, 116);
+}
+.icon-smily-bad-filled:before {
+  content: "\e90b";
+}
+.icon-smily-bad:before {
+  content: "\e90c";
+}
+.icon-smily-good-filled:before {
+  content: "\e90d";
+}
+.icon-smily-good:before {
+  content: "\e90e";
+}
+.icon-speechbubble56:before {
+  content: "\e90f";
+}
+.icon-team-assign:before {
+  content: "\e910";
+}
 }

package/assets/react/zd-font-react-others.module.css

@@ -1,7 +1,10 @@
 @font-face {
   font-family:"zdfonts-react-others";
-  src: url('../fonts/zd-others.woff2') format('woff2'),
-       url('../fonts/zd-others.woff') format('woff');
+  src:
+    url('../fonts/zd-others.woff2') format('woff2'),
+    
+    url('../fonts/zd-others.woff') format('woff'),
+    url('../fonts/zd-others.svg#zdfonts') format('svg');
   font-weight: normal;
   font-style: normal;
   font-display: block;
@@ -11,88 +14,275 @@
 /*$Id$*/
 
 .ff{font-family:"zdfonts-react-others" !important;}
-/* Define icon codes */
-.icon-App-minimize:before { content: "\b7000"; }
-
-.icon-buildExtension .path1:before { content: "\b7001";  color: rgb(0, 0, 0); }
-.icon-buildExtension .path2:before { content: "\b7002"; margin-left: -1.060547em; color: rgb(0, 0, 0); opacity: 0.3; }
-.icon-buildExtension .path3:before { content: "\b7003"; margin-left: -1.060547em; color: rgb(0, 0, 0); opacity: 0.3; }
-.icon-buildExtension .path4:before { content: "\b7004"; margin-left: -1.060547em; color: rgb(0, 0, 0); opacity: 0.3; }
-
-.icon-Exclamation-new:before { content: "\b7005"; }
-
-.icon-installExtension .path1:before { content: "\b7006";  color: rgb(0, 0, 0); opacity: 0.6; }
-.icon-installExtension .path2:before { content: "\b7007"; margin-left: -1.038086em; color: rgb(0, 0, 0); opacity: 0.3; }
-.icon-installExtension .path3:before { content: "\b7008"; margin-left: -1.038086em; color: rgb(0, 0, 0); }
-.icon-installExtension .path4:before { content: "\b7009"; margin-left: -1.038086em; color: rgb(0, 0, 0); }
-
-.icon-JIRA_logo2:before { content: "\b700a"; color: rgb(0, 51, 102); }
-
-.icon-placeholder1 .path1:before { content: "\b700b";  color: rgb(202, 202, 202); }
-.icon-placeholder1 .path2:before { content: "\b700c"; margin-left: -1.182617em; color: rgb(170, 170, 170); }
-
-.icon-placeholder2 .path1:before { content: "\b700d";  color: rgb(202, 202, 202); }
-.icon-placeholder2 .path2:before { content: "\b700e"; margin-left: -1.182617em; color: rgb(170, 170, 170); }
-
-.icon-placeholder3 .path1:before { content: "\b700f";  color: rgb(202, 202, 202); }
-.icon-placeholder3 .path2:before { content: "\b7010"; margin-left: -1.182617em; color: rgb(170, 170, 170); }
-
-.icon-placeholder4 .path1:before { content: "\b7011";  color: rgb(202, 202, 202); }
-.icon-placeholder4 .path2:before { content: "\b7012"; margin-left: -1.186523em; color: rgb(170, 170, 170); }
-
-.icon-placeholder5 .path1:before { content: "\b7013";  color: rgb(202, 202, 202); }
-.icon-placeholder5 .path2:before { content: "\b7014"; margin-left: -1.182617em; color: rgb(170, 170, 170); }
-
-.icon-placeholder6 .path1:before { content: "\b7015";  color: rgb(202, 202, 202); }
-.icon-placeholder6 .path2:before { content: "\b7016"; margin-left: -1.182617em; color: rgb(170, 170, 170); }
-
-.icon-placeholder7 .path1:before { content: "\b7017";  color: rgb(202, 202, 202); }
-.icon-placeholder7 .path2:before { content: "\b7018"; margin-left: -1.182617em; color: rgb(170, 170, 170); }
-
-.icon-placeholder8 .path1:before { content: "\b7019";  color: rgb(202, 202, 202); }
-.icon-placeholder8 .path2:before { content: "\b701a"; margin-left: -1.186523em; color: rgb(170, 170, 170); }
-
-.icon-placeholder9 .path1:before { content: "\b701b";  color: rgb(202, 202, 202); }
-.icon-placeholder9 .path2:before { content: "\b701c"; margin-left: -1.182617em; color: rgb(170, 170, 170); }
-
-.icon-Problem .path1:before { content: "\b701d";  color: rgb(226, 75, 75); }
-.icon-Problem .path2:before { content: "\b701e"; margin-left: -1.125em; color: rgb(0, 0, 0); }
-.icon-Problem .path3:before { content: "\b701f"; margin-left: -1.125em; color: rgb(255, 255, 255); }
-
-.icon-surveyff .path1:before { content: "\b7020";  color: rgb(0, 0, 0); }
-.icon-surveyff .path2:before { content: "\b7021"; margin-left: -1em; color: rgb(0, 0, 0); }
-.icon-surveyff .path3:before { content: "\b7022"; margin-left: -1em; color: rgb(0, 0, 0); }
-.icon-surveyff .path4:before { content: "\b7023"; margin-left: -1em; color: rgb(0, 0, 0); }
-.icon-surveyff .path5:before { content: "\b7024"; margin-left: -1em; color: rgb(0, 172, 218); }
-
-.icon-surveyffn1-01 .path1:before { content: "\b7025";  color: rgb(0, 0, 0); }
-.icon-surveyffn1-01 .path2:before { content: "\b7026"; margin-left: -1em; color: rgb(0, 0, 0); }
-.icon-surveyffn1-01 .path3:before { content: "\b7027"; margin-left: -1em; color: rgb(0, 0, 0); }
-.icon-surveyffn1-01 .path4:before { content: "\b7028"; margin-left: -1em; color: rgb(0, 0, 0); }
-.icon-surveyffn1-01 .path5:before { content: "\b7029"; margin-left: -1em; color: rgb(0, 172, 218); }
-
-.icon-sync-after:before { content: "\b702a"; }
-
-.icon-sync-schedule:before { content: "\b702b"; }
-
-.icon-sync-setting:before { content: "\b702c"; }
-
-.icon-sync:before { content: "\b702d"; }
-
-.icon-syncing-new:before { content: "\b702e"; }
-
-.icon-uploadExtension .path1:before { content: "\b702f";  color: rgb(0, 0, 0); }
-.icon-uploadExtension .path2:before { content: "\b7030"; margin-left: -0.980469em; color: rgb(0, 0, 0); }
-.icon-uploadExtension .path3:before { content: "\b7031"; margin-left: -0.980469em; color: rgb(0, 0, 0); }
-.icon-uploadExtension .path4:before { content: "\b7032"; margin-left: -0.980469em; color: rgb(0, 0, 0); }
-.icon-uploadExtension .path5:before { content: "\b7033"; margin-left: -0.980469em; color: rgb(0, 0, 0); }
-.icon-uploadExtension .path6:before { content: "\b7034"; margin-left: -0.980469em; color: rgb(0, 0, 0); opacity: 0.4; }
-.icon-uploadExtension .path7:before { content: "\b7035"; margin-left: -0.980469em; color: rgb(0, 0, 0); opacity: 0.4; }
-.icon-uploadExtension .path8:before { content: "\b7036"; margin-left: -0.980469em; color: rgb(0, 0, 0); opacity: 0.4; }
-
-.icon-placeholder11 .path1:before { content: "\b7037";  color: rgb(51, 51, 51); }
-.icon-placeholder11 .path2:before { content: "\b7038"; margin-left: -1em; color: rgb(1, 1, 1); }
-
-.icon-placeholder10 .path1:before { content: "\b7039";  color: rgb(51, 51, 51); }
-.icon-placeholder10 .path2:before { content: "\b703a"; margin-left: -1em; color: rgb(1, 1, 1); }
+.icon-App-minimize:before {
+  content: "\f100";
+}
+.icon-buildExtension .path1:before {
+  content: "\f101";
+  color: rgb(0, 0, 0);
+}
+.icon-buildExtension .path2:before {
+  content: "\f102";
+  margin-left: -1.060546875em;
+  color: rgb(0, 0, 0);
+  opacity: 0.3;
+}
+.icon-buildExtension .path3:before {
+  content: "\f103";
+  margin-left: -1.060546875em;
+  color: rgb(0, 0, 0);
+  opacity: 0.3;
+}
+.icon-buildExtension .path4:before {
+  content: "\f104";
+  margin-left: -1.060546875em;
+  color: rgb(0, 0, 0);
+  opacity: 0.3;
+}
+.icon-Exclamation-new:before {
+  content: "\f105";
+}
+.icon-installExtension .path1:before {
+  content: "\f106";
+  color: rgb(0, 0, 0);
+  opacity: 0.6;
+}
+.icon-installExtension .path2:before {
+  content: "\f107";
+  margin-left: -1.0380859375em;
+  color: rgb(0, 0, 0);
+  opacity: 0.3;
+}
+.icon-installExtension .path3:before {
+  content: "\f108";
+  margin-left: -1.0380859375em;
+  color: rgb(0, 0, 0);
+}
+.icon-installExtension .path4:before {
+  content: "\f109";
+  margin-left: -1.0380859375em;
+  color: rgb(0, 0, 0);
+}
+.icon-JIRA_logo2:before {
+  content: "\f10a";
+  color: #036;
+}
+.icon-placeholder1 .path1:before {
+  content: "\f10b";
+  color: rgb(202, 202, 202);
+}
+.icon-placeholder1 .path2:before {
+  content: "\f10c";
+  margin-left: -1.1826171875em;
+  color: rgb(170, 170, 170);
+}
+.icon-placeholder2 .path1:before {
+  content: "\f10d";
+  color: rgb(202, 202, 202);
+}
+.icon-placeholder2 .path2:before {
+  content: "\f10e";
+  margin-left: -1.1826171875em;
+  color: rgb(170, 170, 170);
+}
+.icon-placeholder3 .path1:before {
+  content: "\f10f";
+  color: rgb(202, 202, 202);
+}
+.icon-placeholder3 .path2:before {
+  content: "\f110";
+  margin-left: -1.1826171875em;
+  color: rgb(170, 170, 170);
+}
+.icon-placeholder4 .path1:before {
+  content: "\f111";
+  color: rgb(202, 202, 202);
+}
+.icon-placeholder4 .path2:before {
+  content: "\f112";
+  margin-left: -1.1865234375em;
+  color: rgb(170, 170, 170);
+}
+.icon-placeholder5 .path1:before {
+  content: "\f113";
+  color: rgb(202, 202, 202);
+}
+.icon-placeholder5 .path2:before {
+  content: "\f114";
+  margin-left: -1.1826171875em;
+  color: rgb(170, 170, 170);
+}
+.icon-placeholder6 .path1:before {
+  content: "\f115";
+  color: rgb(202, 202, 202);
+}
+.icon-placeholder6 .path2:before {
+  content: "\f116";
+  margin-left: -1.1826171875em;
+  color: rgb(170, 170, 170);
+}
+.icon-placeholder7 .path1:before {
+  content: "\f117";
+  color: rgb(202, 202, 202);
+}
+.icon-placeholder7 .path2:before {
+  content: "\f118";
+  margin-left: -1.1826171875em;
+  color: rgb(170, 170, 170);
+}
+.icon-placeholder8 .path1:before {
+  content: "\f119";
+  color: rgb(202, 202, 202);
+}
+.icon-placeholder8 .path2:before {
+  content: "\f11a";
+  margin-left: -1.1865234375em;
+  color: rgb(170, 170, 170);
+}
+.icon-placeholder9 .path1:before {
+  content: "\f11b";
+  color: rgb(202, 202, 202);
+}
+.icon-placeholder9 .path2:before {
+  content: "\f11c";
+  margin-left: -1.1826171875em;
+  color: rgb(170, 170, 170);
+}
+.icon-Problem .path1:before {
+  content: "\f11d";
+  color: rgb(226, 75, 75);
+}
+.icon-Problem .path2:before {
+  content: "\f11e";
+  margin-left: -1.125em;
+  color: rgb(0, 0, 0);
+}
+.icon-Problem .path3:before {
+  content: "\f11f";
+  margin-left: -1.125em;
+  color: rgb(255, 255, 255);
+}
+.icon-surveyff .path1:before {
+  content: "\f120";
+  color: rgb(0, 0, 0);
+}
+.icon-surveyff .path2:before {
+  content: "\f121";
+  margin-left: -1em;
+  color: rgb(0, 0, 0);
+}
+.icon-surveyff .path3:before {
+  content: "\f122";
+  margin-left: -1em;
+  color: rgb(0, 0, 0);
+}
+.icon-surveyff .path4:before {
+  content: "\f123";
+  margin-left: -1em;
+  color: rgb(0, 0, 0);
+}
+.icon-surveyff .path5:before {
+  content: "\f124";
+  margin-left: -1em;
+  color: rgb(0, 172, 218);
+}
+.icon-surveyffn1-01 .path1:before {
+  content: "\f125";
+  color: rgb(0, 0, 0);
+}
+.icon-surveyffn1-01 .path2:before {
+  content: "\f126";
+  margin-left: -1em;
+  color: rgb(0, 0, 0);
+}
+.icon-surveyffn1-01 .path3:before {
+  content: "\f127";
+  margin-left: -1em;
+  color: rgb(0, 0, 0);
+}
+.icon-surveyffn1-01 .path4:before {
+  content: "\f128";
+  margin-left: -1em;
+  color: rgb(0, 0, 0);
+}
+.icon-surveyffn1-01 .path5:before {
+  content: "\f129";
+  margin-left: -1em;
+  color: rgb(0, 172, 218);
+}
+.icon-sync-after:before {
+  content: "\f12a";
+}
+.icon-sync-schedule:before {
+  content: "\f12b";
+}
+.icon-sync-setting:before {
+  content: "\f12c";
+}
+.icon-sync:before {
+  content: "\f12d";
+}
+.icon-syncing-new:before {
+  content: "\f12e";
+}
+.icon-uploadExtension .path1:before {
+  content: "\f12f";
+  color: rgb(0, 0, 0);
+}
+.icon-uploadExtension .path2:before {
+  content: "\f130";
+  margin-left: -0.98046875em;
+  color: rgb(0, 0, 0);
+}
+.icon-uploadExtension .path3:before {
+  content: "\f131";
+  margin-left: -0.98046875em;
+  color: rgb(0, 0, 0);
+}
+.icon-uploadExtension .path4:before {
+  content: "\f132";
+  margin-left: -0.98046875em;
+  color: rgb(0, 0, 0);
+}
+.icon-uploadExtension .path5:before {
+  content: "\f133";
+  margin-left: -0.98046875em;
+  color: rgb(0, 0, 0);
+}
+.icon-uploadExtension .path6:before {
+  content: "\f134";
+  margin-left: -0.98046875em;
+  color: rgb(0, 0, 0);
+  opacity: 0.4;
+}
+.icon-uploadExtension .path7:before {
+  content: "\f135";
+  margin-left: -0.98046875em;
+  color: rgb(0, 0, 0);
+  opacity: 0.4;
+}
+.icon-uploadExtension .path8:before {
+  content: "\f136";
+  margin-left: -0.98046875em;
+  color: rgb(0, 0, 0);
+  opacity: 0.4;
+}
+.icon-placeholder11 .path1:before {
+  content: "\f137";
+  color: rgb(51, 51, 51);
+}
+.icon-placeholder11 .path2:before {
+  content: "\f138";
+  margin-left: -1em;
+  color: rgb(1, 1, 1);
+}
+.icon-placeholder10 .path1:before {
+  content: "\f139";
+  color: rgb(51, 51, 51);
+}
+.icon-placeholder10 .path2:before {
+  content: "\f13a";
+  margin-left: -1em;
+  color: rgb(1, 1, 1);
+}
 }