fix : styled-component 빌드 에러 수정 (issue #266)

src/components/manageProjects/Card.styled.ts

@@ -54,7 +54,7 @@ export const CardTitle = styled.h3`
 export const RecruitmentDate = styled.small`
   font-size: ${({ theme }) => theme.heading.small.fontSize};
   font-weight: 400;
-  color: ${({ theme }) => theme.color.deepgrey};
+  color: ${({ theme }) => theme.color.deepGrey};
   margin-bottom: 0.25rem;
 
   @media ${({ theme }) => theme.mediaQuery.tablet} {
@@ -66,7 +66,7 @@ export const RecruitmentDate = styled.small`
 export const TotalMember = styled.small`
   font-size: ${({ theme }) => theme.heading.small.fontSize};
   font-weight: 400;
-  color: ${({ theme }) => theme.color.deepgrey};
+  color: ${({ theme }) => theme.color.deepGrey};
   margin-bottom: 1.125rem;
 
   @media ${({ theme }) => theme.mediaQuery.tablet} {

src/components/manageProjects/RecruitmentDate.styled.ts

@@ -32,7 +32,7 @@ export const DateTag = styled.span`
 export const Period = styled.small`
   font-size: ${({ theme }) => theme.heading.small.fontSize};
   font-weight: 500;
-  color: ${({ theme }) => theme.color.deepgrey};
+  color: ${({ theme }) => theme.color.deepGrey};
 
   @media ${({ theme }) => theme.mediaQuery.tablet} {
     font-size: ${({ theme }) => theme.heading.small.tabletFontSize};

src/pages/apply/Apply.styled.ts

@@ -58,7 +58,7 @@ export const Section = styled.div`
 export const Label = styled.label`
   font-size: 1.2rem;
   font-weight: bold;
-  color: ${({ theme }) => theme.color.black};
+  color: ${({ theme }) => theme.color.primary};
 
   @media ${({ theme }) => theme.mediaQuery.tablet} {
     font-size: 1.1rem;

src/pages/apply/ApplyStep.styled.ts

@@ -52,7 +52,7 @@ export const StepButton = styled.div`
 export const StepLabel = styled.div`
   font-size: 1rem;
   font-weight: bold;
-  color: ${({ theme }) => theme.color.black};
+  color: ${({ theme }) => theme.color.primary};
   margin-bottom: 10px;
 
   @media ${({ theme }) => theme.mediaQuery.tablet} {

src/style/theme.ts

@@ -30,7 +30,7 @@ export type BorderRadiusSize = 'primary' | 'large' | 'small';
 
 export type MediaQuery = 'mobile' | 'tablet' | 'desktop';
 
-interface Theme {
+export interface Theme {
   color: Record<ColorKey, string>;
   heading: {
     [key in HeadingSize]: {

src/styled.d.ts

@@ -0,0 +1,6 @@
+import 'styled-components';
+import { Theme } from './style/theme';
+
+declare module 'styled-components' {
+  export interface DefaultTheme extends Theme {}
+}

tsconfig.app.json

@@ -22,5 +22,5 @@
     "noFallthroughCasesInSwitch": true,
     "noUncheckedSideEffectImports": true
   },
-  "include": ["src"]
+  "include": ["src", "src/styled.d.ts"]
 }