Merge pull request #55 from Giveth/add/options-icon

fix: add options icon

src/components/icons/Options/Options.tsx

@@ -0,0 +1,21 @@
+import React, { FC } from 'react';
+import { IIconProps } from '../type';
+import { IconOptions16 } from './Options16';
+import { IconOptions24 } from './Options24';
+import { IconOptions32 } from './Options32';
+
+export const IconOptions: FC<IIconProps> = ({
+	size = 16,
+	color = 'currentColor',
+}) => {
+	switch (size.toString()) {
+		case '16':
+			return <IconOptions16 color={color} />;
+		case '24':
+			return <IconOptions24 color={color} />;
+		case '32':
+			return <IconOptions32 color={color} />;
+		default:
+			return <IconOptions24 size={size} color={color} />;
+	}
+};

src/components/icons/Options/Options16.tsx

@@ -0,0 +1,22 @@
+import React, { FC } from 'react';
+import { IIconProps } from '../type';
+
+export const IconOptions16: FC<IIconProps> = ({
+	size = 16,
+	color = 'currentColor',
+}) => (
+	<svg
+		width={size}
+		height={size}
+		viewBox='0 0 14 12'
+		fill='none'
+		xmlns='http://www.w3.org/2000/svg'
+	>
+		<path
+			d='M10.5 2H13M10.5 2C10.5 2.55228 10.0523 3 9.5 3C8.94772 3 8.5 2.55228 8.5 2M10.5 2C10.5 1.44772 10.0523 1 9.5 1C8.94772 1 8.5 1.44772 8.5 2M1 2H8.5M10.5 10H13M10.5 10C10.5 10.5523 10.0523 11 9.5 11C8.94772 11 8.5 10.5523 8.5 10M10.5 10C10.5 9.44772 10.0523 9 9.5 9C8.94772 9 8.5 9.44772 8.5 10M1 10H8.5M5.5 6H13M5.5 6C5.5 6.55228 5.05228 7 4.5 7C3.94772 7 3.5 6.55228 3.5 6M5.5 6C5.5 5.44772 5.05228 5 4.5 5C3.94772 5 3.5 5.44772 3.5 6M1 6H3.5'
+			stroke={color}
+			strokeLinecap='round'
+			strokeLinejoin='round'
+		/>
+	</svg>
+);

src/components/icons/Options/Options24.tsx

@@ -0,0 +1,23 @@
+import React, { FC } from 'react';
+import { IIconProps } from '../type';
+
+export const IconOptions24: FC<IIconProps> = ({
+	size = 24,
+	color = 'currentColor',
+}) => (
+	<svg
+		width={size}
+		height={size}
+		viewBox='0 0 20 18'
+		fill='none'
+		xmlns='http://www.w3.org/2000/svg'
+	>
+		<path
+			d='M15.25 3H19M15.25 3C15.25 3.82843 14.5784 4.5 13.75 4.5C12.9216 4.5 12.25 3.82843 12.25 3M15.25 3C15.25 2.17157 14.5784 1.5 13.75 1.5C12.9216 1.5 12.25 2.17157 12.25 3M1 3H12.25M15.25 15H19M15.25 15C15.25 15.8284 14.5784 16.5 13.75 16.5C12.9216 16.5 12.25 15.8284 12.25 15M15.25 15C15.25 14.1716 14.5784 13.5 13.75 13.5C12.9216 13.5 12.25 14.1716 12.25 15M1 15H12.25M7.75 9H19M7.75 9C7.75 9.82843 7.07843 10.5 6.25 10.5C5.42157 10.5 4.75 9.82843 4.75 9M7.75 9C7.75 8.17157 7.07843 7.5 6.25 7.5C5.42157 7.5 4.75 8.17157 4.75 9M1 9H4.75'
+			stroke={color}
+			strokeWidth='1.5'
+			strokeLinecap='round'
+			strokeLinejoin='round'
+		/>
+	</svg>
+);

src/components/icons/Options/Options32.tsx

@@ -0,0 +1,23 @@
+import React, { FC } from 'react';
+import { IIconProps } from '../type';
+
+export const IconOptions32: FC<IIconProps> = ({
+	size = 32,
+	color = 'currentColor',
+}) => (
+	<svg
+		width={size}
+		height={size}
+		viewBox='0 0 26 22'
+		fill='none'
+		xmlns='http://www.w3.org/2000/svg'
+	>
+		<path
+			d='M20 3H25M20 3C20 4.10457 19.1046 5 18 5C16.8954 5 16 4.10457 16 3M20 3C20 1.89543 19.1046 1 18 1C16.8954 1 16 1.89543 16 3M1 3H16M20 19H25M20 19C20 20.1046 19.1046 21 18 21C16.8954 21 16 20.1046 16 19M20 19C20 17.8954 19.1046 17 18 17C16.8954 17 16 17.8954 16 19M1 19H16M10 11H25M10 11C10 12.1046 9.10457 13 8 13C6.89543 13 6 12.1046 6 11M10 11C10 9.89543 9.10457 9 8 9C6.89543 9 6 9.89543 6 11M1 11H6'
+			stroke={color}
+			strokeWidth='2'
+			strokeLinecap='round'
+			strokeLinejoin='round'
+		/>
+	</svg>
+);

src/components/index.ts

@@ -91,6 +91,11 @@ export * from './icons/RocketInSpace/RocketInSpace16';
 export * from './icons/RocketInSpace/RocketInSpace24';
 export * from './icons/RocketInSpace/RocketInSpace32';
 
+export * from './icons/Options/Options';
+export * from './icons/Options/Options16';
+export * from './icons/Options/Options24';
+export * from './icons/Options/Options32';
+
 export * from './icons/arrowCircles/ArrowCircleBottom';
 export * from './icons/arrowCircles/ArrowCircleLeft';
 export * from './icons/arrowCircles/ArrowCircleRight';