Merge pull request #28 from Fastcampus-Youcandoit/feature/#3

feat: wiki 레이아웃 작업

src/components/wiki/MarkdownEditor.tsx

@@ -39,4 +39,4 @@ const MarkdownEditor = ({ content = "", editorRef }: Props) => {
   );
 };
 
-export default MarkdownEditor;
+export default MarkdownEditor;

src/components/wiki/WikiComponent.tsx

@@ -0,0 +1,73 @@
+import { useState } from "react";
+import styled from "styled-components";
+import writeIcon from "../../assets/icons/wiki_icon/wiki_write_icon.png";
+
+const WikiContentBox = styled.div`
+  width: 75vw;
+  font-family: "NotoSansKR-Regular";
+`;
+
+const WikiHeader = styled.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 25px;
+`;
+
+const WikiMainText = styled.span`
+  font-size: 25px;
+  font-family: "NotoSansKR-bold";
+`;
+
+const WriteIcon = styled.img`
+  width: 2.5rem;
+  height: 2.5rem;
+`;
+
+const WikiContent = styled.div`
+  width: 100%;
+  height: 70vh;
+  border: 1px solid #d2d2d2;
+  border-radius: 5px;
+  background-color: #f6f7f9;
+  margin-top: 10px;
+  align-items: center;
+  display: flex;
+  justify-content: center;
+  box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5);
+`;
+
+const WikiFooter = styled.div`
+  margin-top: 10px;
+`;
+
+const ModificationDate = styled.span`
+  font-size: 15px;
+`;
+
+const WikiComponent = () => {
+  const [WikiMainTexts] = useState([
+    "회사내규",
+    "팀 소개",
+    "조직도",
+    "진행중인 프로젝트",
+    "예정된 프로젝트",
+    "완료된 프로젝트",
+    "신입사원 필독서",
+    "온보딩 주제",
+  ]);
+  return (
+    <WikiContentBox>
+      <WikiHeader>
+        <WikiMainText>{WikiMainTexts[0]}</WikiMainText>
+        <WriteIcon src={writeIcon} alt="글작성 아이콘" />
+      </WikiHeader>
+      <WikiContent>View</WikiContent>
+      <WikiFooter>
+        <ModificationDate>최종 수정일 : </ModificationDate>
+      </WikiFooter>
+    </WikiContentBox>
+  );
+};
+
+export default WikiComponent;

src/components/wiki/office-life/CompanyRules.tsx

@@ -1,5 +1,7 @@
+import WikiComponent from "../WikiComponent";
+
 const CompanyRules = () => {
-  return <div>회사내규 내용</div>;
+  return <WikiComponent />;
 };
 
 export default CompanyRules;

src/pages/Gallery.tsx

@@ -21,9 +21,9 @@ const Gallery = () => {
     <GalleryWrapper>
       <GallerySideBar />
       <Outlet />
-      {/* <GallerySection isModalChange={isModalChange} /> */}
+      <GallerySection isModalChange={isModalChange} />
       {/* Modal */}
-      {/* {isModal && <GalleryModal isModalChange={isModalChange} />} */}
+      {isModal && <GalleryModal isModalChange={isModalChange} />}
     </GalleryWrapper>
   );
 };

src/pages/Wiki.tsx

@@ -1,6 +1,7 @@
 import styled from "styled-components";
 import { Outlet } from "react-router-dom";
 import { WikiSideBar } from "../components/sidebar/SideBar";
+import Footer from "../components/common/Footer";
 
 const WikiWrapper = styled.div`
   display: flex;
@@ -11,6 +12,7 @@ const Wiki = () => {
     <WikiWrapper>
       <WikiSideBar />
       <Outlet />
+      <Footer />
     </WikiWrapper>
   );
 };