fix :: 버튼 width 수정 및 엑셀 업로드 인풋 추가

src/App.tsx

@@ -1,6 +1,6 @@
 import { QueryClient, QueryClientProvider } from "react-query";
 import GlobalStyle from "./style/GlobalStyle";
-import { HashRouter as Router } from "react-router-dom";
+// import { HashRouter as Router } from "react-router-dom";
 import MainRouter from "./router/MainRouter";
 import { BrowserRouter } from "react-router-dom";
 import { ThemeProvider } from "styled-components";

src/components/main/ExcelHeader.tsx

@@ -1,21 +1,36 @@
 import styled from "styled-components";
 import ExcelTab from "./ExcelTab";
 import { ExcelTabItemType } from "../../constants/main";
+import { useRef } from "react";
 
 interface ExcelHeaderProps {
   clickItemInfo: ExcelTabItemType;
   setClickItemInfo: React.Dispatch<React.SetStateAction<ExcelTabItemType>>;
 }
 
 const ExcelHeader = ({ clickItemInfo, setClickItemInfo }: ExcelHeaderProps) => {
+  const ref = useRef<HTMLInputElement>(null);
+
   return (
     <Container>
       <ExcelTab
         clickItemInfo={clickItemInfo}
         setClickItemInfo={setClickItemInfo}
       />
       <ButtonBox>
-        <ExcelUploadButton>엑셀파일 업로드</ExcelUploadButton>
+        <ExcelUploadButton
+          onClick={() => {
+            ref.current!.click();
+          }}
+        >
+          엑셀파일 업로드
+        </ExcelUploadButton>
+        <input
+          style={{ display: "none" }}
+          type="file"
+          ref={ref}
+          onChange={() => ""}
+        />
         <ExcelOutputButton>엑셀파일 출력</ExcelOutputButton>
       </ButtonBox>
     </Container>
@@ -33,8 +48,7 @@ const ButtonBox = styled.div`
 `;
 
 const ExcelUploadButton = styled.button`
-  width: 9vw;
-  min-width: 114px;
+  width: 133px;
   height: 40px;
   border-radius: 8px;
   font-weight: 500;
@@ -47,8 +61,7 @@ const ExcelUploadButton = styled.button`
 `;
 
 const ExcelOutputButton = styled.button`
-  width: 9vw;
-  min-width: 100px;
+  width: 133px;
   height: 40px;
   border-radius: 8px;
   font-weight: 500;