Merge pull request #1253 from kishore08-07/add-slack-icon

Added Slack icon

Author: saurabhraghuvanshii

src/icons/SocialMedial/SlackIcon.tsx

@@ -0,0 +1,56 @@
+import React from 'react';
+import { SlackIconProps } from './types';
+
+const SlackIcon: React.FC<SlackIconProps> = ({
+  width = 40,
+  height = 40,
+  primaryColor = '#E01E5A',
+  secondaryColor = '#36C5F0',
+  tertiaryColor = '#2EB67D',
+  quaternaryColor = '#ECB22E',
+  style
+}) => (
+  <svg
+    width={width}
+    height={height}
+    viewBox="0 0 24 24"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    style={style}
+  >
+    <path
+      d="m8.843 12.651c-1.392 0-2.521 1.129-2.521 2.521v6.306c0 1.392 1.129 2.521 2.521 2.521s2.521-1.129 2.521-2.521v-6.306c-.001-1.392-1.13-2.521-2.521-2.521z"
+      fill={primaryColor}
+    />
+    <path
+      d="m.019 15.172c0 1.393 1.13 2.523 2.523 2.523s2.523-1.13 2.523-2.523v-2.523h-2.521c-.001 0-.001 0-.002 0-1.393 0-2.523 1.13-2.523 2.523z"
+      fill={secondaryColor}
+    />
+    <path
+      d="m8.846-.001c-.001 0-.002 0-.003 0-1.393 0-2.523 1.13-2.523 2.523s1.13 2.523 2.523 2.523h2.521v-2.523c0-.001 0-.003 0-.005-.001-1.391-1.128-2.518-2.518-2.518z"
+      fill={tertiaryColor}
+    />
+    <path
+      d="m2.525 11.37h6.318c1.393 0 2.523-1.13 2.523-2.523s-1.13-2.523-2.523-2.523h-6.318c-1.393 0-2.523 1.13-2.523 2.523s1.13 2.523 2.523 2.523z"
+      fill={quaternaryColor}
+    />
+    <path
+      d="m21.457 6.323c-1.391 0-2.518 1.127-2.518 2.518v.005 2.523h2.521c1.393 0 2.523-1.13 2.523-2.523s-1.13-2.523-2.523-2.523c-.001 0-.002 0-.003 0z"
+      fill={primaryColor}
+    />
+    <path
+      d="m12.641 2.522v6.325c0 1.392 1.129 2.521 2.521 2.521s2.521-1.129 2.521-2.521v-6.325c0-1.392-1.129-2.521-2.521-2.521-1.392 0-2.521 1.129-2.521 2.521z"
+      fill={secondaryColor}
+    />
+    <path
+      d="m17.682 21.476c0-1.392-1.129-2.521-2.521-2.521h-2.521v2.523c.001 1.391 1.129 2.519 2.521 2.519s2.521-1.129 2.521-2.521z"
+      fill={tertiaryColor}
+    />
+    <path
+      d="m21.479 12.649h-6.318c-1.393 0-2.523 1.13-2.523 2.523s1.13 2.523 2.523 2.523h6.318c1.393 0 2.523-1.13 2.523-2.523s-1.13-2.523-2.523-2.523z"
+      fill={quaternaryColor}
+    />
+  </svg>
+);
+
+export default SlackIcon;

src/icons/SocialMedial/index.ts

@@ -1,5 +1,6 @@
 import FacebookIcon from './FacebookIcon';
 import LinkedinIcon from './LinkedinIcon';
+import SlackIcon from './SlackIcon';
 import TwitterIcon from './TwitterIcon';
 
-export { FacebookIcon, LinkedinIcon, TwitterIcon };
+export { FacebookIcon, LinkedinIcon, SlackIcon, TwitterIcon };

src/icons/SocialMedial/types.ts

@@ -4,3 +4,10 @@ export interface IconProps {
   fill?: string;
   style?: React.CSSProperties;
 }
+
+export interface SlackIconProps extends IconProps {
+  primaryColor?: string;
+  secondaryColor?: string;
+  tertiaryColor?: string;
+  quaternaryColor?: string;
+}