Skip to content

Commit

Permalink
Adjust some icons sizing and add 2 icons.
Browse files Browse the repository at this point in the history
  • Loading branch information
salamca committed Nov 11, 2023
1 parent 60b046b commit 74a7be5
Show file tree
Hide file tree
Showing 9 changed files with 295 additions and 44 deletions.
40 changes: 33 additions & 7 deletions src/components/ui/icons/aid.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,36 @@
import Icon, { IconProps } from "./icon";
import { IconSize } from "./icon-size";

function IconAid(props: IconProps) {
return (
<Icon {...props}>
<path d="M5.95005 21C5.63338 21 5.38338 20.871 5.20005 20.613C5.01672 20.3543 4.96672 20.075 5.05005 19.775L9.50005 3.7C9.56672 3.48333 9.68338 3.31267 9.85005 3.188C10.0167 3.06267 10.2084 3 10.425 3C10.7584 3 11.0167 3.129 11.2 3.387C11.3834 3.64567 11.4334 3.925 11.35 4.225L10.85 6H16.475L17.1 3.7C17.1667 3.48333 17.2874 3.31267 17.462 3.188C17.6374 3.06267 17.8334 3 18.05 3C18.3667 3 18.6167 3.129 18.8 3.387C18.9834 3.64567 19.0334 3.925 18.95 4.225L14.5 20.3C14.4334 20.5167 14.3167 20.6873 14.15 20.812C13.9834 20.9373 13.7917 21 13.575 21C13.2417 21 12.9834 20.871 12.8 20.613C12.6167 20.3543 12.5667 20.075 12.65 19.775L13.15 18H7.52505L6.90005 20.3C6.83338 20.5167 6.71272 20.6873 6.53805 20.812C6.36272 20.9373 6.16672 21 5.95005 21ZM9.47505 11H15.075L15.9 8H10.3L9.47505 11ZM8.10005 16H13.7L14.525 13H8.92505L8.10005 16Z" />
</Icon>
);
type TIconAidProps = {
size: IconSize.small | IconSize.regular;
};

function IconAid({ size }: TIconAidProps) {
switch (size) {
case IconSize.small:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="20"
height="20"
className="fill-current"
>
<path d="M132-192q-15.3 0-25.65-11Q96-214 96-229.111q0-8.889 3.867-16.569 3.866-7.681 11.6-12.199L444-491v-73q0-15.3 11.122-25.65Q466.244-600 482-600q20 0 33-14.442t13-34.5Q528-669 514-682.5T480-696q-20 0-34 14t-14 34h-72q0-50 35.202-85t85-35Q530-768 565-733.379t35 84.202Q600-609 577-576.5 554-544 516-533v42l332.533 234.043q7.734 4.536 11.6 12.246Q864-237 864-228q0 15.3-10.35 25.65Q843.3-192 828-192H132Zm114-72h468L480-428 246-264Z" />
</svg>
);

case IconSize.regular:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="24"
height="24"
className="fill-current"
>
<path d="M120-160q-17 0-28.5-11.5T80-200q0-10 4-18.5T96-232l344-258v-70q0-17 12-28.5t29-11.5q25 0 42-18t17-43q0-25-17.5-42T480-720q-25 0-42.5 17.5T420-660h-80q0-58 41-99t99-41q58 0 99 40.5t41 98.5q0 47-27.5 84T520-526v36l344 258q8 5 12 13.5t4 18.5q0 17-11.5 28.5T840-160H120Zm120-80h480L480-420 240-240Z" />
</svg>
);
}
}
export default IconAid;
36 changes: 36 additions & 0 deletions src/components/ui/icons/attempt.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import { IconSize } from "./icon-size";

type TIconAttemptProps = {
size: IconSize.small | IconSize.regular;
};

function IconAttempt({ size }: TIconAttemptProps) {
switch (size) {
case IconSize.small:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
height="20"
width="20"
className="fill-current"
>
<path d="m291-240-51-51 189-189-189-189 51-51 189 189 189-189 51 51-189 189 189 189-51 51-189-189-189 189Z" />
</svg>
);

case IconSize.regular:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="24"
height="24"
className="fill-current"
>
<path d="m256-200-56-56 224-224-224-224 56-56 224 224 224-224 56 56-224 224 224 224-56 56-224-224-224 224Z" />
</svg>
);
}
}
export default IconAttempt;
40 changes: 33 additions & 7 deletions src/components/ui/icons/flash.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,36 @@
import Icon, { IconProps } from "./icon";
import { IconSize } from "./icon-size";

function IconFlash(props: IconProps) {
return (
<Icon {...props}>
<path d="M12 15.6L15.2 11H12.35L14.35 4H9V12H12V15.6ZM10 22V14H7V2H17L15 9H19L10 22Z" />
</Icon>
);
type TIconFlashProps = {
size: IconSize.small | IconSize.regular;
};

function IconFlash({ size }: TIconFlashProps) {
switch (size) {
case IconSize.small:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="24"
height="24"
className="fill-current"
>
<path d="m480-336 128-184H494l80-280H360v320h120v144ZM400-80v-320H280v-480h400l-80 280h160L400-80Zm80-400H360h120Z" />
</svg>
);

case IconSize.regular:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="20"
height="20"
className="fill-current"
>
<path d="m480-334 130-194H506l72-264H360v312h120v146ZM408-96v-312H288v-456h384l-72 264h144L408-96Zm72-384H360h120Z" />
</svg>
);
}
}
export default IconFlash;
43 changes: 35 additions & 8 deletions src/components/ui/icons/onsight.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,37 @@
import Icon, { IconProps } from "./icon";

function IconOnsight(props: IconProps) {
return (
<Icon {...props}>
<path d="M12 16C13.25 16 14.3127 15.5627 15.188 14.688C16.0627 13.8127 16.5 12.75 16.5 11.5C16.5 10.25 16.0627 9.18733 15.188 8.312C14.3127 7.43733 13.25 7 12 7C10.75 7 9.68733 7.43733 8.812 8.312C7.93733 9.18733 7.5 10.25 7.5 11.5C7.5 12.75 7.93733 13.8127 8.812 14.688C9.68733 15.5627 10.75 16 12 16ZM12 14.2C11.25 14.2 10.6127 13.9373 10.088 13.412C9.56267 12.8873 9.3 12.25 9.3 11.5C9.3 10.75 9.56267 10.1123 10.088 9.587C10.6127 9.06233 11.25 8.8 12 8.8C12.75 8.8 13.3877 9.06233 13.913 9.587C14.4377 10.1123 14.7 10.75 14.7 11.5C14.7 12.25 14.4377 12.8873 13.913 13.412C13.3877 13.9373 12.75 14.2 12 14.2V14.2ZM12 19C9.56667 19 7.35 18.3207 5.35 16.962C3.35 15.604 1.9 13.7833 1 11.5C1.9 9.21667 3.35 7.39567 5.35 6.037C7.35 4.679 9.56667 4 12 4C14.4333 4 16.65 4.679 18.65 6.037C20.65 7.39567 22.1 9.21667 23 11.5C22.1 13.7833 20.65 15.604 18.65 16.962C16.65 18.3207 14.4333 19 12 19Z" />
</Icon>
);
import { IconSize } from "./icon-size";

type TIconOnsightProps = {
size: IconSize.small | IconSize.regular;
};

function IconOnsight({ size }: TIconOnsightProps) {
switch (size) {
case IconSize.small:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="20"
height="20"
className="fill-current"
>
<path d="M480-312q70 0 119-49t49-119q0-70-49-119t-119-49q-70 0-119 49t-49 119q0 70 49 119t119 49Zm0-72q-40 0-68-28t-28-68q0-40 28-68t68-28q40 0 68 28t28 68q0 40-28 68t-68 28Zm0 192q-142.596 0-259.798-78.5T48-480q55-131 172.202-209.5T480-768q142.596 0 259.798 78.5T912-480q-55 131-172.202 209.5T480-192Z" />
</svg>
);

case IconSize.regular:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="24"
height="24"
className="fill-current"
>
<path d="M480-320q75 0 127.5-52.5T660-500q0-75-52.5-127.5T480-680q-75 0-127.5 52.5T300-500q0 75 52.5 127.5T480-320Zm0-72q-45 0-76.5-31.5T372-500q0-45 31.5-76.5T480-608q45 0 76.5 31.5T588-500q0 45-31.5 76.5T480-392Zm0 192q-146 0-266-81.5T40-500q54-137 174-218.5T480-800q146 0 266 81.5T920-500q-54 137-174 218.5T480-200Z" />
</svg>
);
}
}

export default IconOnsight;
41 changes: 33 additions & 8 deletions src/components/ui/icons/photo.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,36 @@
import Icon, { IconProps } from "./icon";
import { IconSize } from "./icon-size";

function IconPhoto(props: IconProps) {
return (
<Icon {...props}>
<path d="M12 16.2C13.7674 16.2 15.2 14.7674 15.2 13C15.2 11.2327 13.7674 9.80005 12 9.80005C10.2327 9.80005 8.80005 11.2327 8.80005 13C8.80005 14.7674 10.2327 16.2 12 16.2Z" />
<path d="M9 3L7.17 5H4C2.9 5 2 5.9 2 7V19C2 20.1 2.9 21 4 21H20C21.1 21 22 20.1 22 19V7C22 5.9 21.1 5 20 5H16.83L15 3H9ZM12 18C9.24 18 7 15.76 7 13C7 10.24 9.24 8 12 8C14.76 8 17 10.24 17 13C17 15.76 14.76 18 12 18Z" />
</Icon>
);
type TIconPhotoProps = {
size: IconSize.small | IconSize.regular;
};

function IconPhoto({ size }: TIconPhotoProps) {
switch (size) {
case IconSize.small:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="20"
height="20"
className="fill-current"
>
<path d="M480-264q72 0 120-49t48-119q0-69-48-118.5T480-600q-72 0-120 49.5T312-432q0 70 48 119t120 49Zm0-72q-42 0-69-27t-27-68q0-40 27-68.5t69-28.5q42 0 69 28.5t27 68.5q0 41-27 68t-69 27ZM168-144q-29 0-50.5-21.5T96-216v-432q0-29 21.5-50.5T168-720h120l72-96h240l72 96h120q30 0 51 21.5t21 50.5v432q0 29-21 50.5T792-144H168Z" />
</svg>
);

case IconSize.regular:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="24"
height="24"
className="fill-current"
>
<path d="M480-260q75 0 127.5-52.5T660-440q0-75-52.5-127.5T480-620q-75 0-127.5 52.5T300-440q0 75 52.5 127.5T480-260Zm0-80q-42 0-71-29t-29-71q0-42 29-71t71-29q42 0 71 29t29 71q0 42-29 71t-71 29ZM160-120q-33 0-56.5-23.5T80-200v-480q0-33 23.5-56.5T160-760h126l74-80h240l74 80h126q33 0 56.5 23.5T880-680v480q0 33-23.5 56.5T800-120H160Z" />
</svg>
);
}
}
export default IconPhoto;
40 changes: 33 additions & 7 deletions src/components/ui/icons/red-point.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,36 @@
import Icon, { IconProps } from "./icon";
import { IconSize } from "./icon-size";

function IconRedPoint(props: IconProps) {
return (
<Icon {...props}>
<path d="M12 15C12.8333 15 13.5417 14.7083 14.125 14.125C14.7083 13.5417 15 12.8333 15 12C15 11.1667 14.7083 10.4583 14.125 9.875C13.5417 9.29167 12.8333 9 12 9C11.1667 9 10.4583 9.29167 9.875 9.875C9.29167 10.4583 9 11.1667 9 12C9 12.8333 9.29167 13.5417 9.875 14.125C10.4583 14.7083 11.1667 15 12 15ZM12 22C10.6167 22 9.31667 21.7373 8.1 21.212C6.88333 20.6873 5.825 19.975 4.925 19.075C4.025 18.175 3.31267 17.1167 2.788 15.9C2.26267 14.6833 2 13.3833 2 12C2 10.6167 2.26267 9.31667 2.788 8.1C3.31267 6.88333 4.025 5.825 4.925 4.925C5.825 4.025 6.88333 3.31233 8.1 2.787C9.31667 2.26233 10.6167 2 12 2C13.3833 2 14.6833 2.26233 15.9 2.787C17.1167 3.31233 18.175 4.025 19.075 4.925C19.975 5.825 20.6873 6.88333 21.212 8.1C21.7373 9.31667 22 10.6167 22 12C22 13.3833 21.7373 14.6833 21.212 15.9C20.6873 17.1167 19.975 18.175 19.075 19.075C18.175 19.975 17.1167 20.6873 15.9 21.212C14.6833 21.7373 13.3833 22 12 22ZM12 20C14.2333 20 16.125 19.225 17.675 17.675C19.225 16.125 20 14.2333 20 12C20 9.76667 19.225 7.875 17.675 6.325C16.125 4.775 14.2333 4 12 4C9.76667 4 7.875 4.775 6.325 6.325C4.775 7.875 4 9.76667 4 12C4 14.2333 4.775 16.125 6.325 17.675C7.875 19.225 9.76667 20 12 20Z" />
</Icon>
);
type TIconRedPointProps = {
size: IconSize.small | IconSize.regular;
};

function IconRedPoint({ size }: TIconRedPointProps) {
switch (size) {
case IconSize.small:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="20"
height="20"
className="fill-current"
>
<path d="M480-360q50 0 85-35t35-85q0-50-35-85t-85-35q-50 0-85 35t-35 85q0 50 35 85t85 35Zm.276 264Q401-96 331-126q-70-30-122.5-82.5T126-330.958q-30-69.959-30-149.5Q96-560 126-629.5t82.5-122Q261-804 330.958-834q69.959-30 149.5-30Q560-864 629.5-834t122 82.5Q804-699 834-629.276q30 69.725 30 149Q864-401 834-331q-30 70-82.5 122.5T629.276-126q-69.725 30-149 30ZM480-168q130 0 221-91t91-221q0-130-91-221t-221-91q-130 0-221 91t-91 221q0 130 91 221t221 91Zm0-312Z" />
</svg>
);

case IconSize.regular:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="24"
height="24"
className="fill-current"
>
<path d="M480-360q50 0 85-35t35-85q0-50-35-85t-85-35q-50 0-85 35t-35 85q0 50 35 85t85 35Zm0 280q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z" />
</svg>
);
}
}
export default IconRedPoint;
40 changes: 33 additions & 7 deletions src/components/ui/icons/repeat.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,36 @@
import Icon, { IconProps } from "./icon";
import { IconSize } from "./icon-size";

function IconRepeat(props: IconProps) {
return (
<Icon {...props}>
<path d="M5 16C3.9 16 2.95833 15.6083 2.175 14.825C1.39167 14.0417 1 13.1 1 12C1 10.9 1.39167 9.95833 2.175 9.175C2.95833 8.39167 3.9 8 5 8C6.1 8 7.04167 8.39167 7.825 9.175C8.60833 9.95833 9 10.9 9 12C9 13.1 8.60833 14.0417 7.825 14.825C7.04167 15.6083 6.1 16 5 16ZM17 18C15.3333 18 13.9167 17.4167 12.75 16.25C11.5833 15.0833 11 13.6667 11 12C11 10.3333 11.5833 8.91667 12.75 7.75C13.9167 6.58333 15.3333 6 17 6C18.6667 6 20.0833 6.58333 21.25 7.75C22.4167 8.91667 23 10.3333 23 12C23 13.6667 22.4167 15.0833 21.25 16.25C20.0833 17.4167 18.6667 18 17 18ZM17 16C18.1 16 19.0417 15.6083 19.825 14.825C20.6083 14.0417 21 13.1 21 12C21 10.9 20.6083 9.95833 19.825 9.175C19.0417 8.39167 18.1 8 17 8C15.9 8 14.9583 8.39167 14.175 9.175C13.3917 9.95833 13 10.9 13 12C13 13.1 13.3917 14.0417 14.175 14.825C14.9583 15.6083 15.9 16 17 16Z" />
</Icon>
);
type TIconRepeatProps = {
size: IconSize.small | IconSize.regular;
};

function IconRepeat({ size }: TIconRepeatProps) {
switch (size) {
case IconSize.small:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="20"
height="20"
className="fill-current"
>
<path d="M192-336q-60 0-102-42T48-480q0-60 42-102t102-42q60 0 102 42t42 102q0 60-42 102t-102 42Zm480 96q-100 0-170-70t-70-170q0-100 70-170t170-70q100 0 170 70t70 170q0 100-70 170t-170 70Zm0-72q70 0 119-49t49-119q0-70-49-119t-119-49q-70 0-119 49t-49 119q0 70 49 119t119 49Z" />
</svg>
);

case IconSize.regular:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="24"
height="24"
className="fill-current"
>
<path d="M200-320q-66 0-113-47T40-480q0-66 47-113t113-47q66 0 113 47t47 113q0 66-47 113t-113 47Zm480 80q-100 0-170-70t-70-170q0-100 70-170t170-70q100 0 170 70t70 170q0 100-70 170t-170 70Zm0-80q66 0 113-47t47-113q0-66-47-113t-113-47q-66 0-113 47t-47 113q0 66 47 113t113 47Z" />
</svg>
);
}
}
export default IconRepeat;
21 changes: 21 additions & 0 deletions src/components/ui/icons/reset.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import { IconSize } from "./icon-size";

type TIconResetProps = {
size: IconSize.regular;
};

function IconReset({ size }: TIconResetProps) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960"
width="24"
height="24"
className="fill-current"
>
<path d="M480-160q-134 0-227-93t-93-227q0-134 93-227t227-93q69 0 132 28.5T720-690v-110h80v280H520v-80h168q-32-56-87.5-88T480-720q-100 0-170 70t-70 170q0 100 70 170t170 70q77 0 139-44t87-116h84q-28 106-114 173t-196 67Z" />
</svg>
);
}

export default IconReset;
38 changes: 38 additions & 0 deletions src/components/ui/icons/toprope.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
import { IconSize } from "./icon-size";

type TIconTopropeProps = {
size: IconSize.small | IconSize.regular;
};

function IconToprope({ size }: TIconTopropeProps) {
switch (size) {
case IconSize.small:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
width="20"
height="20"
className="fill-current"
>
<path d="M13.8076 13.5246L12.3812 10.9356H11.9807V13.5246H10.3101V6.66626H13.114C13.6546 6.66626 14.1137 6.7607 14.4915 6.94958C14.8758 7.13846 15.1623 7.39899 15.3512 7.73116C15.5401 8.05681 15.6345 8.42155 15.6345 8.82536C15.6345 9.28128 15.5043 9.68836 15.2438 10.0466C14.9897 10.4048 14.612 10.6588 14.1105 10.8086L15.6932 13.5246H13.8076ZM11.9807 9.75349H13.0163C13.3224 9.75349 13.5503 9.67859 13.7001 9.52878C13.8565 9.37898 13.9346 9.1673 13.9346 8.89375C13.9346 8.63323 13.8565 8.42806 13.7001 8.27826C13.5503 8.12846 13.3224 8.05356 13.0163 8.05356H11.9807V9.75349Z" />
<path d="M9.47158 6.66626V8.00471H7.65441V13.5246H5.98379V8.00471H4.16663V6.66626H9.47158Z" />
</svg>
);

case IconSize.regular:
return (
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
width="24"
height="24"
className="fill-current"
>
<path d="M16.5691 16.23L14.8575 13.1232H14.3768V16.23H12.3721V8H15.7368C16.3855 8 16.9365 8.11333 17.3898 8.33999C17.8509 8.56664 18.1948 8.87927 18.4215 9.27788C18.6481 9.66867 18.7615 10.1063 18.7615 10.5909C18.7615 11.138 18.6051 11.6265 18.2925 12.0564C17.9877 12.4862 17.5344 12.7911 16.9326 12.9708L18.8318 16.23H16.5691ZM14.3768 11.7047H15.6195C15.9869 11.7047 16.2604 11.6148 16.4402 11.435C16.6278 11.2553 16.7215 11.0013 16.7215 10.673C16.7215 10.3604 16.6278 10.1142 16.4402 9.9344C16.2604 9.75464 15.9869 9.66476 15.6195 9.66476H14.3768V11.7047Z" />
<path d="M11.3659 8V9.60614H9.18534V16.23H7.1806V9.60614H5V8H11.3659Z" />
</svg>
);
}
}
export default IconToprope;

0 comments on commit 74a7be5

Please sign in to comment.