main 배포

README.md

@@ -49,31 +49,32 @@
             조승희 <br/>
         </td>
     </tr>
-    </tr>
+
+   <tr>
       <tr align="center">
-      <td >
-       <b>5기</b>
-      </td>
-       <td>
-            <a href="https://github.com/namdaeun" target="_blank" rel="noreferrer noopener">
-              <img src="https://github.com/namdaeun.png" width="50" />
-            </a> 
-        </td>
-        <td >
-            <a href="https://github.com/rtttr1" target="_blank" rel="noreferrer noopener">
-              <img src="https://github.com/rtttr1.png" width="50" />
-            </a>
-        </td>
-    </tr>
-    <tr align="center">
-     <td><sub>25.03 ~ 현재</sup></td>
-        <td>
-            남다은 <br />
-        </td>
-        <td>
-            김규홍 <br/>
-        </td>
+         <td >
+         <b>5기</b>
+         </td>
+           <td >
+               <a href="https://github.com/namdaeun">
+                 <img src="https://github.com/namdaeun.png" width="50" />
+               </a>
+           </td>
+           <td  background-color="white">
+               <a href="https://github.com/rtttr1">
+                 <img src="https://github.com/rtttr1.png" width="50" />
+               </a> 
+           </td>
+       </tr>
+       <tr align="center">
+        <td><sub>25.03 ~ 현재</sup></td>
+           <td>
+               남다은 <br/>
+         </td>
+           <td>
+               김규홍 <br />
+           </td>
+       </tr>
     </tr>
-</tr>
 </table>
 </div>

src/common/components/Layout/components/Head/index.tsx

@@ -1,15 +1,14 @@
-import { IS_MAKERS } from '@constants/mode';
 import { Helmet } from 'react-helmet-async';
 
 const Head = () => {
-  const TOUCH_ICON = IS_MAKERS ? '/makers-touch-icon.png' : '/apple-touch-icon.png';
-  const ICON = IS_MAKERS ? '/makersIcon.svg' : '/icon.svg';
-  const FAVICON = IS_MAKERS ? '/makersFavicon.ico' : '/favicon.ico';
-  const SITE_NAME = `SOPT ${IS_MAKERS ? 'makers ' : ''}리크루팅`;
-  const TITLE = `SOPT ${IS_MAKERS ? 'makers ' : ''}모집 지원하기`;
-  const IMAGE = IS_MAKERS ? '/makersOg.png' : '/imgOg.png';
-  const DESCRIPTION = `SOPT${IS_MAKERS ? ' makers' : ''}의 신입 기수 모집페이지입니다.`;
-  const URL = IS_MAKERS ? 'https://recruiting.sopt.org' : 'https://recruit.sopt.org';
+  const TOUCH_ICON = __IS_MAKERS__ ? '/makers-touch-icon.png' : '/apple-touch-icon.png';
+  const ICON = __IS_MAKERS__ ? '/makersIcon.svg' : '/icon.svg';
+  const FAVICON = __IS_MAKERS__ ? '/makersFavicon.ico' : '/favicon.ico';
+  const SITE_NAME = `SOPT ${__IS_MAKERS__ ? 'makers ' : ''}리크루팅`;
+  const TITLE = `SOPT ${__IS_MAKERS__ ? 'makers ' : ''}모집 지원하기`;
+  const IMAGE = __IS_MAKERS__ ? '/makersOg.png' : '/imgOg.png';
+  const DESCRIPTION = `SOPT${__IS_MAKERS__ ? ' makers' : ''}의 신입 기수 모집페이지입니다.`;
+  const URL = __IS_MAKERS__ ? 'https://recruiting.sopt.org' : 'https://recruit.sopt.org';
 
   return (
     <Helmet>

src/common/components/Layout/components/Header/Nav/MenuList/index.tsx

@@ -9,7 +9,6 @@ import { dimmedBgVar, menuContainerVar, menuList, menuMobListVar } from './style
 import { MENU_ITEMS, MENU_ITEMS_MAKERS } from '../../contants';
 import MenuItem from '../MenuItem';
 import AmplitudeEventTrack from '@components/Button/AmplitudeEventTrack';
-import { IS_MAKERS } from '@constants/mode';
 
 const MenuList = ({ isMenuOpen, onClickMenuToggle }: { isMenuOpen?: boolean; onClickMenuToggle?: () => void }) => {
   const { deviceType } = useDeviceType();
@@ -34,7 +33,7 @@ const MenuList = ({ isMenuOpen, onClickMenuToggle }: { isMenuOpen?: boolean; onC
   const {
     recruitingInfo: { name },
   } = useRecruitingInfo();
-  const menuItems = IS_MAKERS ? MENU_ITEMS_MAKERS : MENU_ITEMS;
+  const menuItems = __IS_MAKERS__ ? MENU_ITEMS_MAKERS : MENU_ITEMS;
   const handleLogout = () => {
     reset();
     localStorage.removeItem('soptApplyAccessToken');

src/common/components/Layout/components/Header/index.tsx

@@ -10,7 +10,6 @@ import Nav from './Nav';
 import MenuList from './Nav/MenuList';
 import { containerSizeVer, containerVar, logoVar } from './style.css';
 import SoptLogo from '@assets/SoptLogo';
-import { IS_MAKERS } from '@constants/mode';
 
 const Header = () => {
   const { deviceType } = useDeviceType();
@@ -36,11 +35,11 @@ const Header = () => {
   const logoVariant = logoVar[deviceType];
   return (
     <>
-      {IS_MAKERS != undefined && (
+      {__IS_MAKERS__ != undefined && (
         <>
           <header className={`${containerVar[isMenuOpen ? 'open' : 'default']} ${containerSizeVer[deviceType]}`}>
             <button onClick={handleClickLogo} style={{ cursor: 'pointer' }}>
-              {IS_MAKERS ? (
+              {__IS_MAKERS__ ? (
                 !isMenuOpen && isLight ? (
                   <MakersLogo className={logoVariant} />
                 ) : (

src/styles/theme.css.ts

@@ -2,6 +2,25 @@ import { colors } from '@sopt-makers/colors';
 import { fontsObject } from '@sopt-makers/fonts';
 import { createTheme, createThemeContract } from '@vanilla-extract/css';
 
+const primaryColor = () => {
+  if (__IS_MAKERS__) {
+    return {
+      // makers 기본 컬러
+      primary: colors.gray600,
+      primaryLight: colors.gray30,
+      primaryDark: colors.gray950,
+      primaryLinear: 'linear-gradient(rgba(63, 63, 71, 0.3) 0%, rgba(63, 63, 71, 1) 45%, rgba(63, 63, 71, 0.3) 100%)',
+    };
+  }
+  return {
+    // 기수 컬러 (매 기수마다 변경 필요)
+    primary: '#FF5976',
+    primaryLight: '#66242F',
+    primaryDark: '#FF5976',
+    primaryLinear: '#613039',
+  };
+};
+
 const color = createThemeContract({
   primary: null, // 기수 컬러
   primaryLight: null, // 기수 컬러 밝게
@@ -37,14 +56,10 @@ const color = createThemeContract({
 });
 
 export const light = createTheme(color, {
-  primary: '#FF5976',
-  primaryLight: '#66242F',
-  primaryDark: '#FF5976',
-  primaryLinear: '#613039',
-  // primary: colors.gray600,
-  // primaryLight: colors.gray30,
-  // primaryDark: colors.gray950,
-  // primaryLinear: 'linear-gradient(rgba(63, 63, 71, 0.3) 0%, rgba(63, 63, 71, 1) 45%, rgba(63, 63, 71, 0.3) 100%)',
+  primary: primaryColor().primary,
+  primaryLight: primaryColor().primaryLight,
+  primaryDark: primaryColor().primaryDark,
+  primaryLinear: primaryColor().primaryLinear,
   error: colors.error,
 
   background: colors.white,
@@ -74,14 +89,10 @@ export const light = createTheme(color, {
 });
 
 export const dark = createTheme(color, {
-  primary: '#FF5976',
-  primaryLight: '#66242F',
-  primaryDark: '#FF5976',
-  primaryLinear: '#613039',
-  // primary: colors.gray600,
-  // primaryLight: colors.gray30,
-  // primaryDark: colors.gray950,
-  // primaryLinear: 'linear-gradient(rgba(63, 63, 71, 0.3) 0%, rgba(63, 63, 71, 1) 45%, rgba(63, 63, 71, 0.3) 100%)',
+  primary: primaryColor().primary,
+  primaryLight: primaryColor().primaryLight,
+  primaryDark: primaryColor().primaryDark,
+  primaryLinear: primaryColor().primaryLinear,
   error: colors.error,
 
   background: colors.gray950,

src/views/ApplyPage/components/ApplyHeader/index.tsx

@@ -4,7 +4,6 @@ import { useDeviceType } from 'contexts/DeviceTypeProvider';
 import { useRecruitingInfo } from 'contexts/RecruitingInfoProvider';
 
 import { buttonWrapper, headerContainerVar } from './style.css';
-import { IS_MAKERS } from '@constants/mode';
 
 interface ApplyHeaderProps {
   isReview?: boolean;
@@ -22,7 +21,7 @@ const ApplyHeader = ({ isLoading, onSaveDraft, onSubmitData, isReview = false }:
   return (
     <header className={headerContainerVar[deviceType]}>
       <Title>
-        {season}기 {IS_MAKERS ? soptName : group} 지원서
+        {season}기 {__IS_MAKERS__ ? soptName : group} 지원서
       </Title>
       {!isReview && deviceType !== 'MOB' && (
         <div className={buttonWrapper}>

src/views/ApplyPage/components/BottomSection/index.tsx

@@ -6,7 +6,6 @@ import { useDeviceType } from 'contexts/DeviceTypeProvider';
 import { SELECT_OPTIONS } from 'views/ApplyPage/constant';
 
 import { doubleLineCheck, labelVar, line, sectionContainer } from './style.css';
-import { IS_MAKERS } from '@constants/mode';
 
 interface BottomSectionProps {
   isReview?: boolean;
@@ -19,7 +18,7 @@ const BottomSection = ({ knownPath, isReview = false }: BottomSectionProps) => {
   return (
     <section className={sectionContainer}>
       <hr className={line} />
-      {!IS_MAKERS && (
+      {!__IS_MAKERS__ && (
         <SelectBox
           label="동아리를 알게 된 경로"
           name="knownPath"
@@ -32,7 +31,7 @@ const BottomSection = ({ knownPath, isReview = false }: BottomSectionProps) => {
       )}
       <div id="check-necessary" className={doubleLineCheck}>
         <p className={labelVar[deviceType]}>
-          {IS_MAKERS
+          {__IS_MAKERS__
             ? 'SOPT makers의 행사 및 정기 모임은 일요일에 진행됩니다.'
             : 'SOPT의 행사 및 세미나는 매주 토요일에 진행됩니다.'}
         </p>

src/views/ApplyPage/components/DefaultSection/index.tsx

@@ -26,7 +26,6 @@ import {
   sectionContainerVar,
 } from './style.css';
 import { getMostRecentSeasonArray } from './utils';
-import { IS_MAKERS } from '@constants/mode';
 
 interface ProfileImageProps {
   disabled: boolean;
@@ -223,11 +222,11 @@ const DefaultSection = ({ refCallback, isReview = false }: DefaultSectionProps)
                 ? undefined
                 : !leaveAbsence
                   ? SELECT_OPTIONS.leaveAbsence[0]
-                  : IS_MAKERS
+                  : __IS_MAKERS__
                     ? SELECT_OPTIONS.leaveAbsenceMakers[1]
                     : SELECT_OPTIONS.leaveAbsence[1]
             }
-            label={IS_MAKERS ? SELECT_OPTIONS.leaveAbsenceMakers : SELECT_OPTIONS.leaveAbsence}
+            label={__IS_MAKERS__ ? SELECT_OPTIONS.leaveAbsenceMakers : SELECT_OPTIONS.leaveAbsence}
             name="leaveAbsence"
             required
             disabled={isReview}
@@ -252,14 +251,14 @@ const DefaultSection = ({ refCallback, isReview = false }: DefaultSectionProps)
               ? undefined
               : univYear !== 5
                 ? `${univYear}학년`
-                : IS_MAKERS
+                : __IS_MAKERS__
                   ? SELECT_OPTIONS.univYearMakers.slice(-1)[0]
                   : SELECT_OPTIONS.univYear.slice(-1)[0]
           }
           label="학년"
           name="univYear"
           placeholder="학년을 선택해주세요."
-          options={IS_MAKERS ? SELECT_OPTIONS.univYearMakers : SELECT_OPTIONS.univYear}
+          options={__IS_MAKERS__ ? SELECT_OPTIONS.univYearMakers : SELECT_OPTIONS.univYear}
           required
           disabled={isReview}
         />
@@ -269,7 +268,7 @@ const DefaultSection = ({ refCallback, isReview = false }: DefaultSectionProps)
         label="이전 기수 활동 여부 (제명 포함)"
         name="mostRecentSeason"
         placeholder="가장 최근에 활동했던 기수를 선택해주세요."
-        options={getMostRecentSeasonArray(season || 0, IS_MAKERS || false)}
+        options={getMostRecentSeasonArray(season || 0, __IS_MAKERS__ || false)}
         required
         size="lg"
         disabled={isReview}

src/views/ApplyPage/constant.ts

@@ -1,5 +1,3 @@
-import { IS_MAKERS } from '@constants/mode';
-
 export const APPLY_INFO = {
   sections: [
     {
@@ -15,7 +13,9 @@ export const APPLY_INFO = {
       id: 1,
       content: [
         {
-          text: `${IS_MAKERS ? '8월 31일 일요일 ' : '9월 27일 토요일 '}OT(오프라인 예정)에 불참 시 지원이 불가하오니 자세히 확인 바랍니다.`,
+          text: `${
+            __IS_MAKERS__ ? '8월 31일 일요일 ' : '9월 27일 토요일 '
+          }OT(오프라인 예정)에 불참 시 지원이 불가하오니 자세히 확인 바랍니다.`,
           weight: 'normal',
         },
       ],

src/views/ApplyPage/index.tsx

@@ -28,7 +28,6 @@ import { buttonWrapper, container, formContainerVar } from './style.css';
 import useDialog from '@hooks/useDialog';
 import BigLoading from 'views/loadings/BigLoding';
 import type { ApplyRequest } from './types';
-import { IS_MAKERS } from '@constants/mode';
 
 const DraftDialog = lazy(() => import('views/dialogs').then(({ DraftDialog }) => ({ default: DraftDialog })));
 const PreventApplyDialog = lazy(() =>
@@ -208,7 +207,7 @@ const ApplyPage = ({ onSetComplete }: ApplyPageProps) => {
 
   // 11. 지원 기간 아니면 에러 페이지 띄우기
   const { NoMoreApply } = useDate();
-  if (NoMoreApply) return <NoMore isMakers={IS_MAKERS} content="모집 기간이 아니에요" />;
+  if (NoMoreApply) return <NoMore isMakers={__IS_MAKERS__} content="모집 기간이 아니에요" />;
 
   // 13. data 전송 로직
   const partQuestionsData = partQuestions?.find((q) => q.part === getValues('part'));
@@ -226,7 +225,7 @@ const ApplyPage = ({ onSetComplete }: ApplyPageProps) => {
     const leaveAbsence =
       getValues('leaveAbsence') == undefined ? undefined : getValues('leaveAbsence') === '재학' ? false : true;
     const univYear =
-      (IS_MAKERS ? SELECT_OPTIONS.univYearMakers : SELECT_OPTIONS.univYear).indexOf(univYearValue) + 1 || undefined;
+      (__IS_MAKERS__ ? SELECT_OPTIONS.univYearMakers : SELECT_OPTIONS.univYear).indexOf(univYearValue) + 1 || undefined;
 
     const commonAnswers =
       Array.isArray(commonQuestionIds) && commonQuestionIds.length > 0

src/views/CompletePage/index.tsx

@@ -6,7 +6,6 @@ import { useRecruitingInfo } from 'contexts/RecruitingInfoProvider';
 import Survey from './components/Survey';
 import IconCheckmark from './icons/IconCheckmark';
 import { container, iconVar, mainTextVar, subTextVar } from './style.css';
-import { IS_MAKERS } from '@constants/mode';
 
 const CompletePage = () => {
   const { deviceType } = useDeviceType();
@@ -26,7 +25,7 @@ const CompletePage = () => {
       <p
         className={
           mainTextVar[deviceType]
-        }>{`${name}님의\n${season}기 ${IS_MAKERS ? soptName : group} 지원서가 접수되었습니다.`}</p>
+        }>{`${name}님의\n${season}기 ${__IS_MAKERS__ ? soptName : group} 지원서가 접수되었습니다.`}</p>
       <p className={subTextVar[deviceType]}>이메일로 지원 접수 완료 알림이 발송되었습니다.</p>
       <Callout
         style={{

src/views/MyPage/index.tsx

@@ -17,7 +17,6 @@ import {
   infoValueVar,
   buttonWidthVar,
 } from './style.css';
-import { IS_MAKERS } from '@constants/mode';
 
 const NoMore = lazy(() => import('views/ErrorPage/components/NoMore'));
 
@@ -59,7 +58,7 @@ const MyPage = ({ part, applicationPass }: MyPageProps) => {
   const { NoMoreReview, NoMoreScreeningResult, NoMoreFinalResult, NoMoreRecruit, isLoading } = useDate();
 
   if (isLoading) return <BigLoading />;
-  if (NoMoreRecruit) return <NoMore isMakers={IS_MAKERS} content="모집 기간이 아니에요" />;
+  if (NoMoreRecruit) return <NoMore isMakers={__IS_MAKERS__} content="모집 기간이 아니에요" />;
 
   return (
     <section className={containerVar[deviceType]}>

src/views/PasswordPage/index.tsx

@@ -7,7 +7,6 @@ import BigLoading from 'views/loadings/BigLoding';
 
 import PasswordForm from './components/PasswordForm';
 import { containerVar } from './style.css';
-import { IS_MAKERS } from '@constants/mode';
 
 const NoMore = lazy(() => import('views/ErrorPage/components/NoMore'));
 
@@ -16,7 +15,7 @@ const PasswordPage = () => {
   const { NoMoreRecruit, isLoading } = useDate();
 
   if (isLoading) return <BigLoading />;
-  if (NoMoreRecruit) return <NoMore isMakers={IS_MAKERS} content="모집 기간이 아니에요" />;
+  if (NoMoreRecruit) return <NoMore isMakers={__IS_MAKERS__} content="모집 기간이 아니에요" />;
 
   return (
     <div className={containerVar[deviceType]}>