From 528f0ace2dc54b967ce0eda91c079e3b4e738689 Mon Sep 17 00:00:00 2001
From: Sinji <sinzi031012@naver.com>
Date: Mon, 9 Oct 2023 23:45:20 +0900
Subject: [PATCH] Feat: Create SelectTypePage #103

---
 src/pages/SelectTypePage.js | 70 +++++++++++++++++++++++++++++++++++++
 1 file changed, 70 insertions(+)
 create mode 100644 src/pages/SelectTypePage.js

diff --git a/src/pages/SelectTypePage.js b/src/pages/SelectTypePage.js
new file mode 100644
index 00000000..e4ee1d7a
--- /dev/null
+++ b/src/pages/SelectTypePage.js
@@ -0,0 +1,70 @@
+import styled from "styled-components";
+import { COLOR } from "../styles/color.js";
+import { useRecoilValue } from "recoil";
+import { Button } from "@mui/material";
+import Stack from "@mui/material/Stack";
+import propTypes from "prop-types";
+import { useNavigate } from "react-router-dom";
+
+function SelectTypePage(){
+    const navigate = new useNavigate();
+
+  return(
+    <StSelectTypePage>
+      <Stack spacing={2} direction="row">
+        <CreateBox>
+                Create New Repo
+          <CreateBtn variant="contained" onClick={() => navigate("/step1")}>
+            Choose
+          </CreateBtn>
+        </CreateBox>
+        <CheckBox>
+                Check Open-Source Repo
+          <CheckBtn variant="contained" onClick={() => navigate("/step1")}>
+            Choose
+          </CheckBtn>
+        </CheckBox>
+      </Stack>
+    </StSelectTypePage>
+  );
+
+}
+
+const StSelectTypePage = styled.div`
+  width: 100%;
+  height: 100%;
+`;
+
+const CreateBox = styled.div`
+display: flex;
+flex-direction: row;
+width: 45rem;
+height: 35rem;
+margin: auto;
+background-color: red;
+`;
+
+const CheckBox = styled.div`
+display: flex;
+flex-direction: row;
+width: 45rem;
+height: 35rem;
+margin: auto;
+background-color: red;
+`;
+
+const CreateBtn = styled(Button)({
+  backgroundColor: `${COLOR.MAIN_PURPLE}`,
+  "&:hover": {
+    backgroundColor: `${COLOR.MAIN_PURPLE}`,
+  },
+});
+
+const CheckBtn = styled(Button)({
+  backgroundColor: "black",
+  "&:hover": {
+    backgroundColor: "black",
+  },
+});
+
+export default SelectTypePage;