Skip to content

Commit a76c8c1

Browse files
authored
Merge pull request #293 from FunD-StockProject/develop
V3.11 배포
2 parents b48b161 + fb69dc9 commit a76c8c1

File tree

14 files changed

+116
-65
lines changed

14 files changed

+116
-65
lines changed
Lines changed: 3 additions & 0 deletions
Loading

src/components/CardList/CardList.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,11 @@ const CardList = ({ name, country }: { name: StockType; country: STOCK_COUNTRY }
1212
const isMobile = useIsMobile();
1313
const [curStocks, suspend] = useQuery({ query: StockFetchQuery(name, country) });
1414

15-
console.log(suspend);
16-
1715
return (
1816
suspend ||
1917
(curStocks && (
2018
<SlideView
19+
key={`${name}_${country}`}
2120
keyName={name}
2221
list={isHot ? StockHot(curStocks, country) : StockRisingDescend(curStocks, country)}
2322
count={isHot ? 1 : !isMobile ? 3 : 1}

src/components/Home/Keywords/Keywords.style.tsx

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -51,10 +51,6 @@ const Title = styled.div({
5151
});
5252

5353
const KeywordList = styled.div({
54-
display: 'flex',
55-
alignItems: 'center',
56-
gap: '8px',
57-
alignSelf: 'stretch',
5854
overflow: 'auto',
5955
whiteSpace: 'nowrap',
6056
msOverflowStyle: 'none',
@@ -66,22 +62,33 @@ const KeywordList = styled.div({
6662
},
6763
});
6864

65+
const KeywordItemConainer = styled.div({
66+
width: '100%',
67+
display: 'flex',
68+
alignItems: 'center',
69+
justifyContent: 'center',
70+
gap: '12px',
71+
[media[0]]: {
72+
gap: '8px',
73+
justifyContent: 'start',
74+
},
75+
});
76+
6977
const KeywordItem = styled.div({
7078
color: theme.colors.primary0,
7179
backgroundColor: theme.colors.grayscale100,
7280
textAlign: 'right',
7381
fontFamily: 'Pretendard', // Corrected camelCase syntax
7482
fontSize: '19px', // Corrected camelCase syntax
75-
fontStyle: 'normal',
7683
fontWeight: 700,
7784

78-
padding: '12px 20px',
85+
padding: '8px 24px',
7986
borderRadius: '30px',
80-
border: `1px solid ${theme.colors.grayscale100}`,
8187

8288
[media[0]]: {
83-
fontSize: '16px',
89+
fontSize: '13px',
90+
padding: '8px 12px',
8491
},
8592
});
8693

87-
export { KeywordsContainer, TitleWrapper, Title, KeywordList, KeywordItem };
94+
export { KeywordsContainer, TitleWrapper, Title, KeywordList, KeywordItemConainer, KeywordItem };

src/components/Home/Keywords/Keywords.tsx

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,14 @@ import { useQuery } from '@hooks/useQuery';
44
import KeywordPopUp from '@components/PopUp/KeywordPopUp/KeywordPopUp';
55
import { KeywordsQuery } from '@controllers/query';
66
import InfoSVG from '@assets/info.svg?react';
7-
import { KeywordItem, KeywordList, KeywordsContainer, Title, TitleWrapper } from './Keywords.style';
7+
import {
8+
KeywordItem,
9+
KeywordItemConainer,
10+
KeywordList,
11+
KeywordsContainer,
12+
Title,
13+
TitleWrapper,
14+
} from './Keywords.style';
815

916
const Keywords = ({ country }: { country: string }) => {
1017
const [keywords, suspend] = useQuery({ query: KeywordsQuery(country) });
@@ -23,13 +30,15 @@ const Keywords = ({ country }: { country: string }) => {
2330
<span>매일 {updateTime}시 업데이트됩니다.</span>
2431
</TitleWrapper>
2532
<KeywordList>
26-
{suspend ||
27-
(keywords &&
28-
keywords.map((keyword: string, index: number) => (
29-
<KeywordItem key={index} onClick={() => {}}>
30-
{keyword.toLocaleUpperCase()}
31-
</KeywordItem>
32-
)))}
33+
<KeywordItemConainer>
34+
{suspend ||
35+
(keywords &&
36+
keywords.map((keyword: string, index: number) => (
37+
<KeywordItem key={index} onClick={() => {}}>
38+
{keyword.toLocaleUpperCase()}
39+
</KeywordItem>
40+
)))}
41+
</KeywordItemConainer>
3342
</KeywordList>
3443
{isPopupOpen && <KeywordPopUp onClose={togglePopup} />}
3544
</KeywordsContainer>

src/components/Home/StockTable/StockTable.style.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -114,6 +114,7 @@ const TableRow = styled.div({
114114
padding: '12px 0',
115115
color: theme.colors.primary0,
116116
borderBottom: `1px solid ${theme.colors.grayscale90}`, // 행 구분선 추가
117+
cursor: 'pointer',
117118
':last-child': {
118119
borderBottom: 'none',
119120
},
@@ -126,9 +127,6 @@ const StockInfo = styled.div({
126127
justifyContent: 'center',
127128
textAlign: 'left',
128129
gap: '8px',
129-
[media[0]]: {
130-
justifyContent: 'start',
131-
},
132130
});
133131

134132
const StockLogo = styled.div({

src/components/PopUp/CommonPopUp.style.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,7 @@ const PopUpContent = styled('div')({
5858
fontStyle: 'normal',
5959
fontWeight: '500',
6060
lineHeight: '1.5',
61+
whiteSpace: 'break-spaces',
6162
color: theme.colors.grayscale100,
6263
});
6364

src/components/PopUp/FearPopUp/FearPopUp.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ const FearPopUp = ({ onClose }: { onClose: () => void }) => (
77
<PopUpContent>
88
<div>
99
공포탐욕지수는 시장의 7가지 요인을 분석하여
10-
<StyledSpan> 현재 투자자들의 심리를 극단적인 공포(0)부터 극단적인 탐욕(100)</StyledSpan>
11-
이르기까지를 가늠하는 심리지표입니다.
10+
<StyledSpan> 현재 투자자들의 심리를 극단적인 공포(0)부터 극단적인 탐욕(100)</StyledSpan> 이르기까지를 가늠하는
11+
심리지표입니다.
1212
</div>
1313
</PopUpContent>
1414
</CommonPopUp>

src/components/Search/StockChart/StockChart.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -868,6 +868,7 @@ const StockChartView = ({
868868

869869
const handleCanvasMouseLeave = () => {
870870
setIsMouseEnter(false);
871+
setMousePosInfo(null);
871872
};
872873

873874
const handlePriceCanvasMouseMove = (e: MouseEvent) => {

src/components/SearchBar/SearchBar.Style.ts

Lines changed: 24 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,9 @@ export const SearchBarSelectBox = styled.div(
7878
position: 'relative',
7979
display: 'flex',
8080
width: '50%',
81+
8182
['label']: {
83+
cursor: 'pointer',
8284
fontSize: '17px',
8385
borderRadius: '8px',
8486
padding: '18px',
@@ -138,6 +140,7 @@ export const SearchBarSelectBox = styled.div(
138140

139141
export const SearchBarSelectBoxItems = styled.ul(
140142
{
143+
cursor: 'pointer',
141144
position: 'absolute',
142145
zIndex: '20',
143146
top: '100%',
@@ -329,34 +332,39 @@ export const SearchBarResultItemContainer = styled.div({
329332
padding: '9px 12px 9px 18px',
330333
borderRadius: '0 32px 32px 0',
331334
cursor: 'pointer',
332-
// height: '24px',
333-
334-
['> svg']: {
335-
width: '11px',
336-
height: '11px',
337-
cursor: 'pointer',
338-
borderRadius: '24px',
339-
padding: '4px',
340-
[':hover']: {
341-
background: theme.colors.grayscale70,
342-
},
343-
},
335+
fontSize: '18px',
344336

345337
[':hover']: {
346338
background: theme.colors.grayscale100,
347-
['> svg']: {
339+
['svg']: {
348340
stroke: theme.colors.primary5,
349341
},
350342
},
351343

352344
[media[0]]: {
345+
fontSize: '15px',
353346
padding: '6px 9px 6px 12px',
354347
// height: '18px',
355348
gap: '8px',
349+
},
350+
});
351+
352+
export const SearchBarResultItemSVG = styled.div({
353+
lineHeight: 1,
354+
height: 'auto',
355+
display: 'flex',
356+
alignItems: 'center',
357+
['> svg']: {
358+
width: '.9em',
359+
height: '.9em',
360+
cursor: 'pointer',
361+
borderRadius: '24px',
362+
[':hover']: {
363+
background: theme.colors.grayscale70,
364+
},
365+
},
366+
[media[0]]: {
356367
['> svg']: {
357-
padding: '2px',
358-
width: '16px',
359-
height: '16px',
360368
stroke: theme.colors.primary5,
361369
},
362370
},

src/components/SearchBar/SearchBar.tsx

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import {
2222
SearchBarResultGridContainer,
2323
SearchBarResultItemContainer,
2424
SearchBarResultItemKeyword,
25+
SearchBarResultItemSVG,
2526
SearchBarResultItemSubtitle,
2627
SearchBarResultItemTitle,
2728
SearchBarResultLayout,
@@ -166,13 +167,15 @@ const SearchBarItemsComponent = ({
166167
)}
167168
</SearchBarResultItemTitle>
168169
{type === 'RECENT' && (
169-
<CancelSVG
170-
onPointerUp={(e) => {
171-
e.preventDefault();
172-
e.stopPropagation();
173-
onItemDelete(item);
174-
}}
175-
/>
170+
<SearchBarResultItemSVG>
171+
<CancelSVG
172+
onPointerUp={(e) => {
173+
e.preventDefault();
174+
e.stopPropagation();
175+
onItemDelete(item);
176+
}}
177+
/>
178+
</SearchBarResultItemSVG>
176179
)}
177180
{type === 'SEARCHED' && category == 'KEYWORD' && (
178181
<>

0 commit comments

Comments
 (0)