⚡️ :: 자잘한 수정

StuBee2 · Oct 22, 2023 · b4eeba0 · b4eeba0
1 parent be9737a
commit b4eeba0
Show file tree

Hide file tree

Showing 35 changed files with 239 additions and 227 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -20,6 +20,7 @@
     "@types/react-router-dom": "^5.3.3",
     "axios": "^0.27.2",
     "css-loader": "^6.8.1",
+    "dayjs": "^1.11.10",
     "esbuild-loader": "^2.19.0",
     "js-cookie": "^3.0.5",
     "jwt-decode": "^3.1.2",

diff --git a/public/Logo.svg b/public/Logo.svg
diff --git a/public/index.html b/public/index.html
@@ -4,17 +4,14 @@
     <meta charset="utf-8" />
     <link rel="icon" href="favicon.ico" />
     <meta name="viewport" content="width=device-width, maximum-scale=10" />
-    <meta name="theme-color" content="#000000" />
+    <meta name="theme-color" content="#d9d9d9" />
     <meta
       name="description"
-      content="Web site created using create-react-app"
+      content="졸업생 기업 및 취업정보 공유서비스 롤링입니다."
     />
-    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
     <title>롤링 Rolling</title>
-    <link rel="manifest" href="/manifest.json" />
   </head>
   <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
     <div id="root"></div>
     <div id="modal"></div>
   </body>

diff --git a/public/logo192.png b/public/logo192.png
diff --git a/public/manifest.json b/public/manifest.json
diff --git a/public/robots.txt b/public/robots.txt
diff --git a/src/components/Common/Skeleton/User/index.tsx b/src/components/Common/Skeleton/User/index.tsx
@@ -7,7 +7,7 @@ export default function UserSkeleton() {
       {Array.from({
         length: 15,
       }).map((item, idx) => (
-        <SkeletonBox width="100%" height="900px" key={idx} />
+        <SkeletonBox width="100%" height="400px" key={idx} />
       ))}
     </S.UserSkeletonContainer>
   );

diff --git a/src/components/Common/Skeleton/User/style.ts b/src/components/Common/Skeleton/User/style.ts
@@ -4,7 +4,7 @@ export const UserSkeletonContainer = styled.div`
   width: 100%;
   display: flex;
   flex-direction: column;
-  row-gap: 30px;
+  row-gap: 3rem;
 `;
 
 export const UserInfoSkeletonContainer = styled.div`

diff --git a/src/components/Company/CompanyDetail/CompanyDetailItem/CompanyDetailInfo/Content/style.ts b/src/components/Company/CompanyDetail/CompanyDetailItem/CompanyDetailInfo/Content/style.ts
@@ -79,7 +79,7 @@ export const CompanyAddress = styled.p`
 export const Description = styled.div`
   display: flex;
   column-gap: 5px;
-  line-height: 23px;
+  line-height: 25px;
   font-size: 16px;
   font-weight: 600;
   img {
@@ -89,7 +89,7 @@ export const Description = styled.div`
   p {
     width: 100%;
     font-size: 18px;
-    max-height: 160px;
+    max-height: 200px;
     white-space: pre-wrap;
     overflow-y: scroll;
     padding-left: 10px;

diff --git a/src/components/Company/CompanyDetail/CompanyDetailItem/CompanyDetailInfo/index.tsx b/src/components/Company/CompanyDetail/CompanyDetailItem/CompanyDetailInfo/index.tsx
@@ -11,7 +11,6 @@ import React, { Suspense } from "react";
 import { useSetRecoilState } from "recoil";
 import { CompanyStoryRegistModalAtom } from "@src/stores/company/company.store";
 import StorySkeleton from "@src/components/Common/Skeleton/CompanyDetail/Review";
-import { turnOnModal } from "@src/utils/Modal/turnOnOffModal";
 import { jwtDecoding } from "@src/utils/Auth/jwtDecoding";
 import { useNavigate } from "react-router-dom";
 import { useRollingToast } from "@stubee2/stubee2-rolling-toastify";
@@ -25,15 +24,15 @@ function CompanyDetailInfo({ companyInfo }: Props) {
     CompanyStoryRegistModalAtom
   );
   const { rollingToast } = useRollingToast();
-  const isNotMember = jwtDecoding("authority") === "TEMP";
+  const isNotMember = jwtDecoding("access", "authority") === "TEMP";
   const navigate = useNavigate();
 
   const handleRegistStory = () => {
     if (isNotMember) {
       rollingToast("동문인증이 필요한 기능입니다!", "warning");
       navigate("/graduate/certification");
     } else {
-      turnOnModal(setCompanyStoryRegisterModal);
+      setCompanyStoryRegisterModal(true);
     }
   };
 

diff --git a/src/components/Company/CompanyRegister/Form/index.tsx b/src/components/Company/CompanyRegister/Form/index.tsx
@@ -15,9 +15,7 @@ export default function Form({ setIsOpenModal }: Props) {
     <S.FormContainer>
       <S.FormWrapper onSubmit={attr.handleRegistSubmit}>
         <S.CompanyLogoContainer>
-          <S.CompanyInfoText>
-            기업로고 <span>*</span>
-          </S.CompanyInfoText>
+          <S.CompanyInfoText>기업로고</S.CompanyInfoText>
           <S.CompanyLogoImg
             logo={attr.imgUrl || photo}
             onClick={attr.handleCompanyLogoClick}

diff --git a/src/components/Company/CompanyRegister/Form/style.ts b/src/components/Company/CompanyRegister/Form/style.ts
@@ -93,16 +93,23 @@ export const CompanyAddressInputContainer = styled.div`
 export const SearchButton = styled.div`
   width: 85px;
   height: 60px;
-  font-size: 16px;
-  background: blue;
+
+  font-size: 18px;
   display: flex;
   align-items: center;
   justify-content: center;
-  border-radius: 7px;
+
+  border-radius: 10px;
   background-color: rgba(72, 105, 246, 1);
   font-weight: 600;
+
   color: #fff;
   cursor: pointer;
+
+  transition: all 0.1s ease-in-out;
+  &:active {
+    background-color: rgba(72, 105, 246, 0.85);
+  }
 `;
 
 export const InputStyle = {
@@ -126,20 +133,22 @@ export const ButtonContainer = styled.div`
   justify-content: flex-end;
 
   button {
-    background-color: rgba(72, 105, 246, 1);
     width: 153px;
     height: 50px;
+
     cursor: pointer;
     color: #fff;
     outline: none;
     border: none;
+
     font-weight: 600;
     font-size: 17px;
     border-radius: 7px;
-    transform: scale(1);
+    background-color: rgba(72, 105, 246, 1);
+
     transition: all 0.1s ease-in-out;
-    &:hover {
-      transform: scale(0.985);
+    &:active {
+      background-color: rgba(72, 105, 246, 0.85);
     }
   }
 `;
diff --git a/src/components/Home/Main/Rank/RankItem/index.tsx b/src/components/Home/Main/Rank/RankItem/index.tsx
@@ -6,6 +6,7 @@ import { getDateText } from "@stubee2/stubee2-rolling-util";
 import { useNavigate } from "react-router-dom";
 import logo from "@src/assets/images/Common/Logo.svg";
 import { RankCategoryTitle, RankNumber } from "./style";
+import MainSkeleton from "@src/components/Common/Skeleton/Home/Main";
 
 interface Props {
   rankCategory: string;
@@ -19,49 +20,51 @@ function RankItem({ rankCategory }: Props) {
   const navigate = useNavigate();
 
   return (
-    <S.MainItemContainer>
-      <RankCategoryTitle>
-        <img src={smileFace} alt="이미지 없음" />
-        <p>{getCompanyRankIntroduce(rankCategory)}</p>
-      </RankCategoryTitle>
-      <S.MainItemListContainer>
-        <S.MainItemWrapper>
-          {rankInfoSlicing?.length!! > 0 ? (
-            rankInfoSlicing?.map((item, idx) => (
-              <S.MainItemBox
-                key={item.companyId.id}
-                onClick={() => navigate(`/company/${item.companyId.id}`)}
-              >
-                <RankNumber>{idx + 1}</RankNumber>
+    <>
+      {rankInfoSlicing?.length!! > 0 ? (
+        <S.MainItemContainer>
+          <RankCategoryTitle>
+            <img src={smileFace} alt="이미지 없음" />
+            <p>{getCompanyRankIntroduce(rankCategory)}</p>
+          </RankCategoryTitle>
+          <S.MainItemListContainer>
+            <S.MainItemWrapper>
+              {rankInfoSlicing?.map((item, idx) => (
+                <S.MainItemBox
+                  key={item.companyId.id}
+                  onClick={() => navigate(`/company/${item.companyId.id}`)}
+                >
+                  <RankNumber>{idx + 1}</RankNumber>
 
-                <S.CompanyLogoContainer>
-                  <S.LogoImg src={item.companyDetails.imgUrl || logo} />
-                </S.CompanyLogoContainer>
+                  <S.CompanyLogoContainer>
+                    <S.LogoImg src={item.companyDetails.imgUrl || logo} />
+                  </S.CompanyLogoContainer>
 
-                <S.CompanyContentContainer>
-                  <S.CompanyNameAndCreatedAt>
-                    {item.companyDetails.name} |{" "}
-                    {getDateText(new Date(item.companyDetails.createdAt))}
-                  </S.CompanyNameAndCreatedAt>
+                  <S.CompanyContentContainer>
+                    <S.CompanyNameAndCreatedAt>
+                      {item.companyDetails.name} |{" "}
+                      {getDateText(new Date(item.companyDetails.createdAt))}
+                    </S.CompanyNameAndCreatedAt>
 
-                  <S.CompanyDescriptionAndAddress>
-                    <S.CompanyDescription>
-                      {item.companyDetails.description}
-                    </S.CompanyDescription>
+                    <S.CompanyDescriptionAndAddress>
+                      <S.CompanyDescription>
+                        {item.companyDetails.description}
+                      </S.CompanyDescription>
 
-                    <S.CompanyAddress>
-                      {item.companyDetails.companyAddress.address}
-                    </S.CompanyAddress>
-                  </S.CompanyDescriptionAndAddress>
-                </S.CompanyContentContainer>
-              </S.MainItemBox>
-            ))
-          ) : (
-            <p>랭킹에 등록된 회사들이 없습니다.</p>
-          )}
-        </S.MainItemWrapper>
-      </S.MainItemListContainer>
-    </S.MainItemContainer>
+                      <S.CompanyAddress>
+                        {item.companyDetails.companyAddress.address}
+                      </S.CompanyAddress>
+                    </S.CompanyDescriptionAndAddress>
+                  </S.CompanyContentContainer>
+                </S.MainItemBox>
+              ))}
+            </S.MainItemWrapper>
+          </S.MainItemListContainer>
+        </S.MainItemContainer>
+      ) : (
+        <MainSkeleton />
+      )}
+    </>
   );
 }
 

diff --git a/src/components/Home/Nav/ExternalSite/style.ts b/src/components/Home/Nav/ExternalSite/style.ts
@@ -4,6 +4,7 @@ export const ExternalSiteContainer = styled.div`
   display: flex;
   flex-direction: column;
   row-gap: 1rem;
+  margin-top: 10px;
 `;
 
 export const ExternalSiteTitle = styled.div`

diff --git a/src/components/Home/Nav/UserInfo/style.ts b/src/components/Home/Nav/UserInfo/style.ts
@@ -31,18 +31,21 @@ export const UserInfoBox = styled.div`
 `;
 
 export const UserInfoNickName = styled.p`
-  font-size: 18px;
   height: 20px;
-  font-weight: bold;
+  font-size: 18px;
+
+  font-weight: 600;
   overflow-x: hidden;
   text-overflow: ellipsis;
-  &:hover {
-    color: rgba(72, 105, 246, 1);
-  }
 
   span {
     color: #ec6a5e;
   }
+
+  transition: all 0.1s ease-in-out;
+  &:hover {
+    color: rgba(72, 105, 246, 1);
+  }
 `;
 
 export const UserInfoEmail = styled.p`

diff --git a/src/components/Home/Nav/index.tsx b/src/components/Home/Nav/index.tsx
@@ -19,7 +19,7 @@ export const NavContainer = styled.div`
 
   display: flex;
   flex-direction: column;
-  row-gap: 2rem;
+  row-gap: calc(2rem - 10px);
 
   position: sticky;
   top: calc(90px + 2rem);