refactor : retouch

Team-INSERT · Aug 26, 2023 · 0651c7d · 0651c7d
1 parent 4ebbadc
commit 0651c7d
Show file tree

Hide file tree

Showing 11 changed files with 40 additions and 227 deletions.
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -2,7 +2,6 @@ import Header from "components/Header";
 import Footer from "components/Footer";
 import History from "pages/layouts/History";
 import HomePage from "pages/layouts/HomePage";
-import TimeLine from "pages/layouts/TimeLine";
 import Member from "pages/layouts/Member";
 import Service from "pages/layouts/Service";
 
@@ -13,7 +12,6 @@ function Home() {
       <HomePage />
       <History />
       <Service />
-      <TimeLine />
       <Member />
       <Footer />
     </>

diff --git a/src/pages/layouts/History/index.tsx b/src/pages/layouts/History/index.tsx
@@ -3,9 +3,10 @@ import * as S from "./style";
 function HistoryPage() {
   const { title, introduce1, introduce2 } = {
     title: "학교와 함께 역사를 써내려갑니다.",
-    introduce1: "INSERT는 2023년 3월에 만들어진 부산 소마고 전공동아리 입니다.",
+    introduce1:
+      "INSERT는 2023년 3월에 만들어진 부산소프트웨어마이스터고등학교의 전공동아리입니다.",
     introduce2:
-      "저희는 학교 플랫폼 개발 동아리로 학교 커뮤니티를 발전시키는 프로젝트를 진행합니다.",
+      "학생들의 편리한 학교 생활을 위해, 교내 학생들과 관련된 모든 서비스들을 제공합니다.",
   };
 
   return (

diff --git a/src/pages/layouts/HomePage/index.tsx b/src/pages/layouts/HomePage/index.tsx
@@ -6,8 +6,8 @@ function HomePage() {
   const middle = [
     { id: 1, title: "작성한 코드 라인", value: 168257 },
     { id: 2, title: "웹 페이지 조회수", value: 560257 },
-    { id: 3, title: "총 커밋 횟수", value: 2358 },
-    { id: 4, title: "함께한 시간", value: 2650 },
+    { id: 3, title: "총 커밋 횟수", value: 3658 },
+    { id: 4, title: "함께한 시간", value: 5652 },
   ];
 
   return (

diff --git a/src/pages/layouts/Member/index.tsx b/src/pages/layouts/Member/index.tsx
@@ -1,14 +1,17 @@
 import { useEffect, useState } from "react";
 import { requestMember } from "apis/getGithubMember";
 import MemberType from "types/MemberType";
+import { changeGenString } from "utils/changeGenString";
 import * as S from "./style";
 
 function Member() {
   type Tech = string[];
   type Gen = string[];
 
   const techs = ["Frontend", "Backend"];
-  const gens = ["1st", "2nd", "3rd", "4th", "5th"];
+  const gens = Array.from({ length: new Date().getFullYear() - 2020 }).map(
+    (_, i) => changeGenString(i + 1),
+  );
 
   const [tech, setTech] = useState<Tech>([]);
   const [gen, setGen] = useState<Gen>([]);
@@ -33,11 +36,6 @@ function Member() {
     getMember();
   }, []);
 
-  const clearFilter = () => {
-    setTech([]);
-    setGen([]);
-  };
-
   const active = (filter: Tech | Gen, item: string) => {
     if (filter.includes(item)) {
       const notActive = filter.filter((activeItem) => activeItem !== item);
@@ -71,16 +69,10 @@ function Member() {
   return (
     <S.MemberLayout id="member">
       <S.MemberContainer>
-        <S.MemberTitle>멤버</S.MemberTitle>
+        <S.MemberTitle>인서트의 멤버들을 소개합니다</S.MemberTitle>
         <S.MemberHr />
         <S.MemberMain>
           <S.MemberFilter>
-            <S.FilterButton
-              isActive={!tech.length && !gen.length}
-              onClick={() => clearFilter()}
-            >
-              All
-            </S.FilterButton>
             <S.FilterTitle>Tech</S.FilterTitle>
             {techs.map((techItem) => (
               <S.FilterButton
@@ -90,7 +82,7 @@ function Member() {
                 {techItem.replace("Developer", "")}
               </S.FilterButton>
             ))}
-            <S.FilterTitle>Gen</S.FilterTitle>
+            <S.FilterTitle>Generation</S.FilterTitle>
             {gens.map((genItem) => (
               <S.FilterButton
                 isActive={gen.includes(genItem)}
@@ -132,7 +124,6 @@ function Member() {
                   </S.MemberProfile>
                 </S.MemberMiddle>
               ))}
-            {loadingError && <S.Error>{loadingError}</S.Error>}
           </S.Member>
         </S.MemberMain>
       </S.MemberContainer>

diff --git a/src/pages/layouts/Member/style.ts b/src/pages/layouts/Member/style.ts
@@ -52,7 +52,7 @@ export const MemberFilter = styled.div`
 `;
 
 export const FilterTitle = styled.div`
-  ${font.H2};
+  ${font.H4};
   color: ${color.black};
   margin-top: 30%;
 `;
@@ -64,6 +64,8 @@ export const FilterButton = styled.div<{ isActive: boolean }>`
   padding: 3px 6px;
   ${font.H4};
   margin-top: 25%;
+  margin-right: auto;
+  margin-left: 8%;
   color: #ced4da;
   &:first-child {
     margin-top: 50%;

diff --git a/src/pages/layouts/Service/index.tsx b/src/pages/layouts/Service/index.tsx
@@ -7,46 +7,48 @@ function Service() {
       logo: I.BSM,
       url: "https://bssm.kro.kr/",
       title: "BSM",
-      subtitle: "기술스택 : Next.JS, TypeScript",
       contributor: [I.ubin, I.sewon, I.hyunjun, I.jacobhboy, I.hohyun],
+      description:
+        "BSM은 교내 학생 정보 관리 서비스입니다.\n\n동아리실 예약이나 기숙사 입사 체크, 커뮤니티, 대나무숲, 급식,\n일정표, 시간표 등 그 외에도 여러가지의 서비스를 제공합니다.\n현재 전교생 중 96% 이상의 재학생들이 해당 서비스를 사용하고 있습니다.",
     },
     {
       logo: I.bumawiki,
       url: "https://buma.wiki/",
-      title: "부마위키",
-      subtitle: "기술스택 : Next.JS, TypeScript",
+      title: "BUMAWIKI",
       contributor: [I.ubin, I.sewon, I.jacobhboy, I.hohyun],
+      description:
+        "부마위키는 교내 학생들만이 사용할 수 있는 우리 학교만의 위키입니다. 여러가지 사건사고나 인물을 다루는 문서들을 편집, 생성할 수 있습니다.\n\n부마위키는 출시 후 2개월도 안 되어 \n구글 애널리틱스 분석 기준 웹 사이트 조회수 30만회를 기록했습니다.",
     },
     {
       logo: I.BSSMportfolio,
       url: "https://portfolio.bssm.io/",
-      title: "포토폴리오",
-      subtitle: "기술스택 : Next.JS, TypeScript",
+      title: "BSSM Portfolio",
       contributor: [I.jimin],
+      description:
+        "학생들이 본인들이 만든 포트폴리오 웹사이트를 업로드하고 \n이를 서로 공유할 수 있는 교내 플랫폼입니다.\n\n실제로 취업과 관련된 산학 선생님들께서 회사와 협약을 맺을 때\n이 사이트를 사용하여 학생들의 포트폴리오를 보여주십니다.",
     },
   ];
 
   return (
     <S.Container id="service">
-      <S.Title>사용할 수 있는 서비스를 제공합니다</S.Title>
-      <S.SubTitle>
-        INSERT는 부산 소프트웨어 마이스터고 학생들에게 필요한 서비스를
-        제공합니다.
-      </S.SubTitle>
+      <S.Title>학생들을 위한 서비스를 제공합니다</S.Title>
+      <S.SubTitle>교내 학생들에게 꼭 필요한 서비스들을 제공합니다.</S.SubTitle>
       {projects.map((project) => (
         <S.ProjectLayout href={project.url}>
           <S.ProjectAnchor>
             <S.ProjectLogo src={project.logo} />
           </S.ProjectAnchor>
           <S.ProjectContentsLayout>
             <S.ProjectTitle>{project.title}</S.ProjectTitle>
-            <S.ProjectSubTitle>{project.subtitle}</S.ProjectSubTitle>
-            <S.ProjectSubTitle>Contributors</S.ProjectSubTitle>
-            <S.Contributors>
-              {project.contributor.map((contributor) => (
-                <S.Contributor src={contributor} />
-              ))}
-            </S.Contributors>
+            <S.ProjectSubTitle>{project.description}</S.ProjectSubTitle>
+            <S.ContributorsLayout>
+              <S.ProjectSubTitle>Contributors</S.ProjectSubTitle>
+              <S.Contributors>
+                {project.contributor.map((contributor) => (
+                  <S.Contributor src={contributor} />
+                ))}
+              </S.Contributors>
+            </S.ContributorsLayout>
           </S.ProjectContentsLayout>
         </S.ProjectLayout>
       ))}

diff --git a/src/pages/layouts/Service/style.ts b/src/pages/layouts/Service/style.ts
@@ -40,16 +40,20 @@ export const ProjectTitle = styled.div`
 export const ProjectSubTitle = styled.div`
   ${font.H5}
   color: ${color.text};
+  white-space: pre-wrap;
+`;
 
-  &:nth-child(2) {
-    margin-bottom: 23%;
-  }
+export const ContributorsLayout = styled.div`
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
 `;
 
 export const ProjectContentsLayout = styled.div`
   display: flex;
   flex-direction: column;
   width: 50%;
+  justify-content: space-between;
 `;
 
 export const ProjectLayout = styled.a`

diff --git a/src/pages/layouts/TimeLine/data.json b/src/pages/layouts/TimeLine/data.json
diff --git a/src/pages/layouts/TimeLine/index.tsx b/src/pages/layouts/TimeLine/index.tsx