Skip to content

Commit f5dff1e

Browse files
nevo-davidnevo-david
committed
feat: svg change
1 parent 37c4574 commit f5dff1e

File tree

12 files changed

+954
-1082
lines changed

12 files changed

+954
-1082
lines changed

‎apps/frontend/src/components/launches/helpers/date.picker.tsx‎

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { Button } from '@gitroom/react/form/button';
66
import { isUSCitizen } from './isuscitizen.utils';
77
import { useT } from '@gitroom/react/translation/get.transation.service.client';
88
import { newDayjs } from '@gitroom/frontend/components/layout/set.timezone';
9+
import { CalendarIcon } from '@gitroom/frontend/components/ui/icons';
910
export const DatePicker: FC<{
1011
date: dayjs.Dayjs;
1112
onChange: (day: dayjs.Dayjs) => void;
@@ -39,21 +40,7 @@ export const DatePicker: FC<{
3940
ref={ref}
4041
>
4142
<div className="cursor-pointer">
42-
<svg
43-
xmlns="http://www.w3.org/2000/svg"
44-
width="17"
45-
height="19"
46-
viewBox="0 0 17 19"
47-
fill="none"
48-
>
49-
<path
50-
d="M15.75 7.41667H0.75M11.5833 0.75V4.08333M4.91667 0.75V4.08333M4.75 17.4167H11.75C13.1501 17.4167 13.8502 17.4167 14.385 17.1442C14.8554 16.9045 15.2378 16.522 15.4775 16.0516C15.75 15.5169 15.75 14.8168 15.75 13.4167V6.41667C15.75 5.01654 15.75 4.31647 15.4775 3.78169C15.2378 3.31129 14.8554 2.92883 14.385 2.68915C13.8502 2.41667 13.1501 2.41667 11.75 2.41667H4.75C3.34987 2.41667 2.6498 2.41667 2.11502 2.68915C1.64462 2.92883 1.26217 3.31129 1.02248 3.78169C0.75 4.31647 0.75 5.01654 0.75 6.41667V13.4167C0.75 14.8168 0.75 15.5169 1.02248 16.0516C1.26217 16.522 1.64462 16.9045 2.11502 17.1442C2.6498 17.4167 3.34987 17.4167 4.75 17.4167Z"
51-
stroke="currentColor"
52-
strokeWidth="1.5"
53-
strokeLinecap="round"
54-
strokeLinejoin="round"
55-
/>
56-
</svg>
43+
<CalendarIcon />
5744
</div>
5845
<div className="cursor-pointer">
5946
{date.format(isUSCitizen() ? 'MM/DD/YYYY hh:mm A' : 'DD/MM/YYYY HH:mm')}

‎apps/frontend/src/components/launches/helpers/top.title.component.tsx‎

Lines changed: 3 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { FC, ReactNode } from 'react';
22
import { useT } from '@gitroom/react/translation/get.transation.service.client';
33
import clsx from 'clsx';
4+
import { ExpandIcon, CollapseIcon } from '@gitroom/frontend/components/ui/icons';
45

56
export const TopTitle: FC<{
67
title: string;
@@ -44,33 +45,9 @@ export const TopTitle: FC<{
4445
{shouldExpend !== undefined && (
4546
<div className="cursor-pointer">
4647
{!shouldExpend ? (
47-
<svg
48-
xmlns="http://www.w3.org/2000/svg"
49-
width="24"
50-
height="25"
51-
onClick={expend}
52-
viewBox="0 0 24 25"
53-
fill="none"
54-
>
55-
<path
56-
d="M20.25 5V9.5C20.25 9.69891 20.171 9.88968 20.0303 10.0303C19.8897 10.171 19.6989 10.25 19.5 10.25C19.3011 10.25 19.1103 10.171 18.9697 10.0303C18.829 9.88968 18.75 9.69891 18.75 9.5V6.81031L14.0306 11.5306C13.8899 11.6714 13.699 11.7504 13.5 11.7504C13.301 11.7504 13.1101 11.6714 12.9694 11.5306C12.8286 11.3899 12.7496 11.199 12.7496 11C12.7496 10.801 12.8286 10.6101 12.9694 10.4694L17.6897 5.75H15C14.8011 5.75 14.6103 5.67098 14.4697 5.53033C14.329 5.38968 14.25 5.19891 14.25 5C14.25 4.80109 14.329 4.61032 14.4697 4.46967C14.6103 4.32902 14.8011 4.25 15 4.25H19.5C19.6989 4.25 19.8897 4.32902 20.0303 4.46967C20.171 4.61032 20.25 4.80109 20.25 5ZM9.96937 13.4694L5.25 18.1897V15.5C5.25 15.3011 5.17098 15.1103 5.03033 14.9697C4.88968 14.829 4.69891 14.75 4.5 14.75C4.30109 14.75 4.11032 14.829 3.96967 14.9697C3.82902 15.1103 3.75 15.3011 3.75 15.5V20C3.75 20.1989 3.82902 20.3897 3.96967 20.5303C4.11032 20.671 4.30109 20.75 4.5 20.75H9C9.19891 20.75 9.38968 20.671 9.53033 20.5303C9.67098 20.3897 9.75 20.1989 9.75 20C9.75 19.8011 9.67098 19.6103 9.53033 19.4697C9.38968 19.329 9.19891 19.25 9 19.25H6.31031L11.0306 14.5306C11.1714 14.3899 11.2504 14.199 11.2504 14C11.2504 13.801 11.1714 13.6101 11.0306 13.4694C10.8899 13.3286 10.699 13.2496 10.5 13.2496C10.301 13.2496 10.1101 13.3286 9.96937 13.4694Z"
57-
fill="white"
58-
/>
59-
</svg>
48+
<ExpandIcon onClick={expend} className="text-white" />
6049
) : (
61-
<svg
62-
xmlns="http://www.w3.org/2000/svg"
63-
width="24"
64-
height="25"
65-
onClick={collapse}
66-
viewBox="0 0 24 25"
67-
fill="none"
68-
>
69-
<path
70-
d="M13.5004 10.2499V6.49993C13.5004 6.30102 13.5794 6.11025 13.7201 5.9696C13.8607 5.82895 14.0515 5.74993 14.2504 5.74993C14.4493 5.74993 14.6401 5.82895 14.7807 5.9696C14.9214 6.11025 15.0004 6.30102 15.0004 6.49993V8.43962L18.9698 4.4693C19.1105 4.32857 19.3014 4.24951 19.5004 4.24951C19.6994 4.24951 19.8903 4.32857 20.031 4.4693C20.1718 4.61003 20.2508 4.80091 20.2508 4.99993C20.2508 5.19895 20.1718 5.38982 20.031 5.53055L16.0607 9.49993H18.0004C18.1993 9.49993 18.3901 9.57895 18.5307 9.7196C18.6714 9.86025 18.7504 10.051 18.7504 10.2499C18.7504 10.4488 18.6714 10.6396 18.5307 10.7803C18.3901 10.9209 18.1993 10.9999 18.0004 10.9999H14.2504C14.0515 10.9999 13.8607 10.9209 13.7201 10.7803C13.5794 10.6396 13.5004 10.4488 13.5004 10.2499ZM9.75042 13.9999H6.00042C5.8015 13.9999 5.61074 14.0789 5.47009 14.2196C5.32943 14.3603 5.25042 14.551 5.25042 14.7499C5.25042 14.9488 5.32943 15.1396 5.47009 15.2803C5.61074 15.4209 5.8015 15.4999 6.00042 15.4999H7.9401L3.96979 19.4693C3.82906 19.61 3.75 19.8009 3.75 19.9999C3.75 20.199 3.82906 20.3898 3.96979 20.5306C4.11052 20.6713 4.30139 20.7503 4.50042 20.7503C4.69944 20.7503 4.89031 20.6713 5.03104 20.5306L9.00042 16.5602V18.4999C9.00042 18.6988 9.07943 18.8896 9.22009 19.0303C9.36074 19.1709 9.5515 19.2499 9.75042 19.2499C9.94933 19.2499 10.1401 19.1709 10.2807 19.0303C10.4214 18.8896 10.5004 18.6988 10.5004 18.4999V14.7499C10.5004 14.551 10.4214 14.3603 10.2807 14.2196C10.1401 14.0789 9.94933 13.9999 9.75042 13.9999ZM16.0607 15.4999H18.0004C18.1993 15.4999 18.3901 15.4209 18.5307 15.2803C18.6714 15.1396 18.7504 14.9488 18.7504 14.7499C18.7504 14.551 18.6714 14.3603 18.5307 14.2196C18.3901 14.0789 18.1993 13.9999 18.0004 13.9999H14.2504C14.0515 13.9999 13.8607 14.0789 13.7201 14.2196C13.5794 14.3603 13.5004 14.551 13.5004 14.7499V18.4999C13.5004 18.6988 13.5794 18.8896 13.7201 19.0303C13.8607 19.1709 14.0515 19.2499 14.2504 19.2499C14.4493 19.2499 14.6401 19.1709 14.7807 19.0303C14.9214 18.8896 15.0004 18.6988 15.0004 18.4999V16.5602L18.9698 20.5306C19.0395 20.6002 19.1222 20.6555 19.2132 20.6932C19.3043 20.7309 19.4019 20.7503 19.5004 20.7503C19.599 20.7503 19.6965 20.7309 19.7876 20.6932C19.8786 20.6555 19.9614 20.6002 20.031 20.5306C20.1007 20.4609 20.156 20.3781 20.1937 20.2871C20.2314 20.1961 20.2508 20.0985 20.2508 19.9999C20.2508 19.9014 20.2314 19.8038 20.1937 19.7128C20.156 19.6217 20.1007 19.539 20.031 19.4693L16.0607 15.4999ZM9.75042 5.74993C9.5515 5.74993 9.36074 5.82895 9.22009 5.9696C9.07943 6.11025 9.00042 6.30102 9.00042 6.49993V8.43962L5.03104 4.4693C4.89031 4.32857 4.69944 4.24951 4.50042 4.24951C4.30139 4.24951 4.11052 4.32857 3.96979 4.4693C3.82906 4.61003 3.75 4.80091 3.75 4.99993C3.75 5.19895 3.82906 5.38982 3.96979 5.53055L7.9401 9.49993H6.00042C5.8015 9.49993 5.61074 9.57895 5.47009 9.7196C5.32943 9.86025 5.25042 10.051 5.25042 10.2499C5.25042 10.4488 5.32943 10.6396 5.47009 10.7803C5.61074 10.9209 5.8015 10.9999 6.00042 10.9999H9.75042C9.94933 10.9999 10.1401 10.9209 10.2807 10.7803C10.4214 10.6396 10.5004 10.4488 10.5004 10.2499V6.49993C10.5004 6.30102 10.4214 6.11025 10.2807 5.9696C10.1401 5.82895 9.94933 5.74993 9.75042 5.74993Z"
71-
fill="white"
72-
/>
73-
</svg>
50+
<CollapseIcon onClick={collapse} className="text-white" />
7451
)}
7552
</div>
7653
)}

‎apps/frontend/src/components/launches/repeat.component.tsx‎

Lines changed: 3 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { useT } from '@gitroom/react/translation/get.transation.service.client';
44
import { useClickOutside } from '@mantine/hooks';
55
import { isUSCitizen } from '@gitroom/frontend/components/launches/helpers/isuscitizen.utils';
66
import clsx from 'clsx';
7+
import { RepeatIcon, DropdownArrowIcon } from '@gitroom/frontend/components/ui/icons';
78
const list = [
89
{
910
value: 1,
@@ -81,48 +82,15 @@ export const RepeatComponent: FC<{
8182
className="px-[16px] justify-center flex gap-[8px] items-center h-full select-none flex-1"
8283
>
8384
<div className="cursor-pointer">
84-
<svg
85-
xmlns="http://www.w3.org/2000/svg"
86-
width="20"
87-
height="20"
88-
viewBox="0 0 20 20"
89-
fill="none"
90-
>
91-
<g clip-path="url(#clip0_2403_67385)">
92-
<path
93-
d="M14.1667 1.66602L17.5 4.99935M17.5 4.99935L14.1667 8.33268M17.5 4.99935H6.5C5.09987 4.99935 4.3998 4.99935 3.86502 5.27183C3.39462 5.51152 3.01217 5.89397 2.77248 6.36437C2.5 6.89915 2.5 7.59922 2.5 8.99935V9.16602M2.5 14.9993H13.5C14.9001 14.9993 15.6002 14.9993 16.135 14.7269C16.6054 14.4872 16.9878 14.1047 17.2275 13.6343C17.5 13.0995 17.5 12.3995 17.5 10.9993V10.8327M2.5 14.9993L5.83333 18.3327M2.5 14.9993L5.83333 11.666"
94-
stroke="currentColor"
95-
strokeWidth="1.5"
96-
strokeLinecap="round"
97-
strokeLinejoin="round"
98-
/>
99-
</g>
100-
<defs>
101-
<clipPath id="clip0_2403_67385">
102-
<rect width="20" height="20" fill="currentColor" />
103-
</clipPath>
104-
</defs>
105-
</svg>
85+
<RepeatIcon />
10686
</div>
10787
<div className="cursor-pointer">
10888
{repeat
10989
? `Repeat Post Every ${everyLabel}`
11090
: t('repeat_post_every', 'Repeat Post Every...')}
11191
</div>
11292
<div className="cursor-pointer">
113-
<svg
114-
xmlns="http://www.w3.org/2000/svg"
115-
width="20"
116-
height="20"
117-
viewBox="0 0 20 20"
118-
fill="none"
119-
className={isOpen ? 'rotate-180' : ''}
120-
>
121-
<path
122-
d="M7.4563 8L12.5437 8C12.9494 8 13.1526 8.56798 12.8657 8.90016L10.322 11.8456C10.1442 12.0515 9.85583 12.0515 9.67799 11.8456L7.13429 8.90016C6.84741 8.56798 7.05059 8 7.4563 8Z"
123-
fill="currentColor"
124-
/>
125-
</svg>
93+
<DropdownArrowIcon rotated={isOpen} />
12694
</div>
12795
</div>
12896
{isOpen && (

‎apps/frontend/src/components/launches/select.customer.tsx‎

Lines changed: 3 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { useClickOutside } from '@mantine/hooks';
77
import { useToaster } from '@gitroom/react/toaster/toaster';
88
import { useLaunchStore } from '@gitroom/frontend/components/new-launch/store';
99
import { useShallow } from 'zustand/react/shallow';
10+
import { UserIcon, DropdownArrowIcon } from '@gitroom/frontend/components/ui/icons';
1011

1112
export const SelectCustomer: FC<{
1213
onChange: (value: string) => void;
@@ -60,36 +61,10 @@ export const SelectCustomer: FC<{
6061
)}
6162
>
6263
<div>
63-
<svg
64-
xmlns="http://www.w3.org/2000/svg"
65-
width="20"
66-
height="20"
67-
viewBox="0 0 20 20"
68-
fill="none"
69-
>
70-
<path
71-
d="M16.6673 17.5C16.6673 16.337 16.6673 15.7555 16.5238 15.2824C16.2006 14.217 15.3669 13.3834 14.3016 13.0602C13.8284 12.9167 13.247 12.9167 12.084 12.9167H7.91732C6.75435 12.9167 6.17286 12.9167 5.6997 13.0602C4.63436 13.3834 3.80068 14.217 3.47752 15.2824C3.33398 15.7555 3.33398 16.337 3.33398 17.5M13.7507 6.25C13.7507 8.32107 12.0717 10 10.0007 10C7.92958 10 6.25065 8.32107 6.25065 6.25C6.25065 4.17893 7.92958 2.5 10.0007 2.5C12.0717 2.5 13.7507 4.17893 13.7507 6.25Z"
72-
stroke="currentColor"
73-
strokeWidth="1.5"
74-
strokeLinecap="round"
75-
strokeLinejoin="round"
76-
/>
77-
</svg>
64+
<UserIcon />
7865
</div>
7966
<div>
80-
<svg
81-
className={clsx(open && 'rotate-180')}
82-
xmlns="http://www.w3.org/2000/svg"
83-
width="20"
84-
height="20"
85-
viewBox="0 0 20 20"
86-
fill="none"
87-
>
88-
<path
89-
d="M12.5437 8L7.4563 8C7.05059 8 6.84741 8.56798 7.13429 8.90016L9.67799 11.8456C9.85583 12.0515 10.1442 12.0515 10.322 11.8456L12.8657 8.90016C13.1526 8.56798 12.9494 8 12.5437 8Z"
90-
fill="currentColor"
91-
/>
92-
</svg>
67+
<DropdownArrowIcon rotated={open} />
9368
</div>
9469
</div>
9570
{open && (

‎apps/frontend/src/components/launches/tags.component.tsx‎

Lines changed: 5 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ import { useT } from '@gitroom/react/translation/get.transation.service.client';
1111
import { useClickOutside } from '@mantine/hooks';
1212
import clsx from 'clsx';
1313
import { useModals } from '@gitroom/frontend/components/layout/new-modal';
14+
import { TagIcon, DropdownArrowIcon, PlusIcon, CheckmarkIcon } from '@gitroom/frontend/components/ui/icons';
1415

1516
export const TagsComponent: FC<{
1617
name: string;
@@ -109,21 +110,7 @@ export const TagsComponentInner: FC<{
109110
className="px-[16px] justify-center flex gap-[8px] items-center h-full select-none flex-1"
110111
>
111112
<div className="cursor-pointer">
112-
<svg
113-
xmlns="http://www.w3.org/2000/svg"
114-
width="17"
115-
height="19"
116-
viewBox="0 0 17 19"
117-
fill="none"
118-
>
119-
<path
120-
d="M15.75 8.25L9.42157 1.92157C8.98919 1.48919 8.773 1.273 8.52071 1.1184C8.29703 0.981328 8.05317 0.880317 7.79808 0.819075C7.51036 0.75 7.20462 0.75 6.59314 0.75L3.25 0.75M0.75 6.33333L0.75 7.97876C0.75 8.38641 0.75 8.59024 0.79605 8.78205C0.836878 8.95211 0.904218 9.11469 0.9956 9.26381C1.09867 9.432 1.2428 9.57613 1.53105 9.86438L8.03105 16.3644C8.69108 17.0244 9.02109 17.3544 9.40164 17.4781C9.73638 17.5868 10.097 17.5868 10.4317 17.4781C10.8122 17.3544 11.1423 17.0244 11.8023 16.3644L13.8644 14.3023C14.5244 13.6423 14.8544 13.3122 14.9781 12.9317C15.0868 12.597 15.0868 12.2364 14.9781 11.9016C14.8544 11.5211 14.5244 11.1911 13.8644 10.531L7.78105 4.44772C7.4928 4.15946 7.34867 4.01534 7.18048 3.91227C7.03135 3.82089 6.86878 3.75354 6.69872 3.71272C6.50691 3.66667 6.30308 3.66667 5.89543 3.66667H3.41667C2.48325 3.66667 2.01654 3.66667 1.66002 3.84832C1.34641 4.00811 1.09145 4.26308 0.931656 4.57668C0.75 4.9332 0.75 5.39991 0.75 6.33333Z"
121-
stroke="currentColor"
122-
strokeWidth="1.5"
123-
strokeLinecap="round"
124-
strokeLinejoin="round"
125-
/>
126-
</svg>
113+
<TagIcon />
127114
</div>
128115
<div className="cursor-pointer flex gap-[4px]">
129116
{tagValue.length === 0 ? (
@@ -143,19 +130,7 @@ export const TagsComponentInner: FC<{
143130
)}
144131
</div>
145132
<div className="cursor-pointer">
146-
<svg
147-
xmlns="http://www.w3.org/2000/svg"
148-
width="20"
149-
height="20"
150-
viewBox="0 0 20 20"
151-
fill="none"
152-
className={isOpen ? 'rotate-180' : ''}
153-
>
154-
<path
155-
d="M7.4563 8L12.5437 8C12.9494 8 13.1526 8.56798 12.8657 8.90016L10.322 11.8456C10.1442 12.0515 9.85583 12.0515 9.67799 11.8456L7.13429 8.90016C6.84741 8.56798 7.05059 8 7.4563 8Z"
156-
fill="currentColor"
157-
/>
158-
</svg>
133+
<DropdownArrowIcon rotated={isOpen} />
159134
</div>
160135
</div>
161136
{isOpen && (
@@ -203,21 +178,7 @@ export const TagsComponentInner: FC<{
203178
className="cursor-pointer gap-[8px] flex w-full h-[34px] rounded-[8px] mt-[12px] px-[16px] justify-center items-center bg-[#612BD3] text-white"
204179
>
205180
<div>
206-
<svg
207-
xmlns="http://www.w3.org/2000/svg"
208-
width="16"
209-
height="16"
210-
viewBox="0 0 16 16"
211-
fill="none"
212-
>
213-
<path
214-
d="M8.00065 3.33301V12.6663M3.33398 7.99967H12.6673"
215-
stroke="currentColor"
216-
strokeWidth="1.5"
217-
strokeLinecap="round"
218-
strokeLinejoin="round"
219-
/>
220-
</svg>
181+
<PlusIcon />
221182
</div>
222183
<div className="text-[13px] font-[600]">Add New Tag</div>
223184
</div>
@@ -239,24 +200,7 @@ const Check: FC<{ value: boolean; onChange: (value: boolean) => void }> = ({
239200
value && 'bg-[#612BD3]'
240201
)}
241202
>
242-
{value ? (
243-
<svg
244-
xmlns="http://www.w3.org/2000/svg"
245-
width="11"
246-
height="8"
247-
viewBox="0 0 11 8"
248-
fill="none"
249-
>
250-
<path
251-
fillRule="evenodd"
252-
clipRule="evenodd"
253-
d="M10.7071 0.292893C11.0976 0.683417 11.0976 1.31658 10.7071 1.70711L4.70711 7.70711C4.31658 8.09763 3.68342 8.09763 3.29289 7.70711L0.292893 4.70711C-0.0976311 4.31658 -0.0976311 3.68342 0.292893 3.29289C0.683417 2.90237 1.31658 2.90237 1.70711 3.29289L4 5.58579L9.29289 0.292893C9.68342 -0.0976311 10.3166 -0.0976311 10.7071 0.292893Z"
254-
fill="white"
255-
/>
256-
</svg>
257-
) : (
258-
''
259-
)}
203+
{value ? <CheckmarkIcon className="text-white" /> : ''}
260204
</div>
261205
);
262206
};

‎apps/frontend/src/components/launches/up.down.arrow.tsx‎

Lines changed: 4 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,17 @@
11
import { FC, useCallback } from 'react';
22
import clsx from 'clsx';
3+
import { ChevronUpIcon } from '@gitroom/frontend/components/ui/icons';
4+
35
const Arrow: FC<{
46
flip: boolean;
57
}> = (props) => {
68
const { flip } = props;
79
return (
8-
<svg
9-
xmlns="http://www.w3.org/2000/svg"
10-
width="20"
11-
height="20"
12-
viewBox="0 0 20 20"
13-
fill="none"
10+
<ChevronUpIcon
1411
style={{
1512
transform: !flip ? 'rotate(180deg)' : '',
1613
}}
17-
>
18-
<path
19-
d="M15 12.5L10 7.5L5 12.5"
20-
stroke="currentColor"
21-
strokeWidth="1.5"
22-
strokeLinecap="round"
23-
strokeLinejoin="round"
24-
/>
25-
</svg>
14+
/>
2615
);
2716
};
2817
export const UpDownArrow: FC<{

0 commit comments

Comments
 (0)