From d1e23759e8bebe1357c440d4316b4fb066fd901c Mon Sep 17 00:00:00 2001
From: novice1993 <novice1993@gmail.com>
Date: Sat, 9 Sep 2023 14:35:53 +0900
Subject: [PATCH] =?UTF-8?q?[Design]=20=EC=A3=BC=EA=B0=80=EC=84=A0=ED=83=9D?=
 =?UTF-8?q?=20=EA=B4=80=EB=A0=A8=20=EC=95=A0=EB=8B=88=EB=A9=94=EC=9D=B4?=
 =?UTF-8?q?=EC=85=98=20=ED=9A=A8=EA=B3=BC=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 주식주문 창의 주가 리스트에서 특정 주가 클릭 시 발생하는 애니메이션 효과 추가

Issues #17
---
 client/src/components/CentralChartMenu/Index.tsx      |  6 ++----
 .../src/components/StockOrderSection/StockPrice.tsx   | 11 ++++++++---
 client/src/reducer/CompanyId-Reducer.ts               |  4 +++-
 3 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/client/src/components/CentralChartMenu/Index.tsx b/client/src/components/CentralChartMenu/Index.tsx
index fe8d23f2..5a7e2ad4 100644
--- a/client/src/components/CentralChartMenu/Index.tsx
+++ b/client/src/components/CentralChartMenu/Index.tsx
@@ -4,10 +4,8 @@ import { StateProps } from "../../models/stateProps";
 
 import ExpandScreenBtn from "./ExpandScreenBtn";
 import StockOverview from "./StockOverview";
-import BookmarkBtn from "./BookmarkBtn";
 import StockOrderBtn from "./StockOrderBtn";
 import CompareChartBtn from "./CompareChartBtn";
-import ChangeChartCycleBtn from "./ChangeChartCycleBtn";
 
 const UpperMenuBar = () => {
   const companyId = useSelector((state: StateProps) => state.companyId);
@@ -21,7 +19,7 @@ const UpperMenuBar = () => {
         ) : (
           <>
             <StockOverview />
-            <BookmarkBtn />
+            {/* <BookmarkBtn /> */}
             <StockOrderBtn type="buying" />
             <StockOrderBtn type="selling" />
           </>
@@ -30,7 +28,7 @@ const UpperMenuBar = () => {
       </div>
       <div className="SecondLine">
         <CompareChartBtn />
-        <ChangeChartCycleBtn />
+        {/* <ChangeChartCycleBtn /> */}
       </div>
     </Container>
   );
diff --git a/client/src/components/StockOrderSection/StockPrice.tsx b/client/src/components/StockOrderSection/StockPrice.tsx
index 5bfd5a42..8db404ce 100644
--- a/client/src/components/StockOrderSection/StockPrice.tsx
+++ b/client/src/components/StockOrderSection/StockPrice.tsx
@@ -1,7 +1,7 @@
-import { useState, useEffect } from "react";
 import useGetStockData from "../../hooks/useGetStockData";
 import { StockProps } from "../../models/stockProps";
 
+import { useState, useEffect } from "react";
 import { useSelector, useDispatch } from "react-redux";
 import { styled } from "styled-components";
 import { setStockOrderPrice } from "../../reducer/StockOrderPrice-Reducer";
@@ -98,10 +98,15 @@ const Container = styled.div<{ index: number; price: number; orderPrice: number
   height: 36px;
   margin-bottom: 2px;
   background-color: ${(props) => (props.index > 4 ? "#FDE8E7" : "#E7F0FD")};
-  border: ${(props) => (props.index === 4 ? "1px solid #2F4F4F" : "none")};
-  border-left: ${(props) => (props.price === props.orderPrice ? "3px solid red" : props.index > 9 ? "3px solid #FDE8E7" : "3px solid #E7F0FD")};
+  border: ${(props) => (props.price === props.orderPrice ? "1.5px solid #2F4F4F" : "none")};
+  border-left: ${(props) => (props.price === props.orderPrice ? "3px solid red" : props.index > 4 ? "3px solid #FDE8E7" : "3px solid #E7F0FD")};
   display: flex;
   flex-direction: row;
+  transition: border 1s ease;
+
+  &:hover {
+    cursor: pointer;
+  }
 `;
 
 const Price = styled.div`
diff --git a/client/src/reducer/CompanyId-Reducer.ts b/client/src/reducer/CompanyId-Reducer.ts
index c811f963..07e39c2f 100644
--- a/client/src/reducer/CompanyId-Reducer.ts
+++ b/client/src/reducer/CompanyId-Reducer.ts
@@ -1,6 +1,8 @@
 import { createSlice } from "@reduxjs/toolkit";
 
-const initialState: number = 0;
+// 🟢 코스피 API 요청 500번 에러로 인한 임시수정
+// const initialState: number = 0;
+const initialState: number = 1;
 
 const companyIdSlice = createSlice({
   name: "companyId",