Skip to content

Commit

Permalink
Merge pull request #73 from Giveth/add_config_icon
Browse files Browse the repository at this point in the history 
add config icon
  • Loading branch information
@alireza-sharifpour
alireza-sharifpour authored Oct 31, 2022
2 parents a82e980 + dfce841 commit 8688db3
Show file tree
Hide file tree
Showing 7 changed files with 134 additions and 1 deletion.
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@giveth/ui-design-system",
"version": "1.8.27",
"version": "1.8.29",
"files": [
"/lib"
],
Expand Down
21 changes: 21 additions & 0 deletions src/components/icons/Config/Config.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import React, { FC } from 'react';
import { IIconProps } from '../type';
import { IconConfig16 } from './Config16';
import { IconConfig24 } from './Config24';
import { IconConfig32 } from './Config32';

export const IconConfig: FC<IIconProps> = ({
size = 16,
color = 'currentColor',
}) => {
switch (size.toString()) {
case '16':
return <IconConfig16 color={color} />;
case '24':
return <IconConfig24 color={color} />;
case '32':
return <IconConfig32 color={color} />;
default:
return <IconConfig24 size={size} color={color} />;
}
};
27 changes: 27 additions & 0 deletions src/components/icons/Config/Config16.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
import React, { FC } from 'react';
import { IIconProps } from '../type';

export const IconConfig16: FC<IIconProps> = ({ color = 'currentColor' }) => {
return (
<svg
width='16'
height='16'
viewBox='0 0 16 16'
fill='none'
xmlns='http://www.w3.org/2000/svg'
>
<path
d='M8.00002 10C9.10459 10 10 9.10457 10 8C10 6.89543 9.10459 6 8.00002 6C6.89545 6 6.00002 6.89543 6.00002 8C6.00002 9.10457 6.89545 10 8.00002 10Z'
stroke={color}
strokeLinecap='round'
strokeLinejoin='round'
/>
<path
d='M12.9334 10C12.8446 10.2011 12.8181 10.4241 12.8574 10.6404C12.8966 10.8567 12.9997 11.0562 13.1534 11.2133L13.1934 11.2533C13.3173 11.3772 13.4157 11.5242 13.4828 11.6861C13.5499 11.8479 13.5844 12.0214 13.5844 12.1967C13.5844 12.3719 13.5499 12.5454 13.4828 12.7073C13.4157 12.8691 13.3173 13.0162 13.1934 13.14C13.0695 13.264 12.9225 13.3623 12.7606 13.4294C12.5987 13.4965 12.4252 13.531 12.25 13.531C12.0748 13.531 11.9013 13.4965 11.7394 13.4294C11.5776 13.3623 11.4305 13.264 11.3067 13.14L11.2667 13.1C11.1096 12.9463 10.91 12.8432 10.6937 12.804C10.4775 12.7648 10.2544 12.7913 10.0534 12.88C9.85617 12.9645 9.68801 13.1048 9.56956 13.2837C9.45111 13.4625 9.38754 13.6721 9.38669 13.8867V14C9.38669 14.3536 9.24621 14.6928 8.99616 14.9428C8.74611 15.1929 8.40698 15.3333 8.05335 15.3333C7.69973 15.3333 7.36059 15.1929 7.11055 14.9428C6.8605 14.6928 6.72002 14.3536 6.72002 14V13.94C6.71486 13.7193 6.64343 13.5053 6.51503 13.3258C6.38662 13.1463 6.20718 13.0095 6.00002 12.9333C5.79894 12.8446 5.57589 12.8181 5.35963 12.8573C5.14336 12.8965 4.94381 12.9996 4.78669 13.1533L4.74669 13.1933C4.62286 13.3173 4.4758 13.4156 4.31394 13.4827C4.15208 13.5498 3.97857 13.5844 3.80335 13.5844C3.62813 13.5844 3.45463 13.5498 3.29277 13.4827C3.1309 13.4156 2.98385 13.3173 2.86002 13.1933C2.73605 13.0695 2.63771 12.9225 2.57061 12.7606C2.50351 12.5987 2.46897 12.4252 2.46897 12.25C2.46897 12.0748 2.50351 11.9013 2.57061 11.7394C2.63771 11.5775 2.73605 11.4305 2.86002 11.3067L2.90002 11.2667C3.05371 11.1095 3.15681 10.91 3.19602 10.6937C3.23524 10.4775 3.20876 10.2544 3.12002 10.0533C3.03551 9.85615 2.89519 9.68799 2.71633 9.56954C2.53747 9.45109 2.32788 9.38752 2.11335 9.38667H2.00002C1.6464 9.38667 1.30726 9.24619 1.05721 8.99614C0.807163 8.74609 0.666687 8.40695 0.666687 8.05333C0.666687 7.69971 0.807163 7.36057 1.05721 7.11052C1.30726 6.86048 1.6464 6.72 2.00002 6.72H2.06002C2.28068 6.71484 2.49469 6.64341 2.67422 6.51501C2.85375 6.3866 2.9905 6.20716 3.06669 6C3.15543 5.79892 3.1819 5.57587 3.14269 5.35961C3.10348 5.14334 3.00038 4.94379 2.84669 4.78667L2.80669 4.74667C2.68272 4.62284 2.58437 4.47578 2.51727 4.31392C2.45018 4.15206 2.41564 3.97855 2.41564 3.80333C2.41564 3.62811 2.45018 3.45461 2.51727 3.29275C2.58437 3.13088 2.68272 2.98383 2.80669 2.86C2.93052 2.73603 3.07757 2.63769 3.23943 2.57059C3.4013 2.50349 3.5748 2.46895 3.75002 2.46895C3.92524 2.46895 4.09874 2.50349 4.26061 2.57059C4.42247 2.63769 4.56952 2.73603 4.69335 2.86L4.73335 2.9C4.89047 3.05369 5.09003 3.15679 5.30629 3.196C5.52256 3.23522 5.74561 3.20874 5.94669 3.12H6.00002C6.1972 3.03549 6.36537 2.89517 6.48382 2.71631C6.60227 2.53745 6.66583 2.32786 6.66669 2.11333V2C6.66669 1.64638 6.80716 1.30724 7.05721 1.05719C7.30726 0.807142 7.6464 0.666666 8.00002 0.666666C8.35364 0.666666 8.69278 0.807142 8.94283 1.05719C9.19288 1.30724 9.33335 1.64638 9.33335 2V2.06C9.33421 2.27452 9.39778 2.48412 9.51623 2.66298C9.63468 2.84184 9.80284 2.98216 10 3.06667C10.2011 3.15541 10.4241 3.18188 10.6404 3.14267C10.8567 3.10346 11.0562 3.00036 11.2134 2.84667L11.2534 2.80667C11.3772 2.6827 11.5242 2.58435 11.6861 2.51725C11.848 2.45015 12.0215 2.41562 12.1967 2.41562C12.3719 2.41562 12.5454 2.45015 12.7073 2.51725C12.8691 2.58435 13.0162 2.6827 13.14 2.80667C13.264 2.9305 13.3623 3.07755 13.4294 3.23941C13.4965 3.40128 13.5311 3.57478 13.5311 3.75C13.5311 3.92522 13.4965 4.09872 13.4294 4.26059C13.3623 4.42245 13.264 4.5695 13.14 4.69333L13.1 4.73333C12.9463 4.89045 12.8432 5.09001 12.804 5.30627C12.7648 5.52254 12.7913 5.74559 12.88 5.94667V6C12.9645 6.19718 13.1049 6.36534 13.2837 6.48379C13.4626 6.60225 13.6722 6.66581 13.8867 6.66667H14C14.3536 6.66667 14.6928 6.80714 14.9428 7.05719C15.1929 7.30724 15.3334 7.64638 15.3334 8C15.3334 8.35362 15.1929 8.69276 14.9428 8.94281C14.6928 9.19286 14.3536 9.33333 14 9.33333H13.94C13.7255 9.33419 13.5159 9.39775 13.337 9.5162C13.1582 9.63466 13.0179 9.80282 12.9334 10Z'
stroke={color}
strokeLinecap='round'
strokeLinejoin='round'
/>
</svg>
);
};
32 changes: 32 additions & 0 deletions src/components/icons/Config/Config24.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
import React, { FC } from 'react';
import { IIconProps } from '../type';

export const IconConfig24: FC<IIconProps> = ({
size = 24,
color = 'currentColor',
}) => {
return (
<svg
width={size}
height={size}
viewBox='0 0 24 24'
fill='none'
xmlns='http://www.w3.org/2000/svg'
>
<path
d='M12 15C13.6569 15 15 13.6569 15 12C15 10.3431 13.6569 9 12 9C10.3431 9 9 10.3431 9 12C9 13.6569 10.3431 15 12 15Z'
stroke={color}
strokeWidth='1.5'
strokeLinecap='round'
strokeLinejoin='round'
/>
<path
d='M19.4 15C19.2669 15.3016 19.2272 15.6362 19.286 15.9606C19.3448 16.285 19.4995 16.5843 19.73 16.82L19.79 16.88C19.976 17.0657 20.1235 17.2863 20.2241 17.5291C20.3248 17.7719 20.3766 18.0322 20.3766 18.295C20.3766 18.5578 20.3248 18.8181 20.2241 19.0609C20.1235 19.3037 19.976 19.5243 19.79 19.71C19.6043 19.896 19.3837 20.0435 19.1409 20.1441C18.8981 20.2448 18.6378 20.2966 18.375 20.2966C18.1122 20.2966 17.8519 20.2448 17.6091 20.1441C17.3663 20.0435 17.1457 19.896 16.96 19.71L16.9 19.65C16.6643 19.4195 16.365 19.2648 16.0406 19.206C15.7162 19.1472 15.3816 19.1869 15.08 19.32C14.7842 19.4468 14.532 19.6572 14.3543 19.9255C14.1766 20.1938 14.0813 20.5082 14.08 20.83V21C14.08 21.5304 13.8693 22.0391 13.4942 22.4142C13.1191 22.7893 12.6104 23 12.08 23C11.5496 23 11.0409 22.7893 10.6658 22.4142C10.2907 22.0391 10.08 21.5304 10.08 21V20.91C10.0723 20.579 9.96512 20.258 9.77251 19.9887C9.5799 19.7194 9.31074 19.5143 9 19.4C8.69838 19.2669 8.36381 19.2272 8.03941 19.286C7.71502 19.3448 7.41568 19.4995 7.18 19.73L7.12 19.79C6.93425 19.976 6.71368 20.1235 6.47088 20.2241C6.22808 20.3248 5.96783 20.3766 5.705 20.3766C5.44217 20.3766 5.18192 20.3248 4.93912 20.2241C4.69632 20.1235 4.47575 19.976 4.29 19.79C4.10405 19.6043 3.95653 19.3837 3.85588 19.1409C3.75523 18.8981 3.70343 18.6378 3.70343 18.375C3.70343 18.1122 3.75523 17.8519 3.85588 17.6091C3.95653 17.3663 4.10405 17.1457 4.29 16.96L4.35 16.9C4.58054 16.6643 4.73519 16.365 4.794 16.0406C4.85282 15.7162 4.81312 15.3816 4.68 15.08C4.55324 14.7842 4.34276 14.532 4.07447 14.3543C3.80618 14.1766 3.49179 14.0813 3.17 14.08H3C2.46957 14.08 1.96086 13.8693 1.58579 13.4942C1.21071 13.1191 1 12.6104 1 12.08C1 11.5496 1.21071 11.0409 1.58579 10.6658C1.96086 10.2907 2.46957 10.08 3 10.08H3.09C3.42099 10.0723 3.742 9.96512 4.0113 9.77251C4.28059 9.5799 4.48572 9.31074 4.6 9C4.73312 8.69838 4.77282 8.36381 4.714 8.03941C4.65519 7.71502 4.50054 7.41568 4.27 7.18L4.21 7.12C4.02405 6.93425 3.87653 6.71368 3.77588 6.47088C3.67523 6.22808 3.62343 5.96783 3.62343 5.705C3.62343 5.44217 3.67523 5.18192 3.77588 4.93912C3.87653 4.69632 4.02405 4.47575 4.21 4.29C4.39575 4.10405 4.61632 3.95653 4.85912 3.85588C5.10192 3.75523 5.36217 3.70343 5.625 3.70343C5.88783 3.70343 6.14808 3.75523 6.39088 3.85588C6.63368 3.95653 6.85425 4.10405 7.04 4.29L7.1 4.35C7.33568 4.58054 7.63502 4.73519 7.95941 4.794C8.28381 4.85282 8.61838 4.81312 8.92 4.68H9C9.29577 4.55324 9.54802 4.34276 9.72569 4.07447C9.90337 3.80618 9.99872 3.49179 10 3.17V3C10 2.46957 10.2107 1.96086 10.5858 1.58579C10.9609 1.21071 11.4696 1 12 1C12.5304 1 13.0391 1.21071 13.4142 1.58579C13.7893 1.96086 14 2.46957 14 3V3.09C14.0013 3.41179 14.0966 3.72618 14.2743 3.99447C14.452 4.26276 14.7042 4.47324 15 4.6C15.3016 4.73312 15.6362 4.77282 15.9606 4.714C16.285 4.65519 16.5843 4.50054 16.82 4.27L16.88 4.21C17.0657 4.02405 17.2863 3.87653 17.5291 3.77588C17.7719 3.67523 18.0322 3.62343 18.295 3.62343C18.5578 3.62343 18.8181 3.67523 19.0609 3.77588C19.3037 3.87653 19.5243 4.02405 19.71 4.21C19.896 4.39575 20.0435 4.61632 20.1441 4.85912C20.2448 5.10192 20.2966 5.36217 20.2966 5.625C20.2966 5.88783 20.2448 6.14808 20.1441 6.39088C20.0435 6.63368 19.896 6.85425 19.71 7.04L19.65 7.1C19.4195 7.33568 19.2648 7.63502 19.206 7.95941C19.1472 8.28381 19.1869 8.61838 19.32 8.92V9C19.4468 9.29577 19.6572 9.54802 19.9255 9.72569C20.1938 9.90337 20.5082 9.99872 20.83 10H21C21.5304 10 22.0391 10.2107 22.4142 10.5858C22.7893 10.9609 23 11.4696 23 12C23 12.5304 22.7893 13.0391 22.4142 13.4142C22.0391 13.7893 21.5304 14 21 14H20.91C20.5882 14.0013 20.2738 14.0966 20.0055 14.2743C19.7372 14.452 19.5268 14.7042 19.4 15Z'
stroke={color}
strokeWidth='1.5'
strokeLinecap='round'
strokeLinejoin='round'
/>
</svg>
);
};
29 changes: 29 additions & 0 deletions src/components/icons/Config/Config32.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import React, { FC } from 'react';
import { IIconProps } from '../type';

export const IconConfig32: FC<IIconProps> = ({ color = 'currentColor' }) => {
return (
<svg
width='32'
height='32'
viewBox='0 0 32 32'
fill='none'
xmlns='http://www.w3.org/2000/svg'
>
<path
d='M16 20C18.2091 20 20 18.2091 20 16C20 13.7909 18.2091 12 16 12C13.7908 12 12 13.7909 12 16C12 18.2091 13.7908 20 16 20Z'
stroke={color}
strokeWidth='2'
strokeLinecap='round'
strokeLinejoin='round'
/>
<path
d='M25.8666 20C25.6892 20.4022 25.6362 20.8483 25.7146 21.2808C25.7931 21.7133 25.9993 22.1124 26.3066 22.4267L26.3866 22.5067C26.6346 22.7543 26.8313 23.0484 26.9655 23.3722C27.0997 23.6959 27.1687 24.0429 27.1687 24.3933C27.1687 24.7438 27.0997 25.0908 26.9655 25.4145C26.8313 25.7382 26.6346 26.0323 26.3866 26.28C26.139 26.5279 25.8449 26.7246 25.5212 26.8588C25.1974 26.993 24.8504 27.0621 24.5 27.0621C24.1495 27.0621 23.8025 26.993 23.4788 26.8588C23.1551 26.7246 22.861 26.5279 22.6133 26.28L22.5333 26.2C22.2191 25.8926 21.82 25.6864 21.3874 25.608C20.9549 25.5296 20.5088 25.5825 20.1066 25.76C19.7123 25.929 19.376 26.2097 19.1391 26.5674C18.9022 26.9251 18.775 27.3443 18.7733 27.7733V28C18.7733 28.7072 18.4924 29.3855 17.9923 29.8856C17.4922 30.3857 16.8139 30.6667 16.1066 30.6667C15.3994 30.6667 14.7211 30.3857 14.221 29.8856C13.7209 29.3855 13.44 28.7072 13.44 28V27.88C13.4297 27.4387 13.2868 27.0107 13.03 26.6516C12.7732 26.2925 12.4143 26.019 12 25.8667C11.5978 25.6892 11.1517 25.6362 10.7192 25.7147C10.2867 25.7931 9.88755 25.9993 9.57331 26.3067L9.49331 26.3867C9.24565 26.6346 8.95155 26.8313 8.62782 26.9655C8.30409 27.0997 7.95709 27.1688 7.60665 27.1688C7.25621 27.1688 6.9092 27.0997 6.58547 26.9655C6.26174 26.8313 5.96764 26.6346 5.71998 26.3867C5.47204 26.139 5.27535 25.8449 5.14115 25.5212C5.00696 25.1974 4.93788 24.8504 4.93788 24.5C4.93788 24.1496 5.00696 23.8026 5.14115 23.4788C5.27535 23.1551 5.47204 22.861 5.71998 22.6133L5.79998 22.5333C6.10736 22.2191 6.31356 21.82 6.39199 21.3875C6.47041 20.9549 6.41747 20.5088 6.23998 20.1067C6.07096 19.7123 5.79032 19.376 5.4326 19.1391C5.07488 18.9022 4.6557 18.775 4.22665 18.7733H3.99998C3.29274 18.7733 2.61446 18.4924 2.11436 17.9923C1.61426 17.4922 1.33331 16.8139 1.33331 16.1067C1.33331 15.3994 1.61426 14.7211 2.11436 14.2211C2.61446 13.721 3.29274 13.44 3.99998 13.44H4.11998C4.56131 13.4297 4.98932 13.2868 5.34838 13.03C5.70744 12.7732 5.98093 12.4143 6.13331 12C6.3108 11.5978 6.36374 11.1517 6.28532 10.7192C6.20689 10.2867 6.0007 9.88757 5.69331 9.57334L5.61331 9.49334C5.36538 9.24567 5.16869 8.95157 5.03449 8.62784C4.90029 8.30412 4.83122 7.95711 4.83122 7.60667C4.83122 7.25623 4.90029 6.90922 5.03449 6.58549C5.16869 6.26177 5.36538 5.96766 5.61331 5.72C5.86097 5.47207 6.15508 5.27537 6.47881 5.14118C6.80253 5.00698 7.14954 4.9379 7.49998 4.9379C7.85042 4.9379 8.19743 5.00698 8.52115 5.14118C8.84488 5.27537 9.13898 5.47207 9.38665 5.72L9.46665 5.8C9.78089 6.10739 10.18 6.31358 10.6125 6.39201C11.0451 6.47043 11.4912 6.41749 11.8933 6.24H12C12.3943 6.07099 12.7307 5.79034 12.9676 5.43262C13.2045 5.0749 13.3316 4.65572 13.3333 4.22667V4C13.3333 3.29276 13.6143 2.61448 14.1144 2.11438C14.6145 1.61429 15.2927 1.33334 16 1.33334C16.7072 1.33334 17.3855 1.61429 17.8856 2.11438C18.3857 2.61448 18.6666 3.29276 18.6666 4V4.12C18.6684 4.54905 18.7955 4.96824 19.0324 5.32596C19.2693 5.68368 19.6056 5.96432 20 6.13334C20.4021 6.31082 20.8482 6.36377 21.2808 6.28534C21.7133 6.20692 22.1124 6.00072 22.4266 5.69334L22.5066 5.61334C22.7543 5.3654 23.0484 5.16871 23.3721 5.03451C23.6959 4.90031 24.0429 4.83124 24.3933 4.83124C24.7438 4.83124 25.0908 4.90031 25.4145 5.03451C25.7382 5.16871 26.0323 5.3654 26.28 5.61334C26.5279 5.861 26.7246 6.1551 26.8588 6.47883C26.993 6.80256 27.0621 7.14956 27.0621 7.5C27.0621 7.85044 26.993 8.19745 26.8588 8.52118C26.7246 8.84491 26.5279 9.13901 26.28 9.38667L26.2 9.46667C25.8926 9.78091 25.6864 10.18 25.608 10.6126C25.5295 11.0451 25.5825 11.4912 25.76 11.8933V12C25.929 12.3944 26.2096 12.7307 26.5674 12.9676C26.9251 13.2045 27.3443 13.3316 27.7733 13.3333H28C28.7072 13.3333 29.3855 13.6143 29.8856 14.1144C30.3857 14.6145 30.6666 15.2928 30.6666 16C30.6666 16.7072 30.3857 17.3855 29.8856 17.8856C29.3855 18.3857 28.7072 18.6667 28 18.6667H27.88C27.4509 18.6684 27.0317 18.7955 26.674 19.0324C26.3163 19.2693 26.0357 19.6056 25.8666 20Z'
stroke={color}
strokeWidth='2'
strokeLinecap='round'
strokeLinejoin='round'
/>
</svg>
);
};
5 changes: 5 additions & 0 deletions src/components/index.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -122,6 +122,11 @@ export * from './icons/NotificationOutline/NotificationOutline16';
export * from './icons/NotificationOutline/NotificationOutline24';
export * from './icons/NotificationOutline/NotificationOutline32';

export * from './icons/Config/Config';
export * from './icons/Config/Config16';
export * from './icons/Config/Config24';
export * from './icons/Config/Config32';

export * from './icons/arrowCircles/ArrowCircleBottom';
export * from './icons/arrowCircles/ArrowCircleLeft';
export * from './icons/arrowCircles/ArrowCircleRight';
Expand Down
19 changes: 19 additions & 0 deletions src/stories/icons/IconConfig.stories.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
import React from 'react';
import { ComponentStory, ComponentMeta } from '@storybook/react';
import { IconConfig } from '../../components';

export default {
title: 'Example/Icons/Config',
component: IconConfig,
} as ComponentMeta<typeof IconConfig>;

const Template: ComponentStory<typeof IconConfig> = args => (
<IconConfig {...args} />
);

export const Config = Template.bind({});
Config.storyName = 'Config';
Config.args = {
color: 'white',
size: 24,
};

0 comments on commit 8688db3

Please sign in to comment.