@edu-tosel/design 1.0.48 → 1.0.49
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +42 -42
- package/asset/SVG.tsx +27 -27
- package/asset/svg/Close.tsx +32 -32
- package/asset/svg/Direction.tsx +36 -36
- package/asset/svg/Email.tsx +20 -20
- package/asset/svg/Icon.tsx +186 -186
- package/asset/svg/Image.tsx +24 -24
- package/asset/svg/Notification.tsx +34 -34
- package/asset/svg/Operation.tsx +66 -66
- package/asset/svg/Phone.tsx +20 -20
- package/asset/svg/Profile.tsx +27 -27
- package/asset/svg/Symbol.tsx +60 -60
- package/asset/svg/TOSEL.tsx +63 -63
- package/globals.css +226 -226
- package/layout/template/home/Navigation.js +3 -2
- package/package.json +1 -1
- package/tailwind.config.ts +618 -618
- package/version.txt +1 -1
package/asset/svg/Icon.tsx
CHANGED
|
@@ -1,186 +1,186 @@
|
|
|
1
|
-
import { OnClick } from "../../interface";
|
|
2
|
-
import { cn } from "../../util";
|
|
3
|
-
|
|
4
|
-
export interface IconProps {
|
|
5
|
-
onClick: OnClick;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
const Icon = {
|
|
9
|
-
Calendar,
|
|
10
|
-
Notification,
|
|
11
|
-
Search,
|
|
12
|
-
Browser,
|
|
13
|
-
Gift,
|
|
14
|
-
};
|
|
15
|
-
|
|
16
|
-
export default Icon;
|
|
17
|
-
|
|
18
|
-
function Calendar() {
|
|
19
|
-
return (
|
|
20
|
-
<svg
|
|
21
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
22
|
-
width="35"
|
|
23
|
-
height="35"
|
|
24
|
-
viewBox="0 0 35 35"
|
|
25
|
-
fill="none"
|
|
26
|
-
>
|
|
27
|
-
<path
|
|
28
|
-
d="M25.1064 33.8412C20.0919 33.8412 15.9928 29.7599 15.9928 24.723C15.9928 19.686 20.072 15.6047 25.1064 15.6047C30.1408 15.6047 34.2201 19.686 34.2201 24.723C34.2201 29.7599 30.1408 33.8412 25.1064 33.8412ZM25.1064 16.6001C20.6292 16.6001 16.9877 20.2435 16.9877 24.723C16.9877 29.2025 20.6292 32.8458 25.1064 32.8458C29.5837 32.8458 33.2251 29.2025 33.2251 24.723C33.2251 20.2435 29.5837 16.6001 25.1064 16.6001Z"
|
|
29
|
-
fill="white"
|
|
30
|
-
/>
|
|
31
|
-
<path
|
|
32
|
-
d="M29.2454 29.3019C29.126 29.3019 28.9867 29.2621 28.8872 29.1626L24.8279 25.1012C24.8279 25.1012 24.6886 24.8822 24.6886 24.7428V20.0642C24.6886 19.7855 24.9075 19.5665 25.1861 19.5665C25.4647 19.5665 25.6835 19.7855 25.6835 20.0642V24.5437L29.6036 28.4658C29.8026 28.6648 29.8026 28.9834 29.6036 29.1626C29.5041 29.2621 29.3847 29.3019 29.2454 29.3019Z"
|
|
33
|
-
fill="white"
|
|
34
|
-
/>
|
|
35
|
-
<path
|
|
36
|
-
d="M20.6491 5.11266H8.57059C8.29201 5.11266 8.07312 4.89366 8.07312 4.61493C8.07312 4.33621 8.29201 4.11721 8.57059 4.11721H20.6491C20.9277 4.11721 21.1466 4.33621 21.1466 4.61493C21.1466 4.89366 20.9277 5.11266 20.6491 5.11266Z"
|
|
37
|
-
fill="white"
|
|
38
|
-
/>
|
|
39
|
-
<path
|
|
40
|
-
d="M28.6286 11.2446H0.611116C0.332534 11.2446 0.113647 11.0256 0.113647 10.7469V4.61493C0.113647 4.33621 0.332534 4.11721 0.611116 4.11721H5.06844C5.34702 4.11721 5.56591 4.33621 5.56591 4.61493C5.56591 4.89366 5.34702 5.11266 5.06844 5.11266H1.10859V10.2492H28.1311V5.11266H24.1712C23.8927 5.11266 23.6738 4.89366 23.6738 4.61493C23.6738 4.33621 23.8927 4.11721 24.1712 4.11721H28.6286C28.9072 4.11721 29.126 4.33621 29.126 4.61493V10.7469C29.126 11.0256 28.9072 11.2446 28.6286 11.2446Z"
|
|
41
|
-
fill="white"
|
|
42
|
-
/>
|
|
43
|
-
<path
|
|
44
|
-
d="M16.4902 26.5944H2.00394C1.72536 26.5944 1.50647 26.3754 1.50647 26.0967V10.747C1.50647 10.4682 1.72536 10.2492 2.00394 10.2492H27.2157C27.4942 10.2492 27.7131 10.4682 27.7131 10.747V16.3812C27.7131 16.6599 27.4942 16.8789 27.2157 16.8789C26.9371 16.8789 26.7182 16.6599 26.7182 16.3812V11.2447H2.50141V25.599H16.4902C16.7688 25.599 16.9877 25.818 16.9877 26.0967C16.9877 26.3754 16.7688 26.5944 16.4902 26.5944Z"
|
|
45
|
-
fill="white"
|
|
46
|
-
/>
|
|
47
|
-
<path
|
|
48
|
-
d="M24.1514 8.17859H20.6492C20.3706 8.17859 20.1517 7.95959 20.1517 7.68086V1.54892C20.1517 1.2702 20.3706 1.0512 20.6492 1.0512H24.1514C24.43 1.0512 24.6489 1.2702 24.6489 1.54892V7.68086C24.6489 7.95959 24.43 8.17859 24.1514 8.17859ZM21.1467 7.18314H23.6539V2.04665H21.1467V7.18314Z"
|
|
49
|
-
fill="white"
|
|
50
|
-
/>
|
|
51
|
-
<path
|
|
52
|
-
d="M8.57057 8.17859H5.06839C4.78981 8.17859 4.57092 7.95959 4.57092 7.68086V1.54892C4.57092 1.2702 4.78981 1.0512 5.06839 1.0512H8.57057C8.84916 1.0512 9.06804 1.2702 9.06804 1.54892V7.68086C9.06804 7.95959 8.84916 8.17859 8.57057 8.17859ZM5.56586 7.18314H8.0731V2.04665H5.56586V7.18314Z"
|
|
53
|
-
fill="white"
|
|
54
|
-
/>
|
|
55
|
-
</svg>
|
|
56
|
-
);
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
function Notification() {
|
|
60
|
-
return (
|
|
61
|
-
<svg
|
|
62
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
63
|
-
width="35"
|
|
64
|
-
height="35"
|
|
65
|
-
viewBox="0 0 35 35"
|
|
66
|
-
fill="none"
|
|
67
|
-
>
|
|
68
|
-
<path
|
|
69
|
-
d="M25.4008 28.4473H8.58633C7.92967 28.4473 7.3128 28.1088 6.97452 27.5514C6.63624 26.9939 6.59645 26.2971 6.89493 25.6998C8.42713 22.6737 9.22309 19.2693 9.22309 15.8847V15.6458C9.22309 13.5355 10.0389 11.5844 11.5512 10.1112C13.0436 8.63791 15.0335 7.86146 17.1428 7.88137C21.3414 7.96101 24.764 11.5446 24.764 15.8847C24.764 19.2693 25.5799 22.6737 27.0922 25.6998C27.3906 26.2971 27.3708 26.9939 27.0126 27.5514C26.6544 28.1088 26.0574 28.4473 25.4008 28.4473ZM17.0035 8.85691C15.2126 8.85691 13.5411 9.53381 12.2676 10.7881C10.9543 12.0821 10.2379 13.7943 10.2379 15.6259V15.8648C10.2379 19.4086 9.40217 22.9723 7.79037 26.1378C7.65108 26.4166 7.65108 26.755 7.83017 27.0138C7.98936 27.2925 8.28784 27.4518 8.60622 27.4518H25.4207C25.7391 27.4518 26.0176 27.2925 26.1967 27.0138C26.3559 26.7351 26.3758 26.4166 26.2365 26.1378C24.6446 22.9723 23.789 19.4086 23.789 15.8648C23.789 12.0622 20.8042 8.91663 17.1428 8.85691C17.103 8.85691 17.0632 8.85691 17.0234 8.85691H17.0035Z"
|
|
70
|
-
fill="white"
|
|
71
|
-
/>
|
|
72
|
-
<path
|
|
73
|
-
d="M17.0035 32.0704C15.1927 32.0704 13.7401 30.5971 13.7401 28.8053V27.9493C13.7401 27.6705 13.959 27.4515 14.2376 27.4515C14.5162 27.4515 14.7351 27.6705 14.7351 27.9493V28.8053C14.7351 30.0596 15.7499 31.075 17.0035 31.075C18.2571 31.075 19.272 30.0596 19.272 28.8053V27.9493C19.272 27.6705 19.4909 27.4515 19.7694 27.4515C20.048 27.4515 20.2669 27.6705 20.2669 27.9493V28.8053C20.2669 30.6171 18.7944 32.0704 17.0035 32.0704Z"
|
|
74
|
-
fill="white"
|
|
75
|
-
/>
|
|
76
|
-
<path
|
|
77
|
-
d="M17.0035 8.85671C15.4514 8.85671 14.1978 7.60245 14.1978 6.04956C14.1978 4.49666 15.4514 3.2424 17.0035 3.2424C18.5556 3.2424 19.8092 4.49666 19.8092 6.04956C19.8092 7.60245 18.5556 8.85671 17.0035 8.85671ZM17.0035 4.23785C16.0085 4.23785 15.1927 5.05411 15.1927 6.04956C15.1927 7.045 16.0085 7.86127 17.0035 7.86127C17.9984 7.86127 18.8143 7.045 18.8143 6.04956C18.8143 5.05411 17.9984 4.23785 17.0035 4.23785Z"
|
|
78
|
-
fill="white"
|
|
79
|
-
/>
|
|
80
|
-
</svg>
|
|
81
|
-
);
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
function Search() {
|
|
85
|
-
return (
|
|
86
|
-
<svg
|
|
87
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
88
|
-
width="35"
|
|
89
|
-
height="36"
|
|
90
|
-
viewBox="0 0 35 36"
|
|
91
|
-
fill="none"
|
|
92
|
-
>
|
|
93
|
-
<path
|
|
94
|
-
d="M28.9758 32.4908C28.4983 32.4908 28.0008 32.3116 27.6426 31.9334L19.1658 23.4522C18.8673 23.1535 18.8673 22.6757 19.1658 22.3771L21.673 19.8686C21.9715 19.5699 22.449 19.5699 22.7475 19.8686L31.2244 28.3498C31.9607 29.0864 31.9607 30.3008 31.2244 31.0375L30.3091 31.9533C29.931 32.3315 29.4534 32.5107 28.9758 32.5107V32.4908ZM20.0214 22.9146L28.3391 31.2365C28.6973 31.5949 29.2743 31.5949 29.6126 31.2365L30.5279 30.3207C30.8861 29.9624 30.8861 29.385 30.5279 29.0466L22.2103 20.7246L20.0214 22.9146Z"
|
|
95
|
-
fill="white"
|
|
96
|
-
/>
|
|
97
|
-
<path
|
|
98
|
-
d="M19.8424 22.8748C19.723 22.8748 19.5837 22.835 19.4842 22.7355L17.7132 20.9636C17.5142 20.7645 17.5142 20.446 17.7132 20.2668C17.9122 20.0876 18.2306 20.0677 18.4097 20.2668L19.8225 21.6803L20.9567 20.5455L19.5439 19.132C19.3449 18.9329 19.3449 18.6143 19.5439 18.4352C19.7429 18.256 20.0613 18.2361 20.2403 18.4352L22.0113 20.2071C22.0113 20.2071 22.1506 20.4261 22.1506 20.5654C22.1506 20.7048 22.0909 20.8242 22.0113 20.9238L20.1807 22.7554C20.1807 22.7554 19.9618 22.8948 19.8225 22.8948L19.8424 22.8748Z"
|
|
99
|
-
fill="white"
|
|
100
|
-
/>
|
|
101
|
-
<path
|
|
102
|
-
d="M12.241 23.0939C9.63424 23.0939 7.04741 22.0984 5.05754 20.1274C1.09768 16.1656 1.09768 9.73499 5.05754 5.77312C9.01739 1.81124 15.4447 1.81124 19.4045 5.77312C23.3644 9.73499 23.3644 16.1656 19.4045 20.1274C17.4346 22.0984 14.8278 23.0939 12.2211 23.0939H12.241ZM12.241 3.78223C9.89293 3.78223 7.54487 4.67813 5.77389 6.46993C2.21201 10.0336 2.21201 15.847 5.77389 19.4306C9.33576 22.9943 15.1462 22.9943 18.728 19.4306C22.2899 15.8669 22.2899 10.0535 18.728 6.46993C16.9371 4.67813 14.589 3.78223 12.2609 3.78223H12.241Z"
|
|
103
|
-
fill="white"
|
|
104
|
-
/>
|
|
105
|
-
</svg>
|
|
106
|
-
);
|
|
107
|
-
}
|
|
108
|
-
|
|
109
|
-
function Browser({ onClick }: IconProps) {
|
|
110
|
-
const container = {
|
|
111
|
-
cursor: "cursor-pointer",
|
|
112
|
-
};
|
|
113
|
-
return (
|
|
114
|
-
<svg
|
|
115
|
-
className={cn(container)}
|
|
116
|
-
onClick={onClick}
|
|
117
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
118
|
-
width="35"
|
|
119
|
-
height="35"
|
|
120
|
-
viewBox="0 0 35 35"
|
|
121
|
-
fill="none"
|
|
122
|
-
>
|
|
123
|
-
<path
|
|
124
|
-
d="M29.0718 28.5227H5.31267C3.89986 28.5227 2.74573 27.368 2.74573 25.9544V7.87715C2.74573 6.46362 3.89986 5.3089 5.31267 5.3089H29.0718C30.4846 5.3089 31.6387 6.46362 31.6387 7.87715V25.9544C31.6387 27.368 30.4846 28.5227 29.0718 28.5227ZM5.31267 6.30434C4.43712 6.30434 3.74067 7.00116 3.74067 7.87715V25.9544C3.74067 26.8304 4.43712 27.5272 5.31267 27.5272H29.0718C29.9473 27.5272 30.6438 26.8304 30.6438 25.9544V7.87715C30.6438 7.00116 29.9473 6.30434 29.0718 6.30434H5.31267Z"
|
|
125
|
-
fill="white"
|
|
126
|
-
/>
|
|
127
|
-
<path
|
|
128
|
-
d="M31.1413 10.4056H3.2432C2.96461 10.4056 2.74573 10.1866 2.74573 9.90788C2.74573 9.62915 2.96461 9.41016 3.2432 9.41016H31.1413C31.4198 9.41016 31.6387 9.62915 31.6387 9.90788C31.6387 10.1866 31.4198 10.4056 31.1413 10.4056Z"
|
|
129
|
-
fill="white"
|
|
130
|
-
/>
|
|
131
|
-
<path
|
|
132
|
-
d="M28.7932 8.43452C28.7932 8.43452 28.7335 8.43452 28.6937 8.43452C28.6539 8.43452 28.6341 8.43452 28.5943 8.41461C28.5744 8.41461 28.5346 8.3947 28.5147 8.37479C28.4948 8.37479 28.455 8.33497 28.4351 8.31506C28.3356 8.23543 28.2958 8.09606 28.2958 7.9567C28.2958 7.89698 28.2958 7.83725 28.3356 7.77752C28.3555 7.7178 28.3953 7.65807 28.4351 7.61825C28.5744 7.47889 28.7932 7.43907 28.9723 7.51871C29.032 7.53862 29.0917 7.57843 29.1315 7.61825C29.1713 7.65807 29.2111 7.7178 29.231 7.77752C29.2509 7.83725 29.2708 7.89698 29.2708 7.9567C29.2708 8.09606 29.2111 8.21552 29.1315 8.31506C29.0519 8.41461 28.9126 8.45442 28.7932 8.45442V8.43452Z"
|
|
133
|
-
fill="white"
|
|
134
|
-
/>
|
|
135
|
-
<path
|
|
136
|
-
d="M26.9228 8.43461C26.9228 8.43461 26.8631 8.43461 26.8233 8.43461C26.8034 8.43461 26.7636 8.43461 26.7238 8.4147C26.7039 8.4147 26.6641 8.39479 26.6442 8.37488C26.6243 8.37488 26.6044 8.33506 26.5646 8.31515C26.4651 8.21561 26.4253 8.09615 26.4253 7.95679C26.4253 7.89707 26.4253 7.83734 26.4651 7.77761C26.485 7.71789 26.5248 7.65816 26.5646 7.61834C26.684 7.49889 26.8432 7.45907 27.0024 7.47898C27.0422 7.47898 27.0621 7.49889 27.1019 7.5188C27.1218 7.5188 27.1615 7.53871 27.1814 7.55861C27.2013 7.57852 27.2411 7.59843 27.261 7.61834C27.3008 7.65816 27.3406 7.71789 27.3605 7.77761C27.3804 7.83734 27.4003 7.89707 27.4003 7.95679C27.4003 8.09615 27.3406 8.21561 27.261 8.31515C27.2411 8.33506 27.2212 8.35497 27.1814 8.37488C27.1615 8.37488 27.1218 8.4147 27.1019 8.4147C27.082 8.4147 27.0422 8.4147 27.0024 8.43461C26.9825 8.43461 26.9427 8.43461 26.9029 8.43461H26.9228Z"
|
|
137
|
-
fill="white"
|
|
138
|
-
/>
|
|
139
|
-
<path
|
|
140
|
-
d="M25.0722 8.43453C24.9528 8.43453 24.8135 8.39471 24.714 8.29517C24.6145 8.19562 24.5747 8.07617 24.5747 7.93681C24.5747 7.87708 24.5747 7.81735 24.6145 7.75762C24.6344 7.6979 24.6742 7.63817 24.714 7.59835C24.7538 7.55854 24.8135 7.51872 24.8732 7.49881C25.0523 7.41917 25.2712 7.45899 25.4105 7.59835C25.4502 7.63817 25.4901 7.6979 25.51 7.75762C25.5298 7.81735 25.5497 7.87708 25.5497 7.93681C25.5497 8.07617 25.49 8.19562 25.4105 8.29517C25.3906 8.31507 25.3508 8.33498 25.3309 8.35489C25.311 8.35489 25.2712 8.39471 25.2513 8.39471C25.2314 8.39471 25.1916 8.39471 25.1518 8.41462C25.1319 8.41462 25.0921 8.41462 25.0523 8.41462L25.0722 8.43453Z"
|
|
141
|
-
fill="white"
|
|
142
|
-
/>
|
|
143
|
-
</svg>
|
|
144
|
-
);
|
|
145
|
-
}
|
|
146
|
-
|
|
147
|
-
function Gift() {
|
|
148
|
-
return (
|
|
149
|
-
<svg
|
|
150
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
151
|
-
width="35"
|
|
152
|
-
height="35"
|
|
153
|
-
viewBox="0 0 35 35"
|
|
154
|
-
fill="none"
|
|
155
|
-
>
|
|
156
|
-
<path
|
|
157
|
-
d="M30.0283 19.8574H3.90128C3.62269 19.8574 3.40381 19.6384 3.40381 19.3597V14.5219C3.40381 14.2431 3.62269 14.0241 3.90128 14.0241H30.0283C30.3069 14.0241 30.5258 14.2431 30.5258 14.5219V19.3597C30.5258 19.6384 30.3069 19.8574 30.0283 19.8574ZM4.39875 18.862H29.5309V15.0196H4.39875V18.862Z"
|
|
158
|
-
fill="white"
|
|
159
|
-
/>
|
|
160
|
-
<path
|
|
161
|
-
d="M28.9141 31.6831H5.03555C4.75697 31.6831 4.53809 31.4641 4.53809 31.1854V19.3794C4.53809 19.1007 4.75697 18.8817 5.03555 18.8817H28.9141C29.1926 18.8817 29.4115 19.1007 29.4115 19.3794V31.1854C29.4115 31.4641 29.1926 31.6831 28.9141 31.6831ZM5.53302 30.6877H28.4166V19.8772H5.53302V30.6877Z"
|
|
162
|
-
fill="white"
|
|
163
|
-
/>
|
|
164
|
-
<path
|
|
165
|
-
d="M28.9141 31.6831H5.03555C4.75697 31.6831 4.53809 31.4641 4.53809 31.1854V19.3794C4.53809 19.1007 4.75697 18.8817 5.03555 18.8817H28.9141C29.1926 18.8817 29.4115 19.1007 29.4115 19.3794V31.1854C29.4115 31.4641 29.1926 31.6831 28.9141 31.6831ZM5.53302 30.6877H28.4166V19.8772H5.53302V30.6877Z"
|
|
166
|
-
fill="white"
|
|
167
|
-
/>
|
|
168
|
-
<path
|
|
169
|
-
d="M16.2385 15.0392H11.4628C9.91073 15.0392 8.6571 13.7849 8.6571 12.2321C8.6571 10.6792 9.91073 9.4249 11.4628 9.4249H11.6021C12.0996 9.4249 12.5971 9.50453 13.0547 9.64389C15.2237 10.281 16.736 12.3117 16.736 14.5614C16.736 14.8401 16.5171 15.0591 16.2385 15.0591V15.0392ZM11.4628 10.4004C10.4679 10.4004 9.63214 11.2167 9.63214 12.2321C9.63214 13.2474 10.448 14.0637 11.4628 14.0637H15.7013C15.5023 12.451 14.3481 11.0574 12.7761 10.5796C12.3981 10.4602 12.0001 10.4004 11.6021 10.4004H11.4628Z"
|
|
170
|
-
fill="white"
|
|
171
|
-
/>
|
|
172
|
-
<path
|
|
173
|
-
d="M22.0091 15.0394H16.2384C15.9599 15.0394 15.741 14.8204 15.741 14.5416C15.741 11.177 18.487 8.4296 21.8499 8.4296H22.0091C22.9642 8.4296 23.8796 8.84768 24.4964 9.5644C25.0138 10.1617 25.2924 10.9381 25.2924 11.7345C25.2924 13.5462 23.8199 15.0394 21.9892 15.0394H22.0091ZM16.7558 14.0439H22.0091C23.2826 14.0439 24.3173 13.0086 24.3173 11.7345C24.3173 11.177 24.1183 10.6395 23.7602 10.2214C23.3224 9.72367 22.6856 9.42504 22.0091 9.42504H21.8499C19.2034 9.42504 17.0145 11.4557 16.7558 14.0439Z"
|
|
174
|
-
fill="white"
|
|
175
|
-
/>
|
|
176
|
-
<path
|
|
177
|
-
d="M19.1038 31.6833H14.9649C14.6863 31.6833 14.4674 31.4643 14.4674 31.1856V14.5418C14.4674 14.263 14.6863 14.044 14.9649 14.044H19.1038C19.3824 14.044 19.6013 14.263 19.6013 14.5418V31.1856C19.6013 31.4643 19.3824 31.6833 19.1038 31.6833ZM15.4623 30.6879H18.6064V15.0395H15.4623V30.6879Z"
|
|
178
|
-
fill="white"
|
|
179
|
-
/>
|
|
180
|
-
<path
|
|
181
|
-
d="M17.0544 12.1326C16.7758 12.1326 16.5569 11.9136 16.5569 11.6349V4.0496C16.5569 3.77088 16.7758 3.55188 17.0544 3.55188C17.3329 3.55188 17.5518 3.77088 17.5518 4.0496V11.6349C17.5518 11.9136 17.3329 12.1326 17.0544 12.1326Z"
|
|
182
|
-
fill="white"
|
|
183
|
-
/>
|
|
184
|
-
</svg>
|
|
185
|
-
);
|
|
186
|
-
}
|
|
1
|
+
import { OnClick } from "../../interface";
|
|
2
|
+
import { cn } from "../../util";
|
|
3
|
+
|
|
4
|
+
export interface IconProps {
|
|
5
|
+
onClick: OnClick;
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
const Icon = {
|
|
9
|
+
Calendar,
|
|
10
|
+
Notification,
|
|
11
|
+
Search,
|
|
12
|
+
Browser,
|
|
13
|
+
Gift,
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
export default Icon;
|
|
17
|
+
|
|
18
|
+
function Calendar() {
|
|
19
|
+
return (
|
|
20
|
+
<svg
|
|
21
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
22
|
+
width="35"
|
|
23
|
+
height="35"
|
|
24
|
+
viewBox="0 0 35 35"
|
|
25
|
+
fill="none"
|
|
26
|
+
>
|
|
27
|
+
<path
|
|
28
|
+
d="M25.1064 33.8412C20.0919 33.8412 15.9928 29.7599 15.9928 24.723C15.9928 19.686 20.072 15.6047 25.1064 15.6047C30.1408 15.6047 34.2201 19.686 34.2201 24.723C34.2201 29.7599 30.1408 33.8412 25.1064 33.8412ZM25.1064 16.6001C20.6292 16.6001 16.9877 20.2435 16.9877 24.723C16.9877 29.2025 20.6292 32.8458 25.1064 32.8458C29.5837 32.8458 33.2251 29.2025 33.2251 24.723C33.2251 20.2435 29.5837 16.6001 25.1064 16.6001Z"
|
|
29
|
+
fill="white"
|
|
30
|
+
/>
|
|
31
|
+
<path
|
|
32
|
+
d="M29.2454 29.3019C29.126 29.3019 28.9867 29.2621 28.8872 29.1626L24.8279 25.1012C24.8279 25.1012 24.6886 24.8822 24.6886 24.7428V20.0642C24.6886 19.7855 24.9075 19.5665 25.1861 19.5665C25.4647 19.5665 25.6835 19.7855 25.6835 20.0642V24.5437L29.6036 28.4658C29.8026 28.6648 29.8026 28.9834 29.6036 29.1626C29.5041 29.2621 29.3847 29.3019 29.2454 29.3019Z"
|
|
33
|
+
fill="white"
|
|
34
|
+
/>
|
|
35
|
+
<path
|
|
36
|
+
d="M20.6491 5.11266H8.57059C8.29201 5.11266 8.07312 4.89366 8.07312 4.61493C8.07312 4.33621 8.29201 4.11721 8.57059 4.11721H20.6491C20.9277 4.11721 21.1466 4.33621 21.1466 4.61493C21.1466 4.89366 20.9277 5.11266 20.6491 5.11266Z"
|
|
37
|
+
fill="white"
|
|
38
|
+
/>
|
|
39
|
+
<path
|
|
40
|
+
d="M28.6286 11.2446H0.611116C0.332534 11.2446 0.113647 11.0256 0.113647 10.7469V4.61493C0.113647 4.33621 0.332534 4.11721 0.611116 4.11721H5.06844C5.34702 4.11721 5.56591 4.33621 5.56591 4.61493C5.56591 4.89366 5.34702 5.11266 5.06844 5.11266H1.10859V10.2492H28.1311V5.11266H24.1712C23.8927 5.11266 23.6738 4.89366 23.6738 4.61493C23.6738 4.33621 23.8927 4.11721 24.1712 4.11721H28.6286C28.9072 4.11721 29.126 4.33621 29.126 4.61493V10.7469C29.126 11.0256 28.9072 11.2446 28.6286 11.2446Z"
|
|
41
|
+
fill="white"
|
|
42
|
+
/>
|
|
43
|
+
<path
|
|
44
|
+
d="M16.4902 26.5944H2.00394C1.72536 26.5944 1.50647 26.3754 1.50647 26.0967V10.747C1.50647 10.4682 1.72536 10.2492 2.00394 10.2492H27.2157C27.4942 10.2492 27.7131 10.4682 27.7131 10.747V16.3812C27.7131 16.6599 27.4942 16.8789 27.2157 16.8789C26.9371 16.8789 26.7182 16.6599 26.7182 16.3812V11.2447H2.50141V25.599H16.4902C16.7688 25.599 16.9877 25.818 16.9877 26.0967C16.9877 26.3754 16.7688 26.5944 16.4902 26.5944Z"
|
|
45
|
+
fill="white"
|
|
46
|
+
/>
|
|
47
|
+
<path
|
|
48
|
+
d="M24.1514 8.17859H20.6492C20.3706 8.17859 20.1517 7.95959 20.1517 7.68086V1.54892C20.1517 1.2702 20.3706 1.0512 20.6492 1.0512H24.1514C24.43 1.0512 24.6489 1.2702 24.6489 1.54892V7.68086C24.6489 7.95959 24.43 8.17859 24.1514 8.17859ZM21.1467 7.18314H23.6539V2.04665H21.1467V7.18314Z"
|
|
49
|
+
fill="white"
|
|
50
|
+
/>
|
|
51
|
+
<path
|
|
52
|
+
d="M8.57057 8.17859H5.06839C4.78981 8.17859 4.57092 7.95959 4.57092 7.68086V1.54892C4.57092 1.2702 4.78981 1.0512 5.06839 1.0512H8.57057C8.84916 1.0512 9.06804 1.2702 9.06804 1.54892V7.68086C9.06804 7.95959 8.84916 8.17859 8.57057 8.17859ZM5.56586 7.18314H8.0731V2.04665H5.56586V7.18314Z"
|
|
53
|
+
fill="white"
|
|
54
|
+
/>
|
|
55
|
+
</svg>
|
|
56
|
+
);
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
function Notification() {
|
|
60
|
+
return (
|
|
61
|
+
<svg
|
|
62
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
63
|
+
width="35"
|
|
64
|
+
height="35"
|
|
65
|
+
viewBox="0 0 35 35"
|
|
66
|
+
fill="none"
|
|
67
|
+
>
|
|
68
|
+
<path
|
|
69
|
+
d="M25.4008 28.4473H8.58633C7.92967 28.4473 7.3128 28.1088 6.97452 27.5514C6.63624 26.9939 6.59645 26.2971 6.89493 25.6998C8.42713 22.6737 9.22309 19.2693 9.22309 15.8847V15.6458C9.22309 13.5355 10.0389 11.5844 11.5512 10.1112C13.0436 8.63791 15.0335 7.86146 17.1428 7.88137C21.3414 7.96101 24.764 11.5446 24.764 15.8847C24.764 19.2693 25.5799 22.6737 27.0922 25.6998C27.3906 26.2971 27.3708 26.9939 27.0126 27.5514C26.6544 28.1088 26.0574 28.4473 25.4008 28.4473ZM17.0035 8.85691C15.2126 8.85691 13.5411 9.53381 12.2676 10.7881C10.9543 12.0821 10.2379 13.7943 10.2379 15.6259V15.8648C10.2379 19.4086 9.40217 22.9723 7.79037 26.1378C7.65108 26.4166 7.65108 26.755 7.83017 27.0138C7.98936 27.2925 8.28784 27.4518 8.60622 27.4518H25.4207C25.7391 27.4518 26.0176 27.2925 26.1967 27.0138C26.3559 26.7351 26.3758 26.4166 26.2365 26.1378C24.6446 22.9723 23.789 19.4086 23.789 15.8648C23.789 12.0622 20.8042 8.91663 17.1428 8.85691C17.103 8.85691 17.0632 8.85691 17.0234 8.85691H17.0035Z"
|
|
70
|
+
fill="white"
|
|
71
|
+
/>
|
|
72
|
+
<path
|
|
73
|
+
d="M17.0035 32.0704C15.1927 32.0704 13.7401 30.5971 13.7401 28.8053V27.9493C13.7401 27.6705 13.959 27.4515 14.2376 27.4515C14.5162 27.4515 14.7351 27.6705 14.7351 27.9493V28.8053C14.7351 30.0596 15.7499 31.075 17.0035 31.075C18.2571 31.075 19.272 30.0596 19.272 28.8053V27.9493C19.272 27.6705 19.4909 27.4515 19.7694 27.4515C20.048 27.4515 20.2669 27.6705 20.2669 27.9493V28.8053C20.2669 30.6171 18.7944 32.0704 17.0035 32.0704Z"
|
|
74
|
+
fill="white"
|
|
75
|
+
/>
|
|
76
|
+
<path
|
|
77
|
+
d="M17.0035 8.85671C15.4514 8.85671 14.1978 7.60245 14.1978 6.04956C14.1978 4.49666 15.4514 3.2424 17.0035 3.2424C18.5556 3.2424 19.8092 4.49666 19.8092 6.04956C19.8092 7.60245 18.5556 8.85671 17.0035 8.85671ZM17.0035 4.23785C16.0085 4.23785 15.1927 5.05411 15.1927 6.04956C15.1927 7.045 16.0085 7.86127 17.0035 7.86127C17.9984 7.86127 18.8143 7.045 18.8143 6.04956C18.8143 5.05411 17.9984 4.23785 17.0035 4.23785Z"
|
|
78
|
+
fill="white"
|
|
79
|
+
/>
|
|
80
|
+
</svg>
|
|
81
|
+
);
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
function Search() {
|
|
85
|
+
return (
|
|
86
|
+
<svg
|
|
87
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
88
|
+
width="35"
|
|
89
|
+
height="36"
|
|
90
|
+
viewBox="0 0 35 36"
|
|
91
|
+
fill="none"
|
|
92
|
+
>
|
|
93
|
+
<path
|
|
94
|
+
d="M28.9758 32.4908C28.4983 32.4908 28.0008 32.3116 27.6426 31.9334L19.1658 23.4522C18.8673 23.1535 18.8673 22.6757 19.1658 22.3771L21.673 19.8686C21.9715 19.5699 22.449 19.5699 22.7475 19.8686L31.2244 28.3498C31.9607 29.0864 31.9607 30.3008 31.2244 31.0375L30.3091 31.9533C29.931 32.3315 29.4534 32.5107 28.9758 32.5107V32.4908ZM20.0214 22.9146L28.3391 31.2365C28.6973 31.5949 29.2743 31.5949 29.6126 31.2365L30.5279 30.3207C30.8861 29.9624 30.8861 29.385 30.5279 29.0466L22.2103 20.7246L20.0214 22.9146Z"
|
|
95
|
+
fill="white"
|
|
96
|
+
/>
|
|
97
|
+
<path
|
|
98
|
+
d="M19.8424 22.8748C19.723 22.8748 19.5837 22.835 19.4842 22.7355L17.7132 20.9636C17.5142 20.7645 17.5142 20.446 17.7132 20.2668C17.9122 20.0876 18.2306 20.0677 18.4097 20.2668L19.8225 21.6803L20.9567 20.5455L19.5439 19.132C19.3449 18.9329 19.3449 18.6143 19.5439 18.4352C19.7429 18.256 20.0613 18.2361 20.2403 18.4352L22.0113 20.2071C22.0113 20.2071 22.1506 20.4261 22.1506 20.5654C22.1506 20.7048 22.0909 20.8242 22.0113 20.9238L20.1807 22.7554C20.1807 22.7554 19.9618 22.8948 19.8225 22.8948L19.8424 22.8748Z"
|
|
99
|
+
fill="white"
|
|
100
|
+
/>
|
|
101
|
+
<path
|
|
102
|
+
d="M12.241 23.0939C9.63424 23.0939 7.04741 22.0984 5.05754 20.1274C1.09768 16.1656 1.09768 9.73499 5.05754 5.77312C9.01739 1.81124 15.4447 1.81124 19.4045 5.77312C23.3644 9.73499 23.3644 16.1656 19.4045 20.1274C17.4346 22.0984 14.8278 23.0939 12.2211 23.0939H12.241ZM12.241 3.78223C9.89293 3.78223 7.54487 4.67813 5.77389 6.46993C2.21201 10.0336 2.21201 15.847 5.77389 19.4306C9.33576 22.9943 15.1462 22.9943 18.728 19.4306C22.2899 15.8669 22.2899 10.0535 18.728 6.46993C16.9371 4.67813 14.589 3.78223 12.2609 3.78223H12.241Z"
|
|
103
|
+
fill="white"
|
|
104
|
+
/>
|
|
105
|
+
</svg>
|
|
106
|
+
);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
function Browser({ onClick }: IconProps) {
|
|
110
|
+
const container = {
|
|
111
|
+
cursor: "cursor-pointer",
|
|
112
|
+
};
|
|
113
|
+
return (
|
|
114
|
+
<svg
|
|
115
|
+
className={cn(container)}
|
|
116
|
+
onClick={onClick}
|
|
117
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
118
|
+
width="35"
|
|
119
|
+
height="35"
|
|
120
|
+
viewBox="0 0 35 35"
|
|
121
|
+
fill="none"
|
|
122
|
+
>
|
|
123
|
+
<path
|
|
124
|
+
d="M29.0718 28.5227H5.31267C3.89986 28.5227 2.74573 27.368 2.74573 25.9544V7.87715C2.74573 6.46362 3.89986 5.3089 5.31267 5.3089H29.0718C30.4846 5.3089 31.6387 6.46362 31.6387 7.87715V25.9544C31.6387 27.368 30.4846 28.5227 29.0718 28.5227ZM5.31267 6.30434C4.43712 6.30434 3.74067 7.00116 3.74067 7.87715V25.9544C3.74067 26.8304 4.43712 27.5272 5.31267 27.5272H29.0718C29.9473 27.5272 30.6438 26.8304 30.6438 25.9544V7.87715C30.6438 7.00116 29.9473 6.30434 29.0718 6.30434H5.31267Z"
|
|
125
|
+
fill="white"
|
|
126
|
+
/>
|
|
127
|
+
<path
|
|
128
|
+
d="M31.1413 10.4056H3.2432C2.96461 10.4056 2.74573 10.1866 2.74573 9.90788C2.74573 9.62915 2.96461 9.41016 3.2432 9.41016H31.1413C31.4198 9.41016 31.6387 9.62915 31.6387 9.90788C31.6387 10.1866 31.4198 10.4056 31.1413 10.4056Z"
|
|
129
|
+
fill="white"
|
|
130
|
+
/>
|
|
131
|
+
<path
|
|
132
|
+
d="M28.7932 8.43452C28.7932 8.43452 28.7335 8.43452 28.6937 8.43452C28.6539 8.43452 28.6341 8.43452 28.5943 8.41461C28.5744 8.41461 28.5346 8.3947 28.5147 8.37479C28.4948 8.37479 28.455 8.33497 28.4351 8.31506C28.3356 8.23543 28.2958 8.09606 28.2958 7.9567C28.2958 7.89698 28.2958 7.83725 28.3356 7.77752C28.3555 7.7178 28.3953 7.65807 28.4351 7.61825C28.5744 7.47889 28.7932 7.43907 28.9723 7.51871C29.032 7.53862 29.0917 7.57843 29.1315 7.61825C29.1713 7.65807 29.2111 7.7178 29.231 7.77752C29.2509 7.83725 29.2708 7.89698 29.2708 7.9567C29.2708 8.09606 29.2111 8.21552 29.1315 8.31506C29.0519 8.41461 28.9126 8.45442 28.7932 8.45442V8.43452Z"
|
|
133
|
+
fill="white"
|
|
134
|
+
/>
|
|
135
|
+
<path
|
|
136
|
+
d="M26.9228 8.43461C26.9228 8.43461 26.8631 8.43461 26.8233 8.43461C26.8034 8.43461 26.7636 8.43461 26.7238 8.4147C26.7039 8.4147 26.6641 8.39479 26.6442 8.37488C26.6243 8.37488 26.6044 8.33506 26.5646 8.31515C26.4651 8.21561 26.4253 8.09615 26.4253 7.95679C26.4253 7.89707 26.4253 7.83734 26.4651 7.77761C26.485 7.71789 26.5248 7.65816 26.5646 7.61834C26.684 7.49889 26.8432 7.45907 27.0024 7.47898C27.0422 7.47898 27.0621 7.49889 27.1019 7.5188C27.1218 7.5188 27.1615 7.53871 27.1814 7.55861C27.2013 7.57852 27.2411 7.59843 27.261 7.61834C27.3008 7.65816 27.3406 7.71789 27.3605 7.77761C27.3804 7.83734 27.4003 7.89707 27.4003 7.95679C27.4003 8.09615 27.3406 8.21561 27.261 8.31515C27.2411 8.33506 27.2212 8.35497 27.1814 8.37488C27.1615 8.37488 27.1218 8.4147 27.1019 8.4147C27.082 8.4147 27.0422 8.4147 27.0024 8.43461C26.9825 8.43461 26.9427 8.43461 26.9029 8.43461H26.9228Z"
|
|
137
|
+
fill="white"
|
|
138
|
+
/>
|
|
139
|
+
<path
|
|
140
|
+
d="M25.0722 8.43453C24.9528 8.43453 24.8135 8.39471 24.714 8.29517C24.6145 8.19562 24.5747 8.07617 24.5747 7.93681C24.5747 7.87708 24.5747 7.81735 24.6145 7.75762C24.6344 7.6979 24.6742 7.63817 24.714 7.59835C24.7538 7.55854 24.8135 7.51872 24.8732 7.49881C25.0523 7.41917 25.2712 7.45899 25.4105 7.59835C25.4502 7.63817 25.4901 7.6979 25.51 7.75762C25.5298 7.81735 25.5497 7.87708 25.5497 7.93681C25.5497 8.07617 25.49 8.19562 25.4105 8.29517C25.3906 8.31507 25.3508 8.33498 25.3309 8.35489C25.311 8.35489 25.2712 8.39471 25.2513 8.39471C25.2314 8.39471 25.1916 8.39471 25.1518 8.41462C25.1319 8.41462 25.0921 8.41462 25.0523 8.41462L25.0722 8.43453Z"
|
|
141
|
+
fill="white"
|
|
142
|
+
/>
|
|
143
|
+
</svg>
|
|
144
|
+
);
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
function Gift() {
|
|
148
|
+
return (
|
|
149
|
+
<svg
|
|
150
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
151
|
+
width="35"
|
|
152
|
+
height="35"
|
|
153
|
+
viewBox="0 0 35 35"
|
|
154
|
+
fill="none"
|
|
155
|
+
>
|
|
156
|
+
<path
|
|
157
|
+
d="M30.0283 19.8574H3.90128C3.62269 19.8574 3.40381 19.6384 3.40381 19.3597V14.5219C3.40381 14.2431 3.62269 14.0241 3.90128 14.0241H30.0283C30.3069 14.0241 30.5258 14.2431 30.5258 14.5219V19.3597C30.5258 19.6384 30.3069 19.8574 30.0283 19.8574ZM4.39875 18.862H29.5309V15.0196H4.39875V18.862Z"
|
|
158
|
+
fill="white"
|
|
159
|
+
/>
|
|
160
|
+
<path
|
|
161
|
+
d="M28.9141 31.6831H5.03555C4.75697 31.6831 4.53809 31.4641 4.53809 31.1854V19.3794C4.53809 19.1007 4.75697 18.8817 5.03555 18.8817H28.9141C29.1926 18.8817 29.4115 19.1007 29.4115 19.3794V31.1854C29.4115 31.4641 29.1926 31.6831 28.9141 31.6831ZM5.53302 30.6877H28.4166V19.8772H5.53302V30.6877Z"
|
|
162
|
+
fill="white"
|
|
163
|
+
/>
|
|
164
|
+
<path
|
|
165
|
+
d="M28.9141 31.6831H5.03555C4.75697 31.6831 4.53809 31.4641 4.53809 31.1854V19.3794C4.53809 19.1007 4.75697 18.8817 5.03555 18.8817H28.9141C29.1926 18.8817 29.4115 19.1007 29.4115 19.3794V31.1854C29.4115 31.4641 29.1926 31.6831 28.9141 31.6831ZM5.53302 30.6877H28.4166V19.8772H5.53302V30.6877Z"
|
|
166
|
+
fill="white"
|
|
167
|
+
/>
|
|
168
|
+
<path
|
|
169
|
+
d="M16.2385 15.0392H11.4628C9.91073 15.0392 8.6571 13.7849 8.6571 12.2321C8.6571 10.6792 9.91073 9.4249 11.4628 9.4249H11.6021C12.0996 9.4249 12.5971 9.50453 13.0547 9.64389C15.2237 10.281 16.736 12.3117 16.736 14.5614C16.736 14.8401 16.5171 15.0591 16.2385 15.0591V15.0392ZM11.4628 10.4004C10.4679 10.4004 9.63214 11.2167 9.63214 12.2321C9.63214 13.2474 10.448 14.0637 11.4628 14.0637H15.7013C15.5023 12.451 14.3481 11.0574 12.7761 10.5796C12.3981 10.4602 12.0001 10.4004 11.6021 10.4004H11.4628Z"
|
|
170
|
+
fill="white"
|
|
171
|
+
/>
|
|
172
|
+
<path
|
|
173
|
+
d="M22.0091 15.0394H16.2384C15.9599 15.0394 15.741 14.8204 15.741 14.5416C15.741 11.177 18.487 8.4296 21.8499 8.4296H22.0091C22.9642 8.4296 23.8796 8.84768 24.4964 9.5644C25.0138 10.1617 25.2924 10.9381 25.2924 11.7345C25.2924 13.5462 23.8199 15.0394 21.9892 15.0394H22.0091ZM16.7558 14.0439H22.0091C23.2826 14.0439 24.3173 13.0086 24.3173 11.7345C24.3173 11.177 24.1183 10.6395 23.7602 10.2214C23.3224 9.72367 22.6856 9.42504 22.0091 9.42504H21.8499C19.2034 9.42504 17.0145 11.4557 16.7558 14.0439Z"
|
|
174
|
+
fill="white"
|
|
175
|
+
/>
|
|
176
|
+
<path
|
|
177
|
+
d="M19.1038 31.6833H14.9649C14.6863 31.6833 14.4674 31.4643 14.4674 31.1856V14.5418C14.4674 14.263 14.6863 14.044 14.9649 14.044H19.1038C19.3824 14.044 19.6013 14.263 19.6013 14.5418V31.1856C19.6013 31.4643 19.3824 31.6833 19.1038 31.6833ZM15.4623 30.6879H18.6064V15.0395H15.4623V30.6879Z"
|
|
178
|
+
fill="white"
|
|
179
|
+
/>
|
|
180
|
+
<path
|
|
181
|
+
d="M17.0544 12.1326C16.7758 12.1326 16.5569 11.9136 16.5569 11.6349V4.0496C16.5569 3.77088 16.7758 3.55188 17.0544 3.55188C17.3329 3.55188 17.5518 3.77088 17.5518 4.0496V11.6349C17.5518 11.9136 17.3329 12.1326 17.0544 12.1326Z"
|
|
182
|
+
fill="white"
|
|
183
|
+
/>
|
|
184
|
+
</svg>
|
|
185
|
+
);
|
|
186
|
+
}
|
package/asset/svg/Image.tsx
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
|
-
interface ImageProps {
|
|
2
|
-
color?: string;
|
|
3
|
-
className?: string;
|
|
4
|
-
}
|
|
5
|
-
export default function Image({ color, className }: ImageProps) {
|
|
6
|
-
return (
|
|
7
|
-
<svg
|
|
8
|
-
className={className}
|
|
9
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
10
|
-
width="25"
|
|
11
|
-
height="25"
|
|
12
|
-
viewBox="0 0 25 25"
|
|
13
|
-
fill="none"
|
|
14
|
-
>
|
|
15
|
-
<path
|
|
16
|
-
d="M2.34375 16.4062L7.71771 11.0323C7.93535 10.8147 8.19372 10.642 8.47808 10.5242C8.76244 10.4064 9.06721 10.3458 9.375 10.3458C9.68279 10.3458 9.98756 10.4064 10.2719 10.5242C10.5563 10.642 10.8147 10.8147 11.0323 11.0323L16.4062 16.4062M14.8437 14.8437L16.3115 13.376C16.5291 13.1584 16.7875 12.9858 17.0718 12.868C17.3562 12.7502 17.661 12.6896 17.9687 12.6896C18.2765 12.6896 18.5813 12.7502 18.8657 12.868C19.15 12.9858 19.4084 13.1584 19.626 13.376L22.6562 16.4062M3.90625 20.3125H21.0937C21.5082 20.3125 21.9056 20.1479 22.1986 19.8549C22.4916 19.5618 22.6562 19.1644 22.6562 18.75V6.25C22.6562 5.8356 22.4916 5.43817 22.1986 5.14515C21.9056 4.85212 21.5082 4.6875 21.0937 4.6875H3.90625C3.49185 4.6875 3.09442 4.85212 2.8014 5.14515C2.50837 5.43817 2.34375 5.8356 2.34375 6.25V18.75C2.34375 19.1644 2.50837 19.5618 2.8014 19.8549C3.09442 20.1479 3.49185 20.3125 3.90625 20.3125ZM14.8437 8.59375H14.8521V8.60208H14.8437V8.59375ZM15.2344 8.59375C15.2344 8.69735 15.1932 8.79671 15.12 8.86996C15.0467 8.94322 14.9473 8.98437 14.8437 8.98437C14.7401 8.98437 14.6408 8.94322 14.5675 8.86996C14.4943 8.79671 14.4531 8.69735 14.4531 8.59375C14.4531 8.49015 14.4943 8.39079 14.5675 8.31754C14.6408 8.24428 14.7401 8.20312 14.8437 8.20312C14.9473 8.20312 15.0467 8.24428 15.12 8.31754C15.1932 8.39079 15.2344 8.49015 15.2344 8.59375Z"
|
|
17
|
-
stroke={color ?? "#FFFFFF"}
|
|
18
|
-
strokeWidth="1.5"
|
|
19
|
-
strokeLinecap="round"
|
|
20
|
-
strokeLinejoin="round"
|
|
21
|
-
/>
|
|
22
|
-
</svg>
|
|
23
|
-
);
|
|
24
|
-
}
|
|
1
|
+
interface ImageProps {
|
|
2
|
+
color?: string;
|
|
3
|
+
className?: string;
|
|
4
|
+
}
|
|
5
|
+
export default function Image({ color, className }: ImageProps) {
|
|
6
|
+
return (
|
|
7
|
+
<svg
|
|
8
|
+
className={className}
|
|
9
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
10
|
+
width="25"
|
|
11
|
+
height="25"
|
|
12
|
+
viewBox="0 0 25 25"
|
|
13
|
+
fill="none"
|
|
14
|
+
>
|
|
15
|
+
<path
|
|
16
|
+
d="M2.34375 16.4062L7.71771 11.0323C7.93535 10.8147 8.19372 10.642 8.47808 10.5242C8.76244 10.4064 9.06721 10.3458 9.375 10.3458C9.68279 10.3458 9.98756 10.4064 10.2719 10.5242C10.5563 10.642 10.8147 10.8147 11.0323 11.0323L16.4062 16.4062M14.8437 14.8437L16.3115 13.376C16.5291 13.1584 16.7875 12.9858 17.0718 12.868C17.3562 12.7502 17.661 12.6896 17.9687 12.6896C18.2765 12.6896 18.5813 12.7502 18.8657 12.868C19.15 12.9858 19.4084 13.1584 19.626 13.376L22.6562 16.4062M3.90625 20.3125H21.0937C21.5082 20.3125 21.9056 20.1479 22.1986 19.8549C22.4916 19.5618 22.6562 19.1644 22.6562 18.75V6.25C22.6562 5.8356 22.4916 5.43817 22.1986 5.14515C21.9056 4.85212 21.5082 4.6875 21.0937 4.6875H3.90625C3.49185 4.6875 3.09442 4.85212 2.8014 5.14515C2.50837 5.43817 2.34375 5.8356 2.34375 6.25V18.75C2.34375 19.1644 2.50837 19.5618 2.8014 19.8549C3.09442 20.1479 3.49185 20.3125 3.90625 20.3125ZM14.8437 8.59375H14.8521V8.60208H14.8437V8.59375ZM15.2344 8.59375C15.2344 8.69735 15.1932 8.79671 15.12 8.86996C15.0467 8.94322 14.9473 8.98437 14.8437 8.98437C14.7401 8.98437 14.6408 8.94322 14.5675 8.86996C14.4943 8.79671 14.4531 8.69735 14.4531 8.59375C14.4531 8.49015 14.4943 8.39079 14.5675 8.31754C14.6408 8.24428 14.7401 8.20312 14.8437 8.20312C14.9473 8.20312 15.0467 8.24428 15.12 8.31754C15.1932 8.39079 15.2344 8.49015 15.2344 8.59375Z"
|
|
17
|
+
stroke={color ?? "#FFFFFF"}
|
|
18
|
+
strokeWidth="1.5"
|
|
19
|
+
strokeLinecap="round"
|
|
20
|
+
strokeLinejoin="round"
|
|
21
|
+
/>
|
|
22
|
+
</svg>
|
|
23
|
+
);
|
|
24
|
+
}
|
|
@@ -1,34 +1,34 @@
|
|
|
1
|
-
import { OnClick } from "../../interface";
|
|
2
|
-
|
|
3
|
-
interface Notification {
|
|
4
|
-
onClick: OnClick;
|
|
5
|
-
flag: boolean;
|
|
6
|
-
color?: string;
|
|
7
|
-
}
|
|
8
|
-
export default function Notification({ onClick, color, flag }: Notification) {
|
|
9
|
-
return (
|
|
10
|
-
<button className="relative" onClick={onClick}>
|
|
11
|
-
<svg
|
|
12
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
13
|
-
width="25"
|
|
14
|
-
height="25"
|
|
15
|
-
viewBox="0 0 25 25"
|
|
16
|
-
fill="none"
|
|
17
|
-
>
|
|
18
|
-
<path
|
|
19
|
-
d="M15.4759 17.7938C17.4168 17.564 19.3237 17.1059 21.1572 16.4292C19.6044 14.7092 18.7465 12.4734 18.7499 10.1562V9.375C18.7499 7.7174 18.0914 6.12769 16.9193 4.95558C15.7472 3.78348 14.1575 3.125 12.4999 3.125C10.8423 3.125 9.25257 3.78348 8.08047 4.95558C6.90837 6.12769 6.24989 7.7174 6.24989 9.375V10.1562C6.25303 12.4736 5.39466 14.7093 3.84155 16.4292C5.64676 17.0958 7.54989 17.5594 9.52384 17.7938M15.4759 17.7938C13.4988 18.0283 11.5009 18.0283 9.52384 17.7938M15.4759 17.7938C15.626 18.2624 15.6634 18.7598 15.5849 19.2455C15.5064 19.7313 15.3143 20.1917 15.0242 20.5891C14.7342 20.9866 14.3544 21.31 13.9157 21.5329C13.4771 21.7559 12.9919 21.8721 12.4999 21.8721C12.0078 21.8721 11.5227 21.7559 11.0841 21.5329C10.6454 21.31 10.2656 20.9866 9.97553 20.5891C9.68548 20.1917 9.49339 19.7313 9.4149 19.2455C9.33641 18.7598 9.37374 18.2624 9.52384 17.7938"
|
|
20
|
-
stroke={color ?? "#910023"}
|
|
21
|
-
strokeWidth="1.5"
|
|
22
|
-
strokeLinecap="round"
|
|
23
|
-
strokeLinejoin="round"
|
|
24
|
-
/>
|
|
25
|
-
</svg>
|
|
26
|
-
{flag && (
|
|
27
|
-
<div className="absolute top-0 right-0">
|
|
28
|
-
<div className="absolute w-2 h-2 rounded-full bg-red-500" />
|
|
29
|
-
<div className=" w-2 h-2 rounded-full bg-red-400 animate-ping duration-1000" />
|
|
30
|
-
</div>
|
|
31
|
-
)}
|
|
32
|
-
</button>
|
|
33
|
-
);
|
|
34
|
-
}
|
|
1
|
+
import { OnClick } from "../../interface";
|
|
2
|
+
|
|
3
|
+
interface Notification {
|
|
4
|
+
onClick: OnClick;
|
|
5
|
+
flag: boolean;
|
|
6
|
+
color?: string;
|
|
7
|
+
}
|
|
8
|
+
export default function Notification({ onClick, color, flag }: Notification) {
|
|
9
|
+
return (
|
|
10
|
+
<button className="relative" onClick={onClick}>
|
|
11
|
+
<svg
|
|
12
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
13
|
+
width="25"
|
|
14
|
+
height="25"
|
|
15
|
+
viewBox="0 0 25 25"
|
|
16
|
+
fill="none"
|
|
17
|
+
>
|
|
18
|
+
<path
|
|
19
|
+
d="M15.4759 17.7938C17.4168 17.564 19.3237 17.1059 21.1572 16.4292C19.6044 14.7092 18.7465 12.4734 18.7499 10.1562V9.375C18.7499 7.7174 18.0914 6.12769 16.9193 4.95558C15.7472 3.78348 14.1575 3.125 12.4999 3.125C10.8423 3.125 9.25257 3.78348 8.08047 4.95558C6.90837 6.12769 6.24989 7.7174 6.24989 9.375V10.1562C6.25303 12.4736 5.39466 14.7093 3.84155 16.4292C5.64676 17.0958 7.54989 17.5594 9.52384 17.7938M15.4759 17.7938C13.4988 18.0283 11.5009 18.0283 9.52384 17.7938M15.4759 17.7938C15.626 18.2624 15.6634 18.7598 15.5849 19.2455C15.5064 19.7313 15.3143 20.1917 15.0242 20.5891C14.7342 20.9866 14.3544 21.31 13.9157 21.5329C13.4771 21.7559 12.9919 21.8721 12.4999 21.8721C12.0078 21.8721 11.5227 21.7559 11.0841 21.5329C10.6454 21.31 10.2656 20.9866 9.97553 20.5891C9.68548 20.1917 9.49339 19.7313 9.4149 19.2455C9.33641 18.7598 9.37374 18.2624 9.52384 17.7938"
|
|
20
|
+
stroke={color ?? "#910023"}
|
|
21
|
+
strokeWidth="1.5"
|
|
22
|
+
strokeLinecap="round"
|
|
23
|
+
strokeLinejoin="round"
|
|
24
|
+
/>
|
|
25
|
+
</svg>
|
|
26
|
+
{flag && (
|
|
27
|
+
<div className="absolute top-0 right-0">
|
|
28
|
+
<div className="absolute w-2 h-2 rounded-full bg-red-500" />
|
|
29
|
+
<div className=" w-2 h-2 rounded-full bg-red-400 animate-ping duration-1000" />
|
|
30
|
+
</div>
|
|
31
|
+
)}
|
|
32
|
+
</button>
|
|
33
|
+
);
|
|
34
|
+
}
|