일부 수정 내용 메인 머지 진행 (#428)

public/images/16th/icon/index.ts

@@ -1,4 +1,5 @@
 export * from './popup';
 export * from './common';
 export * from './blog';
-export * from './fab';
+export * from './fab';
+export * from './recruit'

public/images/16th/icon/recruit/index.ts

@@ -0,0 +1,2 @@
+export { default as ic_arrow_black_accordion } from './arrow_b.svg';
+export { default as ic_arrow_white_accordion } from './arrow_w.svg'

src/components/Blog/BlogPostThumbnail.tsx

@@ -68,7 +68,7 @@ const articleCss = css`
   ${mediaQuery('tablet')} {
   }
   ${mediaQuery('mobile')} {
-    height: 180px;
+    height: 220px;
     max-width: 460px;
   }
   &:hover {

src/components/FAB/FloatingActionButton.tsx

@@ -2,6 +2,7 @@ import React, { useEffect, useRef, useState } from 'react';
 import { css } from '@emotion/react';
 
 import { DEPROMEET_EMAIL, DEPROMEET_KAKAO_PLUS_FRIEND } from '~/constant/depromeet';
+import { theme } from '~/styles/theme';
 
 import { Icon } from '../Icon/Icon';
 
@@ -115,6 +116,7 @@ const menuStyle = css`
 `;
 
 const menuItemStyle = css`
+  ${theme.typosV2.pretendard.semibold14}
   background-color: #333;
   color: #fff;
   padding: 12px 24px;

src/components/FAQ/FAQItem.tsx

@@ -25,11 +25,7 @@ export function FAQItem({ isOpen, onClickOpenButton, question, answer }: FAQItem
           transition={{ duration: 0.3, ease: 'easeOut' }}
           css={theme => arrowContainerCss(theme, isOpen)}
         >
-          <Icon
-            icon={isOpen ? 'ic_arrow_white' : 'ic_arrow_black'}
-            direction={isOpen ? 'up' : 'down'}
-            size={24}
-          />
+          <Icon icon={isOpen ? 'ic_arrow_white_accordion' : 'ic_arrow_black_accordion'} size={24} />
         </motion.div>
       </motion.div>
       <motion.div

src/components/Supports/Supports.tsx

@@ -1,3 +1,4 @@
+import { useRouter } from 'next/router';
 import { css } from '@emotion/react';
 
 import { SUPPORTS } from '~/constant/supports';
@@ -9,12 +10,14 @@ import { SupportThumbnail } from './SupportThumbnail';
 
 export const Supports = () => {
   const { isTargetSize: isMobileSize } = useCheckWindowSize('mobile');
+  const { pathname } = useRouter();
+  const isAboutPage = pathname === '/about';
 
   return (
     <div css={[layoutCss]}>
-      <h1 css={introCss.headline}>후원사</h1>
-      <p css={introCss.description}>
-        디프만은 IT비영리단체로 후원을 통해 {isMobileSize && <br />}더 많은 교육 기회에 도움을 받고
+      <h1 css={introCss.headline(isAboutPage)}>후원사</h1>
+      <p css={introCss.description(isAboutPage)}>
+        디프만은 IT 비영리단체로 후원을 통해 {isMobileSize && <br />}더 많은 교육 기회에 도움을 받고
         있습니다.
       </p>
 
@@ -36,20 +39,20 @@ const layoutCss = css`
 `;
 
 const introCss = {
-  headline: css`
-    ${theme.typosV2.pretendard.bold44}
+  headline: (isAboutPage = false) => css`
     line-height: 150%;
+    ${isAboutPage ? theme.typosV2.pretendard.bold32 : theme.typosV2.pretendard.bold44}
     color: ${theme.colors.white};
 
     ${mediaQuery('mobile')} {
       ${theme.typosV2.pretendard.bold28}
       line-height: 150%;
     }
   `,
-  description: css`
-    ${theme.typosV2.pretendard.semibold20}
+  description: (isAboutPage = false) => css`
+    ${isAboutPage ? theme.typosV2.pretendard.semibold18 : theme.typosV2.pretendard.semibold20}
     line-height: 150%;
-    margin-top: 42px;
+    margin-top: 24px;
     text-align: center;
     color: ${theme.colors.white};
 

src/constant/faq.ts

@@ -18,7 +18,7 @@ export const FAQS: FAQType[] = [
     group: '지원 자격',
     question: '관련 경험이 없어도 지원 가능한가요?',
     answer:
-      '관련 직무 경험이 없어도 지원 가능하지만, UI/UX Designer 직군은 지원 시 포트폴리오 제출이 필수입니다.',
+      '관련 직무 경험이 없어도 지원 가능하지만, Product Designer 직군은 지원 시 포트폴리오 제출이 필수입니다.',
   },
   {
     group: '지원 자격',

src/constant/offline.ts

@@ -4,34 +4,39 @@ export const REGULARS_SESSIONS = [
   {
     title: '오리엔테이션',
     description: '디프만의 첫 시작, 서로를 알아갈 수 있는 오리엔테이션에 모두가 함께 해요.',
-    img: '/images/offline-session/orientation.png',
+    img: '/images/16th/about/session/orientation.png',
   },
   {
     title: '기획 발표',
     description:
       '팀별 핵심 가설 검증 과정과 인사이트를 공유하는 시간을 가져요. 피드백을 통해 기획 구체화에 도움을 얻어요.',
-    img: '/images/offline-session/networking.png',
+    img: '/images/16th/about/session/planing.png',
   },
   {
     title: '사용성 테스트',
     description: '사용성 테스트를 통해 문제를 발견하고 개선하여 더 가치있는 서비스를 만들어요.',
-    img: '/images/offline-session/usability.png',
+    img: '/images/16th/about/session/usability.png',
   },
   {
     title: '중간발표',
     description: '각 팀의 진행 상황을 공유하며 실질적인 피드백을 주고 받을 수 있어요.',
-    img: '/images/offline-session/midterm.png',
+    img: '/images/16th/about/session/midterm.png',
   },
   {
     title: '해커톤',
     description:
       '모든 팀이 함께 모여 스프린트 단위로 시간을 나누어 주요 기능을 집중 개발 할 수 있는 시간을 가져요.',
-    img: '/images/offline-session/launching.png',
+    img: '/images/16th/about/session/hackerton.png',
   },
   {
     title: '런칭데이',
     description: '런칭된 서비스를 팀 부스에서 공개해요. 모든 팀의 서비스를 사용해볼 수 있어요.',
-    img: '/images/offline-session/final.png',
+    img: '/images/16th/about/session/launching.png',
+  },
+  {
+    title: '최종발표',
+    description: '런칭된 서비스를 팀 부스에서 공개해요. 모든 팀의 서비스를 사용해볼 수 있어요.',
+    img: '/images/16th/about/session/final.png',
   },
 ];
 
@@ -40,36 +45,42 @@ export const ACTIVITIES = [
     title: '연사 초청',
     description:
       '외부 연사 초청을 통해 다양한 세미나가 진행돼요. 연사분들의 경험이나 전문성을 바탕으로 인사이트를 얻고 성장해요.',
-    img: '/images/offline-session/orientation.png',
+    img: '/images/16th/about/activity/invite.png',
   },
   {
     title: '네트워킹 데이',
     description: '다른 팀, 직군의 디퍼들을 만나요. TMI부터 커리어 토크까지 친해지는 시간을 가져요.',
-    img: '/images/offline-session/networking.png',
+    img: '/images/16th/about/activity/networking.png',
   },
   {
     title: '스터디',
     description:
       '자율적으로 스터디를 개설하고, 참여할 수 있는 기회를 제공해요. 스터디를 통해네트워킹 기회도 함께 가져요.',
-    img: '/images/offline-session/usability.png',
+    img: '/images/16th/about/activity/study.png',
   },
   {
     title: '커피챗',
+    description:
+      '취업, 이직, 커리어 고민이 있는 멤버분들을 위해 이전 기수 멘토와의 커피챗 기회를 제공해요.',
+    img: '/images/16th/about/activity/chat.png',
+  },
+  {
+    title: '게더링',
     description:
       '24시간 제한없는 게더 공간을 통해 팀 미팅 외에도 다른 팀, 직군의 디퍼와 가까워질 수 있는 기회를 제공해요.',
-    img: '/images/offline-session/midterm.png',
+    img: '/images/16th/about/activity/gathering.png',
   },
   {
     title: '번개모임',
     description:
       '관심사별 활동 등 다양한 이벤트를 열어 다른 팀, 직군의 디퍼와 친해질 수 있는 다양한 네트워킹 기회를 제공해요. ',
-    img: '/images/offline-session/launching.png',
+    img: '/images/16th/about/activity/club.png',
   },
   {
     title: 'MT',
     description:
       '프로젝트에 잠시 벗어나 디퍼들이 서로 가까워질 수 있는 기회와 잊지 못할 즐거운 추억을 만들어요.',
-    img: '/images/offline-session/final.png',
+    img: '/images/16th/about/activity/mt.png',
   },
 ];
 
@@ -109,14 +120,14 @@ export const OFFLINE_SESSIONS = [
     title: 'LAUNCHING DAY',
     subTitle: '런칭데이',
     description: '런칭된 서비스를 팀 부스에서 공개해요. 모든 팀의 서비스를 사용해볼 수 있어요.',
-    img: '/images/offline-session/launching.png',
+    img: '/images/16th/about/session/launching.png',
     titleTextColor: colors.pink,
   },
   {
     title: 'FINAL ANNOUNCE',
     subTitle: '최종발표',
     description: '서비스의 성과와 그 과정을 공유 및 회고하며 프로젝트를 마무리해요.',
-    img: '/images/offline-session/final.png',
+    img: '/images/16th/about/session/final.png',
     titleTextColor: colors.purple,
   },
 ];

src/features/Blog/BlogContentSection.tsx

@@ -74,5 +74,6 @@ const blogContainerCss = css`
   }
   ${mediaQuery('mobile')} {
     grid-template-columns: repeat(1, 1fr);
+    gap: 20px;
   }
 `;

src/features/Blog/BlogSubscribeSection.tsx

@@ -81,8 +81,4 @@ const linkCss = (theme: Theme) => css`
   color: white;
   background-color: black;
   text-align: center;
-
-  &:hover {
-    color: ${theme.colors.pink};
-  }
 `;

src/features/Main/sections/MainProjectSection.tsx

@@ -38,8 +38,7 @@ export const MainProjectSection = () => {
         <h1 css={text.headlineCss}>프로젝트</h1>
         <p css={text.descriptionCss}>
           디프만 멤버 &apos;디퍼(DEEPER)&apos; 들의
-          {isMobileSize && <br />}
-          다양한 프로젝트를 확인해보세요
+          {isMobileSize && <br />} 다양한 프로젝트를 확인해보세요
         </p>
       </div>