Skip to content

Commit a8287ec

Browse files
committed
Refact: 피드백 바탕으로 아이콘 컴포넌트의 복잡한 로직을 삼항 연산자 로직으로 수정
1 parent e894a7f commit a8287ec

7 files changed

Lines changed: 105 additions & 153 deletions

File tree

src/assets/default/like-white.svg

Lines changed: 0 additions & 3 deletions
This file was deleted.

src/components/Icons/Alarm.tsx

Lines changed: 8 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,15 @@
11
import React from 'react';
22
import type { IconsProps } from './dto';
33

4-
const Alarm: React.FC<IconsProps> = ({ isActive = false }) => {
4+
const Alarm: React.FC<IconsProps> = ({ isFilled = false }) => {
55
return (
6-
<>
7-
{isActive ? (
8-
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="18" viewBox="0 0 14 18" fill="none">
9-
<path
10-
d="M0 15.3V13.5H1.75V7.2C1.75 5.958 2.1175 4.851 2.84375 3.879C3.57 2.907 4.52375 2.277 5.6875 1.98V1.35C5.6875 0.972 5.81875 0.657 6.0725 0.396C6.32625 0.135 6.64125 0 7 0C7.35875 0 7.67375 0.135 7.9275 0.396C8.18125 0.657 8.3125 0.981 8.3125 1.35V1.98C9.47625 2.277 10.43 2.916 11.1562 3.879C11.8825 4.842 12.25 5.949 12.25 7.2V13.5H14V15.3H0ZM7 18C6.51875 18 6.1075 17.82 5.76625 17.469C5.425 17.118 5.25 16.695 5.25 16.2H8.75C8.75 16.695 8.575 17.118 8.23375 17.469C7.8925 17.82 7.48125 18 7 18ZM3.5 13.5H10.5V7.2C10.5 6.21 10.1587 5.364 9.4675 4.653C8.77625 3.942 7.95375 3.591 6.99125 3.591C6.02875 3.591 5.20625 3.942 4.515 4.653C3.82375 5.364 3.4825 6.21 3.4825 7.2V13.5H3.5Z"
11-
fill="#8E8E8E"
12-
/>
13-
<path d="M11 14.5H2.5V6C2.5 4 5 3 7.5 3C9.5 3 10.6667 5.33333 11 6.5V14.5Z" fill="#8E8E8E" />
14-
</svg>
15-
) : (
16-
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="18" viewBox="0 0 14 18" fill="none">
17-
<path
18-
d="M0 15.3V13.5H1.75V7.2C1.75 5.958 2.1175 4.851 2.84375 3.879C3.57 2.907 4.52375 2.277 5.6875 1.98V1.35C5.6875 0.972 5.81875 0.657 6.0725 0.396C6.32625 0.135 6.64125 0 7 0C7.35875 0 7.67375 0.135 7.9275 0.396C8.18125 0.657 8.3125 0.981 8.3125 1.35V1.98C9.47625 2.277 10.43 2.916 11.1562 3.879C11.8825 4.842 12.25 5.949 12.25 7.2V13.5H14V15.3H0ZM7 18C6.51875 18 6.1075 17.82 5.76625 17.469C5.425 17.118 5.25 16.695 5.25 16.2H8.75C8.75 16.695 8.575 17.118 8.23375 17.469C7.8925 17.82 7.48125 18 7 18ZM3.5 13.5H10.5V7.2C10.5 6.21 10.1587 5.364 9.4675 4.653C8.77625 3.942 7.95375 3.591 6.99125 3.591C6.02875 3.591 5.20625 3.942 4.515 4.653C3.82375 5.364 3.4825 6.21 3.4825 7.2V13.5H3.5Z"
19-
fill="#8E8E8E"
20-
/>
21-
</svg>
22-
)}
23-
</>
6+
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="18" viewBox="0 0 14 18" fill="none">
7+
<path
8+
d="M0 15.3V13.5H1.75V7.2C1.75 5.958 2.1175 4.851 2.84375 3.879C3.57 2.907 4.52375 2.277 5.6875 1.98V1.35C5.6875 0.972 5.81875 0.657 6.0725 0.396C6.32625 0.135 6.64125 0 7 0C7.35875 0 7.67375 0.135 7.9275 0.396C8.18125 0.657 8.3125 0.981 8.3125 1.35V1.98C9.47625 2.277 10.43 2.916 11.1562 3.879C11.8825 4.842 12.25 5.949 12.25 7.2V13.5H14V15.3H0ZM7 18C6.51875 18 6.1075 17.82 5.76625 17.469C5.425 17.118 5.25 16.695 5.25 16.2H8.75C8.75 16.695 8.575 17.118 8.23375 17.469C7.8925 17.82 7.48125 18 7 18ZM3.5 13.5H10.5V7.2C10.5 6.21 10.1587 5.364 9.4675 4.653C8.77625 3.942 7.95375 3.591 6.99125 3.591C6.02875 3.591 5.20625 3.942 4.515 4.653C3.82375 5.364 3.4825 6.21 3.4825 7.2V13.5H3.5Z"
9+
fill="#8E8E8E"
10+
/>
11+
{isFilled && <path d="M11 14.5H2.5V6C2.5 4 5 3 7.5 3C9.5 3 10.6667 5.33333 11 6.5V14.5Z" fill="#8E8E8E" />}
12+
</svg>
2413
);
2514
};
2615

src/components/Icons/Heart.tsx

Lines changed: 25 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -3,53 +3,31 @@ import type { IconsProps } from './dto';
33

44
const Heart: React.FC<IconsProps> = ({ isFilled = false }) => {
55
return (
6-
<>
7-
{isFilled ? (
8-
<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
9-
<rect x="0.5" y="0.5" width="55" height="55" rx="27.5" fill="white" />
10-
<rect x="0.5" y="0.5" width="55" height="55" rx="27.5" stroke="url(#paint0_linear_3603_1320)" />
11-
<path
12-
d="M28 34.8813L26.9125 33.8913C23.05 30.3888 20.5 28.0788 20.5 25.2438C20.5 22.9338 22.315 21.1188 24.625 21.1188C25.93 21.1188 27.1825 21.7263 28 22.6863C28.8175 21.7263 30.07 21.1188 31.375 21.1188C33.685 21.1188 35.5 22.9338 35.5 25.2438C35.5 28.0788 32.95 30.3888 29.0875 33.8988L28 34.8813Z"
13-
fill="#FF2389"
14-
/>
15-
<defs>
16-
<linearGradient
17-
id="paint0_linear_3603_1320"
18-
x1="0.56"
19-
y1="2.7451"
20-
x2="58.788"
21-
y2="6.19466"
22-
gradientUnits="userSpaceOnUse"
23-
>
24-
<stop stop-color="#FF2389" />
25-
<stop offset="1" stop-color="#F27575" />
26-
</linearGradient>
27-
</defs>
28-
</svg>
29-
) : (
30-
<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
31-
<rect x="0.5" y="0.5" width="55" height="55" rx="27.5" fill="white" />
32-
<rect x="0.5" y="0.5" width="55" height="55" rx="27.5" stroke="url(#paint0_linear_3603_1320)" />
33-
<path
34-
d="M31.375 21.1187C30.07 21.1187 28.8175 21.7262 28 22.6862C27.1825 21.7262 25.93 21.1187 24.625 21.1187C22.315 21.1187 20.5 22.9337 20.5 25.2437C20.5 28.0787 23.05 30.3887 26.9125 33.8987L28 34.8812L29.0875 33.8912C32.95 30.3887 35.5 28.0787 35.5 25.2437C35.5 22.9337 33.685 21.1187 31.375 21.1187ZM28.075 32.7812L28 32.8562L27.925 32.7812C24.355 29.5487 22 27.4112 22 25.2437C22 23.7437 23.125 22.6187 24.625 22.6187C25.78 22.6187 26.905 23.3612 27.3025 24.3887H28.705C29.095 23.3612 30.22 22.6187 31.375 22.6187C32.875 22.6187 34 23.7437 34 25.2437C34 27.4112 31.645 29.5487 28.075 32.7812Z"
35-
fill="#8E8E8E"
36-
/>
37-
<defs>
38-
<linearGradient
39-
id="paint0_linear_3603_1320"
40-
x1="0.56"
41-
y1="2.7451"
42-
x2="58.788"
43-
y2="6.19466"
44-
gradientUnits="userSpaceOnUse"
45-
>
46-
<stop stop-color="#FF2389" />
47-
<stop offset="1" stop-color="#F27575" />
48-
</linearGradient>
49-
</defs>
50-
</svg>
51-
)}
52-
</>
6+
<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
7+
<rect x="0.5" y="0.5" width="55" height="55" rx="27.5" fill="white" />
8+
<rect x="0.5" y="0.5" width="55" height="55" rx="27.5" stroke="url(#paint0_linear_3603_1320)" />
9+
<path
10+
d={
11+
isFilled
12+
? 'M28 34.8813L26.9125 33.8913C23.05 30.3888 20.5 28.0788 20.5 25.2438C20.5 22.9338 22.315 21.1188 24.625 21.1188C25.93 21.1188 27.1825 21.7263 28 22.6863C28.8175 21.7263 30.07 21.1188 31.375 21.1188C33.685 21.1188 35.5 22.9338 35.5 25.2438C35.5 28.0788 32.95 30.3888 29.0875 33.8988L28 34.8813Z'
13+
: 'M31.375 21.1187C30.07 21.1187 28.8175 21.7262 28 22.6862C27.1825 21.7262 25.93 21.1187 24.625 21.1187C22.315 21.1187 20.5 22.9337 20.5 25.2437C20.5 28.0787 23.05 30.3887 26.9125 33.8987L28 34.8812L29.0875 33.8912C32.95 30.3887 35.5 28.0787 35.5 25.2437C35.5 22.9337 33.685 21.1187 31.375 21.1187ZM28.075 32.7812L28 32.8562L27.925 32.7812C24.355 29.5487 22 27.4112 22 25.2437C22 23.7437 23.125 22.6187 24.625 22.6187C25.78 22.6187 26.905 23.3612 27.3025 24.3887H28.705C29.095 23.3612 30.22 22.6187 31.375 22.6187C32.875 22.6187 34 23.7437 34 25.2437C34 27.4112 31.645 29.5487 28.075 32.7812Z'
14+
}
15+
fill={isFilled ? '#FF2389' : '#8E8E8E'}
16+
/>
17+
<defs>
18+
<linearGradient
19+
id="paint0_linear_3603_1320"
20+
x1="0.56"
21+
y1="2.7451"
22+
x2="58.788"
23+
y2="6.19466"
24+
gradientUnits="userSpaceOnUse"
25+
>
26+
<stop stopColor="#FF2389" />
27+
<stop offset="1" stopColor="#F27575" />
28+
</linearGradient>
29+
</defs>
30+
</svg>
5331
);
5432
};
5533

src/components/Icons/Like.tsx

Lines changed: 18 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -2,38 +2,25 @@ import React from 'react';
22
import type { IconsProps } from './dto';
33

44
const Like: React.FC<IconsProps> = ({ isFilled = false, color = '' }) => {
5-
if (color && !isFilled) {
6-
// color가 빈 문자열이 아니고 isFilled가 false인 경우 (like-white)
7-
return (
8-
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
9-
<path
10-
id="Vector"
11-
d="M10.875 0.618652C9.57 0.618652 8.3175 1.22615 7.5 2.18615C6.6825 1.22615 5.43 0.618652 4.125 0.618652C1.815 0.618652 0 2.43365 0 4.74365C0 7.57865 2.55 9.88865 6.4125 13.3987L7.5 14.3812L8.5875 13.3912C12.45 9.88865 15 7.57865 15 4.74365C15 2.43365 13.185 0.618652 10.875 0.618652ZM7.575 12.2812L7.5 12.3562L7.425 12.2812C3.855 9.04865 1.5 6.91115 1.5 4.74365C1.5 3.24365 2.625 2.11865 4.125 2.11865C5.28 2.11865 6.405 2.86115 6.8025 3.88865H8.205C8.595 2.86115 9.72 2.11865 10.875 2.11865C12.375 2.11865 13.5 3.24365 13.5 4.74365C13.5 6.91115 11.145 9.04865 7.575 12.2812Z"
12-
fill={color}
13-
/>
14-
</svg>
15-
);
16-
}
17-
if (color == '' && isFilled) {
18-
// color가 빈 문자열이고 isFilled가 true인 경우 (like-fill)
19-
return (
20-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="14" viewBox="0 0 16 14" fill="none">
21-
<path
22-
d="M8 13.8813L6.9125 12.8913C3.05 9.38877 0.5 7.07877 0.5 4.24377C0.5 1.93377 2.315 0.118774 4.625 0.118774C5.93 0.118774 7.1825 0.726275 8 1.68627C8.8175 0.726275 10.07 0.118774 11.375 0.118774C13.685 0.118774 15.5 1.93377 15.5 4.24377C15.5 7.07877 12.95 9.38877 9.0875 12.8988L8 13.8813Z"
23-
fill="#FF2389"
24-
/>
25-
</svg>
26-
);
27-
}
28-
29-
// 기본값: isFilled가 false이고 color도 빈 문자열일 경우 (like)
305
return (
31-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="14" viewBox="0 0 16 14" fill="none">
32-
<path
33-
d="M11.375 0.118774C10.07 0.118774 8.8175 0.726275 8 1.68627C7.1825 0.726275 5.93 0.118774 4.625 0.118774C2.315 0.118774 0.5 1.93377 0.5 4.24377C0.5 7.07877 3.05 9.38877 6.9125 12.8988L8 13.8813L9.0875 12.8913C12.95 9.38877 15.5 7.07877 15.5 4.24377C15.5 1.93377 13.685 0.118774 11.375 0.118774ZM8.075 11.7813L8 11.8563L7.925 11.7813C4.355 8.54877 2 6.41127 2 4.24377C2 2.74377 3.125 1.61877 4.625 1.61877C5.78 1.61877 6.905 2.36127 7.3025 3.38877H8.705C9.095 2.36127 10.22 1.61877 11.375 1.61877C12.875 1.61877 14 2.74377 14 4.24377C14 6.41127 11.645 8.54877 8.075 11.7813Z"
34-
fill="#8E8E8E"
35-
/>
36-
</svg>
6+
<>
7+
{isFilled ? ( // like-fill.svg (isFilled = true)
8+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="14" viewBox="0 0 16 14" fill="none">
9+
<path
10+
d="M8 13.8813L6.9125 12.8913C3.05 9.38877 0.5 7.07877 0.5 4.24377C0.5 1.93377 2.315 0.118774 4.625 0.118774C5.93 0.118774 7.1825 0.726275 8 1.68627C8.8175 0.726275 10.07 0.118774 11.375 0.118774C13.685 0.118774 15.5 1.93377 15.5 4.24377C15.5 7.07877 12.95 9.38877 9.0875 12.8988L8 13.8813Z"
11+
fill={color}
12+
/>
13+
</svg>
14+
) : (
15+
// like.svg
16+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="14" viewBox="0 0 16 14" fill="none">
17+
<path
18+
d="M11.375 0.118774C10.07 0.118774 8.8175 0.726275 8 1.68627C7.1825 0.726275 5.93 0.118774 4.625 0.118774C2.315 0.118774 0.5 1.93377 0.5 4.24377C0.5 7.07877 3.05 9.38877 6.9125 12.8988L8 13.8813L9.0875 12.8913C12.95 9.38877 15.5 7.07877 15.5 4.24377C15.5 1.93377 13.685 0.118774 11.375 0.118774ZM8.075 11.7813L8 11.8563L7.925 11.7813C4.355 8.54877 2 6.41127 2 4.24377C2 2.74377 3.125 1.61877 4.625 1.61877C5.78 1.61877 6.905 2.36127 7.3025 3.38877H8.705C9.095 2.36127 10.22 1.61877 11.375 1.61877C12.875 1.61877 14 2.74377 14 4.24377C14 6.41127 11.645 8.54877 8.075 11.7813Z"
19+
fill="#8E8E8E"
20+
/>
21+
</svg>
22+
)}
23+
</>
3724
);
3825
};
3926

src/components/Icons/Message.tsx

Lines changed: 32 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,43 @@
11
import React from 'react';
22
import type { IconsProps } from './dto';
33

4-
const Message: React.FC<IconsProps> = ({ isFilled = false, color = '' }) => {
5-
if (!isFilled) {
6-
if (color) {
7-
// color가 주어지고 isFilled가 false인 경우 (default의 message는 color을 #8E8E8E으로, desktopNavBar의 message는 color을 black으로 )
8-
return (
9-
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
4+
// desktopNavBar의 아이콘 크기는 14, 12 / default의 아이콘 크기는 14, 14
5+
6+
const Message: React.FC<IconsProps> = ({ width = '14', height = '14', color = '', isFilled = false }) => {
7+
return (
8+
<>
9+
{isFilled ? ( // isFilled가 true일 때 원하는 색 사용 (desktopNavBar의 message-fill는 color을 black으로, default는 color을 white로)
10+
<svg
11+
xmlns="http://www.w3.org/2000/svg"
12+
width={width}
13+
height={height}
14+
viewBox={`0 0 ${width} ${height}`}
15+
fill="none"
16+
>
17+
<path
18+
d="M12.4 0.25H1.6C0.8575 0.25 0.25 0.8575 0.25 1.6V13.75L2.95 11.05H12.4C13.1425 11.05 13.75 10.4425 13.75 9.7V1.6C13.75 0.8575 13.1425 0.25 12.4 0.25Z"
19+
fill={color}
20+
/>
21+
22+
<path d="M12.2 1.8H1.8V11.4H2.8L3.4 10.8H12.2V1.8Z" fill={color} />
23+
</svg>
24+
) : (
25+
// isFilled가 false일 때 원하는 색 사용 (desktopNavBar의 message는 color을 black으로, default는 color을 #8E8E8E로, default의 message-white는 color을 white로)
26+
<svg
27+
xmlns="http://www.w3.org/2000/svg"
28+
width={width}
29+
height={height}
30+
viewBox={`0 0 ${width} ${height}`}
31+
fill="none"
32+
>
1033
<path
1134
d="M12.4 0.25H1.6C0.8575 0.25 0.25 0.8575 0.25 1.6V13.75L2.95 11.05H12.4C13.1425 11.05 13.75 10.4425 13.75 9.7V1.6C13.75 0.8575 13.1425 0.25 12.4 0.25ZM12.4 9.7H2.95L1.6 11.05V1.6H12.4V9.7Z"
1235
fill={color}
1336
/>
1437
</svg>
15-
);
16-
}
17-
}
18-
if (color && isFilled) {
19-
// isFilled가 true인 경우 (message-fill / desktopNavBar는 fill=black, default는 fill = white)
20-
return (
21-
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none">
22-
<path
23-
d="M12.4 0.25H1.6C0.8575 0.25 0.25 0.8575 0.25 1.6V13.75L2.95 11.05H12.4C13.1425 11.05 13.75 10.4425 13.75 9.7V1.6C13.75 0.8575 13.1425 0.25 12.4 0.25Z"
24-
fill={color}
25-
/>
26-
27-
<path d="M12.2 1.8H1.8V11.4H2.8L3.4 10.8H12.2V1.8Z" fill={color} />
28-
</svg>
29-
);
30-
}
31-
// 예외: 위 조건을 모두 만족하지 않는 경우, 기본적으로 아무것도 렌더링하지 않음
32-
return null;
38+
)}
39+
</>
40+
);
3341
};
3442

3543
export default Message;

src/components/Icons/MyPage.tsx

Lines changed: 22 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,34 @@
11
import React from 'react';
22
import type { IconsProps } from './dto';
33

4-
const MyPage: React.FC<IconsProps> = ({ isFilled = false, color = '' }) => {
5-
if (!isFilled) {
6-
if (color) {
7-
// color가 주어지고 isFilled가 false인 경우 (default의 my-page는 color을 #8E8E8E으로, desktopNavBar의 my-page는 color을 black으로 )
8-
return (
4+
const MyPage: React.FC<IconsProps> = ({ color = '', isFilled = false }) => {
5+
return (
6+
<>
7+
{isFilled ? ( // isFilled가 true일 때 원하는 색 사용 (desktopNavBar의 my-page-fill은 color을 black으로, default는 color을 white로)
98
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
109
<path
1110
d="M8 1.9C9.16 1.9 10.1 2.84 10.1 4C10.1 5.16 9.16 6.1 8 6.1C6.84 6.1 5.9 5.16 5.9 4C5.9 2.84 6.84 1.9 8 1.9ZM8 10.9C10.97 10.9 14.1 12.36 14.1 13V14.1H1.9V13C1.9 12.36 5.03 10.9 8 10.9ZM8 0C5.79 0 4 1.79 4 4C4 6.21 5.79 8 8 8C10.21 8 12 6.21 12 4C12 1.79 10.21 0 8 0ZM8 9C5.33 9 0 10.34 0 13V16H16V13C16 10.34 10.67 9 8 9Z"
1211
fill={color}
1312
/>
14-
</svg>
15-
);
16-
}
17-
}
18-
if (color && isFilled) {
19-
// isFilled가 true인 경우 (my-page-fill / desktopNavBar는 fill=black, default는 fill = white)
20-
return (
21-
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
22-
<path
23-
d="M8 1.9C9.16 1.9 10.1 2.84 10.1 4C10.1 5.16 9.16 6.1 8 6.1C6.84 6.1 5.9 5.16 5.9 4C5.9 2.84 6.84 1.9 8 1.9ZM8 10.9C10.97 10.9 14.1 12.36 14.1 13V14.1H1.9V13C1.9 12.36 5.03 10.9 8 10.9ZM8 0C5.79 0 4 1.79 4 4C4 6.21 5.79 8 8 8C10.21 8 12 6.21 12 4C12 1.79 10.21 0 8 0ZM8 9C5.33 9 0 10.34 0 13V16H16V13C16 10.34 10.67 9 8 9Z"
24-
fill={color}
25-
/>
2613

27-
<path
28-
d="M8 1.9C9.16 1.9 10.1 2.84 10.1 4C10.1 5.16 9.16 6.1 8 6.1C6.84 6.1 5.9 5.16 5.9 4C5.9 2.84 6.84 1.9 8 1.9Z"
29-
fill={color}
30-
stroke={color}
31-
/>
32-
<path d="M8 9C5.33 9 0 10.34 0 13V16H16V13C16 10.34 10.67 9 8 9Z" fill={color} />
33-
</svg>
34-
);
35-
}
36-
// 예외: 위 조건을 모두 만족하지 않는 경우, 기본적으로 아무것도 렌더링하지 않음
37-
return null;
14+
<path
15+
d="M8 1.9C9.16 1.9 10.1 2.84 10.1 4C10.1 5.16 9.16 6.1 8 6.1C6.84 6.1 5.9 5.16 5.9 4C5.9 2.84 6.84 1.9 8 1.9Z"
16+
fill={color}
17+
stroke={color}
18+
/>
19+
<path d="M8 9C5.33 9 0 10.34 0 13V16H16V13C16 10.34 10.67 9 8 9Z" fill={color} />
20+
</svg>
21+
) : (
22+
// isFilled가 false일 때 원하는 색 사용 (desktopNavBar의 my-page는 color을 black으로, default는 color을 #8E8E8E로, default의 my-page-white는 color을 white로)
23+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none">
24+
<path
25+
d="M8 1.9C9.16 1.9 10.1 2.84 10.1 4C10.1 5.16 9.16 6.1 8 6.1C6.84 6.1 5.9 5.16 5.9 4C5.9 2.84 6.84 1.9 8 1.9ZM8 10.9C10.97 10.9 14.1 12.36 14.1 13V14.1H1.9V13C1.9 12.36 5.03 10.9 8 10.9ZM8 0C5.79 0 4 1.79 4 4C4 6.21 5.79 8 8 8C10.21 8 12 6.21 12 4C12 1.79 10.21 0 8 0ZM8 9C5.33 9 0 10.34 0 13V16H16V13C16 10.34 10.67 9 8 9Z"
26+
fill={color}
27+
/>
28+
</svg>
29+
)}
30+
</>
31+
);
3832
};
3933

4034
export default MyPage;

src/components/Icons/dto.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,5 @@ export interface IconsProps {
22
width?: string;
33
height?: string;
44
color?: string;
5-
isActive?: boolean;
65
isFilled?: boolean;
76
}

0 commit comments

Comments
 (0)